Windows 7 リボン

  • [アーティクル]

Note

この設計ガイドは Windows 7 用に作成されたものであり、新しいバージョンの Windows 用には更新されていません。 ガイダンスの多くは引き続き原則として適用されますが、プレゼンテーションと例には現在の設計ガイダンスは反映されていません。

リボンは、ユーザーが最小限のクリック数でコマンドを効率的かつ直接検索、把握、使用するのに役立つ最新の方法です。試行錯誤の必要が減り、ヘルプを参照する必要もありません。

リボンは、プログラムの機能が、ウィンドウ上部にある一連のタブに整理されるコマンド バーです。 リボンを使用すると、機能を見つけやすくなり、プログラム全体をすばやく習得できます。また、ユーザーはプログラムのエクスペリエンスをより細かくカスタマイズできるようになります。 リボンにより、従来のメニュー バーとツール バーの両方を置き換えることができます。

リボンのスクリーンショット

一般的なリボン。

リボン タブはグループで構成されます。グループは、密接に関連性のあるコマンドのラベル付きセットです。 タブとグループに加えて、リボンは次のもので構成されます。

  • [アプリケーション] ボタン。ファイル関連のコマンドなど、ドキュメントやワークスペースに対して、またはドキュメントやワークスペースに対して何らかの作業を実行するコマンドのメニューが表示されます。
  • クイック アクセス ツール バーは、頻繁に使用するコマンドを表示できる、カスタマイズ可能な小さいツール バーです。
  • コア タブとは、常に表示されるタブのことです。
  • コンテキスト タブは、特定のオブジェクトの種類が選択されている場合のみ表示されます。 常に表示されるタブはコア タブと呼ばれます。
  • タブ セットは、1 つのオブジェクトの種類のコンテキスト タブのコレクションです。 オブジェクトは複数の種類の可能性があります (たとえば、図を含む表内のヘッダーは 3 種類です)。また、一度に複数のコンテキスト タブ セットを表示できます。
  • モーダル タブ。これは、特定の一時モード (印刷プレビューなど) で表示されるコア タブです。
  • ギャラリー。これは、グラフィカルに表示されるコマンドまたはオプションの一覧です 結果ベースのギャラリーは、コマンド自体ではなく、コマンドまたはオプションの効果を示しています。 リボン内ギャラリーは、ポップアップ ウィンドウではなくリボン内に表示されます。
  • 拡張ツールヒント。関連するコマンドを簡潔に説明し、ショートカット キーが表示されます。 さらに、グラフィックスやヘルプへの参照が含まれていることがあります。 拡張ツールヒントにより、コマンド関連のヘルプの必要性が軽減されます。
  • ダイアログ ボックス起動ツール。これは、グループに関連する機能を含むダイアログ ボックスを開く、一部のグループの下部にあるボタンです。

リボンは、最初は Microsoft Office 2007 で導入されました。 Office でリボンを使用する必要がある理由と、リボンを使用することで解決される多くの問題については、「リボンの歴史」をご覧ください。

Note

メニュー、ツール バー、コマンド ボタン、アイコンに関連するガイドラインについては、別の記事で説明します。

これが適切なユーザー インターフェイスであるかどうか

リボンの使用を判断するには、次の質問を検討してください。

プログラムの種類

  • どのような種類のプログラムを設計しようとしているでしょうか? プログラムの種類は、リボンが合っているかどうかを判断するのにふさわしいインジケーターです。 リボンは、ドキュメントの作成やオーサリング プログラムだけでなく、ドキュメント ビューアーやブラウザーにも適しています。 他の種類のプログラムにもリボンを使用できるかもしれませんが、他の形式のコマンド表示の方が適切な可能性があります。 通常、軽量のプログラムには軽量のコマンド表示が合っています。

見つけやすさと学習の問題

  • ユーザーがコマンドを見つける際に問題があるでしょうか? ユーザーは、プログラム内に既に存在する機能を要求しているでしょうか? その場合、リボンを使用して、わかりやすいラベルを付け、関連するコマンドをグループ化することにより、コマンドが見つけやすくなります。 さらに、リボンは、メニュー バーやツール バーよりも拡張に向いているため、将来成長したときにも対応できます。
  • ユーザーがプログラムのコマンドを理解する点で問題があるでしょうか? 適切なコマンドを選択したり、コマンドの動作を判断したりする際に、試行錯誤することがよくありますか? その場合、ギャラリーとライブ プレビューをベースとした結果指向のコマンドをリボンに表示すれば、コマンドを把握しやすくなります。

コマンドの特性

  • コマンドが複数の場所に表示されているでしょうか? プログラムが既に存在する場合、メニュー バー、ツール バー、作業ウィンドウ、作業領域内にコマンドが表示されているでしょうか? その場合、リボンを使用すると、コマンドが 1 つの場所に統合されて見つけやすくなります。
  • コマンドはウィンドウ全体に適用されますか? それとも、特定のウィンドウにのみ適用されますか? リボンは、ウィンドウ全体や特定のオブジェクトに適用されるコマンドに最適です。 インプレース コマンドは、個々のウィンドウ ペインに適しています。
  • ほとんどのコマンドを直接表示できるでしょうか? つまり、ユーザーは 1 回のクリックで操作できるでしょうか? よく使用されるコマンドにメニューやダイアログ ボックスからアクセスする場合、直接リファクタリングできますか? 一部のコマンドは、メニューとダイアログ ボックスを使って表示できますが、ほとんどのコマンドはこの方法で表示するとリボンの効率が下がり、メニュー バーから選択する方が効率が上がる可能性があります。

コマンド スケール

  • コマンドの数が少ないでしょうか? 最も頻繁に使用されるコマンドを 1 つのシンプルなツール バーに簡単に表示できるでしょうか? コア タブとコンテキスト タブを追加することで、最も一般的なタスクを単独で実行できるシンプルな [ホーム] タブができあがる場合、リボンを使用する価値があります。 そうでない場合、少ないコマンドに対して余分な重みが生じるため、リボンを使用する正当なメリットがない可能性があります。
  • コマンドの数が多いでしょうか? リボンを使用するには 7 つ以上のコア タブが必要になるでしょうか? ユーザーが一般的なタスクを実行するためにタブを頻繁に変更する必要があるでしょうか? その場合、ツール バー (タブの変更は不要) とパレット ウィンドウ (タブの変更が必要になることがありますが、一度に複数のタブを開くことができます) を使用する方が効率的な選択肢になるかもしれません。
  • ほとんどの場合、ユーザーは少数のコマンドを使用する傾向があるでしょうか? その場合、そのようなコマンドを [ホーム] タブに配置することで、リボンを効率的に使用できます。タブを頻繁に変更すると、リボンの効率が大幅に低下します。
  • プログラムのコンテンツ領域をできる限り大きくすることでプログラムにメリットがもたらされるでしょうか? その場合、メニュー バーと 1 つのツール バーを使用すれば、リボンよりスペース効率が高くなります。 ただし、プログラムで 3 行以上のツール バーが必要な場合や作業ウィンドウを使用する場合、リボンを使用する方がスペース効率が高くなります。
  • ユーザーには、プログラム内の大きなウィンドウ内の特定の領域で長時間作業する傾向があるでしょうか? その場合、ミニ ツールバー、パレット ウィンドウ、ダイレクト コマンドを近づけることにメリットがあるでしょう。 作業領域からリボンに行ったり来たりすると、効率がかなり低下します。
  • 効率と柔軟性を高めるため、ユーザーはコマンド表示の内容、場所、サイズを大幅に変更する必要があるでしょうか? その場合、カスタマイズおよび拡張可能なツール バーとパレット ウィンドウを選択することをお勧めします。 一部の種類のツール バーをドッキング解除してパレット ウィンドウにしたり、パレット ウィンドウを移動したり、サイズ変更したり、カスタマイズしたりできます。

最後に、この究極の質問について考えてみましょう。見つけやすさ、学習のしやすさ、効率性、生産性の向上は、追加のスペースのコストと、コマンドを整理するタブの必要性に見合う価値があるでしょうか? そうであれば、リボンを使用するのが最適な選択肢です。 よくわからない場合は、リボン ベースのデザインのユーザビリティ テストを実施し、最適な代替案と比較することを検討してください。

リボンは、コマンド表示の新しい魅力的な形式であり、プログラムを最新化するための優れた方法です。 しかし、魅力的ではあるものの、すべてのプログラムにとって適切な選択というわけではありません。

誤った例:

電卓におけるリボンのスクリーンショット

お勧めしない事柄

7 つの最も重要な事柄

  1. プログラムの種類に適したコマンド ソリューションを選択してください。 リボンを使用することにより、プログラムがよりシンプルかつ効率的で使いやすくなるべきです。決してその逆であってはなりません。 リボンの使用が適切でない場合、代わりにリッチ コマンドを使用することを検討してください。
  2. 効果的なリボンを作成することの難しさを過小評価しないでください。 既存のメニュー バーとツール バーの単純な移植であるとは考えないでください。 また、リボンを使用するとプログラムが自動的に改善されると考えないでください。 コマンドの再設計に必要な時間や労力を惜しまないことは、リボンの使用を決定する上で重要な要素です。
  3. コマンドを見つけやすくしてください。 コマンドと、それらが存在するわかりやすいラベルが付いたタブの間に、明確でわかりやすい一意のマッピングがあるタブ デザインを選択してください。 ユーザーは、探しているコマンドがどのタブにあるかをすばやく確実に判断できるべきであり、間違ったタブを選択することはほとんどないべきです。
  4. コマンドの内容を自明にしてください。 ユーザーは、ラベル、アイコン、ヒント、プレビューからコマンドの機能を把握できる必要があります。 コマンドの動作を確認するために、ヘルプ トピックを試したり読んだりする必要があってはなりません。
  5. コマンドを効率的に使用してください。
    • ユーザーがほとんどの時間を費やすのは [ホーム] タブであるべきです。
    • ユーザーが一般的なタスク中にタブを変更する必要がほとんど生じるべきではありません。
    • ウィンドウが最大化され、ユーザーが正しいタブにいる場合、最も頻繁に使用されるコマンドが視覚的に強調され、ユーザーは 1 回のクリックでそれらを呼び出すことができます。 ユーザーは、タブにおいて、最大 4 回のクリックで他のすべてのコマンドを実行できます。
    • 一般的なタスクでコマンドを指定したり属性を変更したりするために、ユーザーがダイアログ ボックスを開く必要はあってはありません。
  6. ユーザーが自信を持ってコマンドとオプションを選択できるようにし、試行錯誤の必要性を最小限に抑えてください。 結果指向のコマンドは、必要に応じて、多くの場合、ギャラリーとライブ プレビューの形式で使用してください。
  7. リボンが最大ウィンドウ サイズから最小サイズに適切に拡大縮小されるようにしてください。

設計概念

既存のプログラムでのリボンの調整

既存のプログラムの従来のメニュー バーとツール バーのデザインをリボン形式にリファクタリングするだけでもかまいませんが、その場合、リボンを使用する価値のほとんどが失われます。 リボンは、多くの場合ギャラリーやライブ プレビューの形式で、即時の結果指向のコマンドを表示するために使用すると最も価値が高まります。 結果指向コマンドを使用すると、コマンドを把握しやすくなり、ユーザーの効率と生産性が大幅に向上します。 既存のコマンドをリファクタリングするのではなく、プログラムでのコマンドの実行方法を完全に再設計することをお勧めします。

効果的なリボンを作成することの難しさを過小評価しないでください。 また、リボンを使用するとプログラムが自動的に改善されると考えないでください。 効果的なリボンを作成するには多くの時間と労力がかかります。 そのようなコマンドの再設計に必要な時間や労力を惜しまないことは、リボンの使用を決定する上で重要な要素です。

リボンの性質

従来のメニュー バーやツール バーと比較すると、リボンには以下の特性があります。

  • すべてのコマンドに対して 1 つのユーザー インターフェイス (UI)。 メニュー バーは包括的で簡単に習得でき、ツールバーは効率的かつ直接的ですが、もう少し画面スペースを使用して、これらすべてを実現する単一のコマンド UI を作成してみるのはどうでしょうか。 UI が 1 つだけのため、リボンでは、探しているコマンドが存在する UI をユーザーが把握する必要はありません。
  • 目に見えて、自明。 メニュー バー コマンドはラベルから自明ですが、大部分の時間は隠れたままです。 画面スペースを節約するため、ツール バー ボタンは主にラベルではなくアイコンで表され (ただし、一部のツールバー ボタンでは両方が使用されます)、アイコンが自明でない場合はツールヒントが使用されます。 ただし、ユーザーは通常、最もよく使用されるコマンドについてのみアイコンを認識しています。
  • ほとんどのコマンドにラベル付きアイコンを表示することにより、リボン コマンドは表示されつつ、自明にもなり、補足情報を表示する場合のみツールヒントを使用できます。 コマンドを把握するために他の場所 (ヘルプなど) にアクセスする必要はほとんどありません。
  • ラベル付きのグループ化。 メニュー カテゴリにはラベルが付けられますが、ドロップダウン メニュー内のグループにはラベルが付けられず、ラベルのない区切り文字のみで示されます。 ツール バー内のグループも、ラベル付けされていない区切り記号で示されます。
  • リボンでは、コマンドがラベル付きのグループに整理されるため、コマンドの検索や目的の特定が容易になります。
  • モーダルだが、階層的ではない メニュー バーは、コマンドの階層を作成することにより拡張されます。 多くの項目を持つメニューでは、1 つ以上のレベルのサブメニューを使って、より多くのコマンドを提供できます。
  • リボン コマンドでは、ツール バー コマンドより多くの領域が必要となるため、タブを使用して拡大縮小します。 タブをこのように使用するとリボンがモーダルになり、ユーザーはコマンドを見つけるためにときどきモードを変更する必要が生じます。 ただし、タブ内では、ほとんどのコマンドは直接実行されるか、階層ではなく単一の分割ボタンまたはメニュー ボタンを使用します。
  • 直接的で即時性がある。 コマンドは、1 回のクリックで呼び出される場合 (つまり、メニューを移動しない場合) は直接コマンドとなり、すぐに有効になる場合 (つまり、追加の入力を集めるためのダイアログ ボックスがない場合) は即時コマンドとなります。 メニュー バーのコマンドは常に間接的であり、多くの場合すぐには実行されません。 ツール バーと同様、ほとんどのリボン コマンドは直接的かつ即時実行できるよう設計されており、最も頻繁に使用されるコマンドは 1 回のクリックで呼び出され、追加の入力を集めるためのダイアログが必要ありません。
  • ゆったりとしている。 メニュー バーとツール バーは、主にスペース効率を高める目的で設計されています。 リボンは、その利点を実現するため、メニュー バーと 3 行のツール バーにほぼ相当する、より多くの垂直方向のスペースを占有する場合があります。 ツール バーの行が 3 行以上あるプログラムはほとんどないため、リボンでは通常、コマンドの従来の UI よりも多くのスペースが消費されます。
  • [アプリケーション] ボタンとクイック アクセス ツール バーがある。 リボンには、常に [アプリケーション] ボタンとクイック アクセス ツール バーが表示されます。 これにより、ユーザーはタブを変更しなくてもファイル関連の頻繁に使用するコマンドにアクセスできるため、プログラム間の一貫性が向上します。
  • 最小限のカスタマイズ。 メニュー バーには固定の表示がありますが、多くのツール バーはカスタマイズ性が高く、ユーザーは場所、サイズ、コンテンツを設定できます。 リボン自体はカスタマイズできませんが、クイック アクセス ツール バーではカスタマイズが制限されます。
  • キーボードのアクセシビリティが向上する。 Alt キーを押すとメニュー バーの入力フォーカスが直接表示されるため、メニュー バーはキーボードのアクセシビリティが高くなっています。 ただし、ツール バーではウィンドウのコンテンツとキーボード ナビゲーションが共有されるため、このようなメカニズムはありません。 したがって、ユーザーは Tab キー (最後のタブ ストップが指定されています) を使ってツール バーに移動し、方向キーを使って特定のコマンドに移動する必要があります。

これに対し、リボンでは、KeyTip によるキーボードのアクセシビリティが向上しています。KeyTip には通常、以下の 3 つの手順でアクセスできます。

  • Alt キーを押して KeyTip モードに入ります。

  • 文字を押して、クイック アクセス ツール バーのタブ、アプリケーション ボタン、またはコマンドを選択します。

  • タブ内で、1 文字または 2 文字を押してコマンドを選択します。

    このアプローチは、非常に視覚的です。 さらに、柔軟性が高く、スケーリングが向上し、ニーモニック アクセス キーの割り当てが増えます。

    アクセス キーとショートカット キーを混同しないでください。 アクセス キーとショートカット キーはどちらも UI へのキーボード アクセスを提供しますが、目的とガイドラインが異なります。 詳細については、「キーボード」を参照してください。

リッチ コマンドの性質

リッチ コマンドとは、リボンにより使用されるコマンドの表示と操作のことを指しています。必ずしも、リボン コンテナーを使用しません。 リッチ コマンドには次の特性があります。

  • ラベル付け。 すべてのコマンドにわかりやすいラベルが付けられますが、アイコンが非常によく知られており、スペースが限られている場合は例外です。

    正しい例:

    文字書式設定リボンのスクリーンショット

    これらのコマンドは、非常によく知られているため、ラベルは必要ありません。

    誤った例:

    使用頻度の低いアイコンを含むリボンのスクリーンショット

    これらのわかりにくいアイコンには、リッチ コマンド用のラベルが必要です。

  • サイズ設定。 コマンドは均一なサイズではなく、使用頻度と重要度に応じてサイズが決まります。 最も頻繁に使用するコマンドを簡単に見つけてクリックできるようになるだけでなく、タッチしやすくなります。

    1 つの大きいボタンと 3 つの小さいボタンのスクリーンショット

    この例では、最も頻繁に使用されるボタンが他のボタンよりも大きくなります。

  • 動的サイズ設定。 リッチ コマンド コントロールは、固定サイズを使用し、サイズが小さすぎる場合は切り捨てたりオーバーフローを使用したりするのではなく、使用可能なスペースを最大限に活用するようサイズを変更します。

    等しいサイズのボタンを含むワイド リボンのスクリーンショットボタンが混在している小さなリボンのスクリーンショット

    この例では、コマンド ボタンのサイズが変更され、使用可能なスペースで適切に機能します。

  • 分割ボタン。 分割ボタンは、最も頻繁に使用されるコマンドの直接性を維持しながら、必要に応じてコマンド バリエーションのセットを統合するのに適した方法です。

    [名前を付けて保存] コマンドとそのオプションのスクリーンショット

    この例では、[名前を付けて保存] コマンドで分割ボタンが使用されています。メイン ボタンでは最も一般的なバリエーションが実行され、メニュー部分にはコマンドのバリエーションを含むメニューが表示されます。

  • リッチ ドロップダウン メニューとギャラリー。 ドロップダウン メニュー、ドロップダウン リスト、ギャラリーは、多くの場合グラフィックやテキストの説明を使用して、選択肢の効果を伝えたり区別したりするのに必要なスペースを消費します。 大規模なオプション セットを整理するためにカテゴリが使用されます。

    アイコンを含むドロップダウン メニュー オプションのスクリーンショット

    これらの例では、メニュー ボタンをクリックすると、その効果を示す選択肢の一覧が表示されます。

  • ライブ プレビュー。 ユーザーが書式設定オプションにカーソルを合わせると、実際のコンテンツを使って、その書式設定の結果が表示されます。

    書式設定の選択肢の結果のスクリーンショット

    ライブ プレビューでは、カーソルを合わせたときに書式設定オプションを適用した結果が表示されます。

  • 拡張ツールヒント。 これらは、関連するコマンドを簡潔に説明します。ショートカット キーも表示されます。 さらに、グラフィックスやヘルプへの参照も含まれることがあります (一方、コマンド関連のヘルプは必要なくなります)。

    テキストとグラフィックを含む大きいツールヒントのスクリーンショット

    拡張ツールヒントは、関連するコマンドを簡潔に説明します。

リボンはすべてのプログラムに適しているわけではありませんが、リッチ コマンドはすべてのプログラムが恩恵を受ける可能性があります。

リボンには常に [アプリケーション] ボタンとクイック アクセス ツール バーがある

[アプリケーション] ボタンとクイック アクセス ツール バーには、どのコンテキストでも役立つコマンドが用意されているため、タブを変更する必要が少なくなります。 これら 3 つのコンポーネントは論理的には独立していますが、リボンには常に [アプリケーション] ボタンとクイック アクセス ツール バーが必要です。 コマンドはリボンまたは [アプリケーション] ボタンのどちらにも配置できるため、コマンドをどこに配置すればよいか疑問に思うかもしれません。 選択は任意ではありません。

[アプリケーション] ボタンは、ファイルの作成、開く、保存、印刷、ドキュメントの送信と公開など、従来はファイル メニューに含まれていたコマンドなど、ファイルに対して何かを実行するコマンドのメニューを表示するために使用されます。

これに対し、リボン自体は、ウィンドウの内容に影響を与えるコマンドに使用されます。 たとえば、コンテンツの読み取り、変更、使用、またはビューの変更に使用するコマンドなどです。

リボンを使用する場合、プログラムにドキュメントやファイルが含まれていない場合でも、[アプリケーション] ボタンを使用する必要があります。 その場合、[アプリケーション] メニューを使用して、印刷、プログラム オプション、プログラムの終了のコマンドを表示します。 間違いなく、このようなプログラムには [アプリケーション] ボタンは必要ありませんが、このボタンを使用するとプログラム間で一貫性が確保されます。 保存コマンドや元に戻すコマンド、プログラム オプションは常に同じ場所にあるため、ユーザーはそれらを探す必要がありません。

リボンにあるタブが 1 つのみの場合でも、クイック アクセス ツール バーは必要です。繰り返しになりますが、このようなプログラムではクイック アクセス ツール バーは不要であると言えますが (すべてのコマンドが 1 つのタブに既に存在するため)、カスタマイズ可能なクイック アクセス ツール バーがあると、プログラム間で一貫性が保たれます。 たとえば、ユーザーが [印刷] コマンドをクリックする習慣がある場合、リボンを使用するすべてのプログラムで実行できなければなりません。

整理と見つけやすさ

タブとグループを用意することにより、リボンを使用してコマンドを整理し、見つけやすくすることができます。 問題は、整理が不十分だと、かえって見つけやすさに大きな悪影響を与える可能性があることです。 コマンドと、コマンドが存在するわかりやすいラベルが付けられたタブおよびグループの間には、明確で自明かつ一意の対応付けが必要です。

ユーザーは、しばらくリボンを使用すると、リボンのメンタル モデルを形成します。 そのメンタル モデルがユーザーにとって意味をなさなかったり、非効率的であったり、不正確であったりすると、混乱やフラストレーションが生じます。 リボンを設計する上で最も重要な目標は、コマンドをすばやく自信を持って見つけられることです。 これを達成できない場合、リボンのデザインは失敗です。 この目標を達成するには、慎重なデザイン、ユーザー テスト、繰り返しが必要です。 簡単であると想定しないでください。

回避すべきよくある落とし穴を次に示します。

  • 一般的すぎるタブ名とグループ名は使用しないでください。 適切なタブまたはグループ名は、できればタスクと目標に基づいた言い回しを使用して、その特定の内容を正確に説明するものです。 一般的すぎるタブ名とグループ名、およびテクノロジ ベースの名前は使用しないでください。 たとえば、ドキュメント作成およびオーサリング プログラムのほぼすべてのコマンドは、[編集]、[書式設定]、[ツール]、[オプション]、[詳細設定]、[その他] というラベルのタブに属している可能性があります。 暗記ではなく、具体的かつ説明的なラベルに頼ってください。
  • 過度に具体的なタブ名やグループ名は避けてください。 タブ名やグループ名は具体的なものにすべきですが、内容にユーザーが驚くほど具体的なものであってはなりません。 ユーザーは消去法を使って検索することが多いため、誤解を招く名前のためにタブやグループを見落とすことがないようにしてください。
  • 特にパスが予期しないものである場合や、コマンドを呼び出すために多くのクリックが必要な場合は、同じコマンドへの複数のパスを避けてください。 複数のパスからコマンドを見つけるのが便利に思えるかもしれません。 しかし、ユーザーは探しているものを見つけると、探すのをやめるという点を覚えておいてください。 ユーザーは、最初に見つけたパスが唯一のパスであると想定しがちですが、そのパスが非効率的であったり予期していなかったりする場合、深刻な問題となります。 さらに、コマンドが重複していると、ユーザーが探している他のコマンドを見つけるのが困難になります。

罫線コマンドへの間接パスのスクリーンショット

この例では、[ホーム] タブにもっと直接的なパスがあるにもかかわらず、[ページ罫線] コマンドを使用して段落の罫線を変更することができます。段落の罫線を探しているユーザーが、この予期しないパスを見つけた場合、それが唯一のパスであると思い込んでしまう可能性があります。

  • 気まぐれなコマンド配置を避けてください。 タブとグループのデザインは適切だと思っていたものの、いくつかのコマンドが適合しないことに気付いたとします。 たとえば、タブとグループのデザインが思ったほど良くなく、改良を続ける必要があるかもしれません。 これらのコマンドを不適切な場所に配置することで、この問題を解決しようとしないでください。 そうすると、ユーザーはタブを見つけるためにすべてのタブを調べる必要があり、すぐにその場所を忘れてしまう可能性が高くなります。
  • マーケティング ベースの配置は避けてください。 プログラムの新しいバージョンがあるため、マーケティング チームが新しい機能をプロモーションしたいと考えているとします。 これらを [ホーム] タブに配置したくなるかもしれませんが、全体的な見つけやすさが損なわれる場合は、そうすることは大きな間違いとなります。 製品の将来のバージョンを考慮に入れ、構成が絶えず変化するとどれだけのフラストレーションを引き起こすかを考えてください。

タブ

最初のステップとしては、標準リボン タブを見直すのがベストです。 プログラムのコマンドが標準タブに自然にマップされる場合、これらの標準に基づいてタブの構成を決定します。 一方、プログラムのコマンドが自然にマップされない場合、強制的に行わないでください。 より自然な構造を決め、多くのユーザー テストを実行して、適切であることを確認してください。

標準以外のタブの場合、以下の問題を考慮してください。

  • 各タブ名はその内容を説明するものである必要があります。 具体的だが具体的すぎない、わかりやすい名前を選択してください。 ユーザーが内容に驚くことはあってはなりません。
  • 各タブ名にはその目的が反映されている必要があります。 コマンドに関連付けられている目標またはタスクについて考えてみてください。
  • 各タブ名は、他のすべてのタブ名と明確に区別される必要があります。

[ホーム] タブは、これらの考慮事項の例外となります。 [ホーム] タブの使用は必須ではありませんが、ほとんどのプログラムでは使用してください。 [ホーム] タブは最初のタブであり、最もよく使用されるコマンドが含まれています。 他のタブに収まらないコマンドを頻繁に使用する場合、[ホーム] タブが適切な場所です。

わかりやすいタブ名を判断できない場合、タブが適切に設計されていないことが原因の可能性があります。 リボン構造がうまくいっていない場合、タブのデザインを再検討します。

グループ

コマンドをグループに分割すると、コマンドが関連するセットに構成されます。 グループ ラベルは、そのコマンドの一般的な目的を説明するものです。

グループとその表示を決める際は、さまざまな要因を考慮する必要があります。

  • 標準のグループ化。 プログラム間でコマンドには大きな違いがありますが、多くのプログラムに共通する標準グループがあります。 これらのコマンドが同じ名前で同様の場所に表示されれば、見つけやすさが大幅に向上します。
正解です。 不正解です
編集グループから分離されたズームのスクリーンショット
編集コマンド グループにはすべての編集コマンドが含まれていますが、[ズーム] コマンドは含まれていません。		 編集グループに含まれるズームのスクリーンショット
[ズーム] コマンドは編集コマンドではなく、編集グループ内にあります。
  • 粒度。 ある程度の構造は問題ありませんが、構造が多すぎるとコマンドが見つけにくくなります。 グループ名が一般的すぎる場合、細分性が十分でない可能性があります。 各グループにコマンドが 1 つまたは 2 つしかない場合、グループが多すぎる可能性があります (ただし、グループ内に他のコマンドがないリボン内ギャラリーが存在することは許容されます)。
正解です。 不正解です
編集グループから分離されたズームのスクリーンショット
編集コマンド グループにすべての編集コマンドが含まれている		 2 つのグループに分割された編集グループのスクリーンショット
編集コマンド グループが細かいセクションに分割されています。 1 つまたは 2 つのコマンドのみを含むグループは使用しないでください。
  • 名前。 適切なグループ名はコマンドの目的を説明するものです。 グループ名が見つからない場合、名前またはグループ化を再検討してください。 わかりやすい名前を判断できない場合、グループが適切に設計されていないことが原因の可能性があります。
正解です。 不正解です
4 つのグループに分けられたコマンドのスクリーンショット
グループに含まれるコマンドを説明するのに十分具体的なグループ名を使用します。		 複数のコマンドを含む書式設定グループのスクリーンショット
このグループ名は、あいまいすぎて役に立ちません。 より良いアプローチとしては、これらのコマンドをより具体的なグループに再編成することができます。
  • 順序。 (西洋文化では) 人々は左から右の順序で読むので、一番左のグループが最も目立つと思われるかもしれません。 ただし、強調表示されたタブ名とウィンドウの内容はフォーカル ポイントとして機能する傾向があるため、通常はタブの中央にあるグループが左端のグループよりも注目されます。 最もよく使用されるグループを最も目立つ場所に配置し、タブ全体でグループに論理的な流れがあることを確認します。

左端のクリップボード グループのスクリーンショット

この例では、フォント グループと段落グループがクリップボード グループよりも目立っています。これは、ドキュメントから上に移動したときに最初に目に入るためです。

[校閲] タブの追跡グループのスクリーンショット

この例では、強調表示された [校閲] タブがフォーカル ポイントとして機能しているため、追跡グループが最も注目を集めています。

  • 統一性。 コマンド表示がすべて同じように見えると、コマンドを認識するのが難しい可能性があります。 さまざまな形や色のアイコン、さまざまな形式のグループ、さまざまなサイズのコマンドを使用すれば、ユーザーはコマンド グループを認識しやすくなります。 リボンが小さいサイズに縮小されたときのみ、コマンドのサイズが均一になる必要があります。
正解です。 不正解です
異なるサイズのアイコンを含むグループのスクリーンショット
認識性を高めるためにさまざまなアイコン サイズを使用する		 同じサイズのアイコンを含むグループのスクリーンショット
これらのコマンドはすべて同じサイズであるため、互いに似ています。

プレビュー

さまざまな種類のプレビューを使用して、コマンドの結果を表示することができます。 役立つプレビューを使用することで、プログラムの効率を高め、試行錯誤による学習アプローチの必要性を減らすことができます。 ライブ プレビューは実験を促し、創造性を促進します。

使用できるさまざまな種類のプレビューをいくつか次に示します。

  • リアルな静的アイコンとグラフィック。 コマンドの効果をリアルに示す静止画像。 これらは、ギャラリー、ドロップダウン メニュー、拡張ツールヒントで使用できます。

[フォント] ドロップダウン リストのスクリーンショット

この例では、[フォント] ドロップダウン リストにフォント自体を使用した各フォント名が表示されます。

透かしサムネイル ギャラリーのスクリーンショット

この例では、リアルなサムネイルを使用してさまざまな透かしを表示しています。

  • 動的なアイコンとグラフィック。 現在の状態を反映するように変更されたアイコンとグラフィック。 このようなアイコンは、ギャラリーや、既定の効果が最後のアクションと同じになるよう変更される分割ボタンに特に役立ちます。

段落スタイル ギャラリーのスクリーンショット

この例では、Microsoft Word がスタイル ギャラリーを変更して現在のスタイルを反映しています。

テキスト書式設定コマンド ボタンのスクリーンショット

この例では、Word がテキストの強調表示色とフォント色のコマンドを変更して、現在の効果を示しています。

  • ライブ プレビュー。 ユーザーが書式設定オプションにマウスを移動すると、その書式設定で結果がどのように表示されるかライブ プレビューが表示されます。 ライブ プレビューは、ユーザーの実際のコンテキストに基づいて、ユーザーが選択をより効率的かつ自信を持って行うのに役立ちます。

[ページの色] コマンドの色選択ツールのスクリーンショット

この例では、[ページの色] コマンドが、カーソルを合わせたとき色のオプションの効果を表示してライブ プレビューを実行しています。

ライブ プレビューは、ユーザーの生産性を大幅に向上させることができる強力な機能ですが、単純な静的プレビューでも大きな助けになります。

リボンの拡大縮小

ツール バーの拡大縮小は簡単です。ウィンドウが狭すぎてツール バーを表示できない場合は、そこに収まるツール バーが表示され、その他すべてはオーバーフロー ボタンからアクセスできるようになります。 リッチ コマンドの目標は、利用可能なスペースを最大限に活用することであるため、リボンの拡大縮小には、より多くのデザイン作業が必要になります。 既定のリボン サイズはないため、特定の幅を考慮に入れてリボンをデザインしないでください。 幅広いレイアウトをデザインし、そのいずれかがほとんどのユーザーが目にする可能性があることを認識する必要があります。 拡大縮小はリボン デザインの基本的な部分であり、最後のステップではありません。 タブをデザインするときは、グループごとに異なるレイアウト (最大 3 つ) と、一緒に使用できる組み合わせを指定します。 リボンには、現在のウィンドウ サイズに適合する有効な最大の組み合わせが表示されます。

オーバーフロー メニューの書式設定コマンドのスクリーンショット ツール バーは、オーバーフロー ボタンを使用して拡大縮小されます。

さまざまな幅のリボンのスクリーンショット 既定のリボン サイズはありません。 最小サイズは、1 つのポップアップ グループ アイコンです。

ガイドライン

全般

  • リボンをウィンドウ内のメニュー バーやツールバーと組み合わせないでください。 リボンは、メニュー バーとツール バーの代わりに使用する必要があります。 ただし、リボンは、パレット ウィンドウやナビゲーション要素 ([戻る] ボタン、[進む] ボタン、アドレス バーなど) と組み合わせることができます。
  • リボンと [アプリケーション] ボタンおよびクイック アクセス ツール バーを常に組み合わせてください。
  • プログラムの起動時、左端のタブ (通常は [ホーム]) を選択します。 最後に選択されたタブをプログラム インスタンス間で保持しないでください。
  • プログラムを初めて起動したとき、リボンを通常の状態 (最小化されていない状態) で表示します。 ユーザーは既定の設定を変更しないことが多いため、プログラムの起動時にリボンを最小化すると、すべてのコマンドの効率が低下する可能性があります。 さらに、最初にリボンを最小化した状態で表示すると、方向感覚が失われる可能性があります。
  • プログラム インスタンス間でリボンの状態を保持します。 たとえば、ユーザーがリボンを最小化した場合、次回プログラムを実行したときにリボンが最小化された状態で表示されます。 ただし、この場合も、最後に選択したタブをこの方法で保持しないでください。

タブの使用

一般的に、タブの数は少ないほど良いので、その目的の達成に役立たないタブは削除してください。

  • 可能な場合は必ず、標準のタブを使用します。 標準タブを使用すると、特にプログラムをまたがった場合に見つけやすさが大幅に向上します。 この記事で後述する「標準リボン タブ」をご覧ください。
  • 必要に応じて、最初のタブに [ホーム] というラベルを付けます。 [ホーム] タブには、最も頻繁に使用するコマンドが含まれている必要があります。 他のタブに収まらないコマンドを頻繁に使用する場合、[ホーム] タブが適切な場所です。
  • 次の場合、新しいタブを追加します。
    • そのコマンドが特定のタスクとの関連性が高く、タブ ラベルによって正確に説明できる。 タブを追加すると、コマンドが見つけにくくなるのではなく、見つけやすくなる。
    • そのコマンドに他のタブのタスクとの関連性がほとんどない。 タブを追加しても、よく実行するタスク中にタブを切り替える必要がない。
    • そのタブには、追加の場所を用意する価値があるコマンドが含まれている。 少数のコマンドのみを含むタブは追加しないでください。 例外: いくつかのコマンドが特定のタスクに強く関連している場合、タブを追加してそれらのコマンドを含めることを検討してください。タブを追加すると、複雑すぎる [ホーム] タブが大幅に簡素化されます。
  • 残りのタブについては、タブ間の論理的な順序を維持しながら、最も頻繁に使用するタブを先頭に配置します。
  • ユーザーがすばやく自信を持ってコマンドを見つけられるようタブ デザインを最適化してください。 その他の考慮事項はすべて二次的なものです。
  • [ヘルプ] タブを追加しないでください。代わりに、プログラム全体のヘルプと拡張ツールヒントを使ってサポートを提供してください。
  • 最大 7 つのコア タブを使用してください。 7 つを超える場合、コマンドを含むタブを特定することが難しくなります。 多くのコマンドが存在するアプリケーションでは 7 つのコア タブが許容されますが、ほとんどのプログラムでは 4 つ以下のタブを目指す必要があります。

コンテキスト タブ

  • ユーザーが特定のオブジェクトの種類を選択した場合のみ関連するコマンドのコレクションを表示するには、コンテキスト タブを使用します。 頻繁に使用するコマンドが少数の場合、通常のタブを使用し、適用されないコマンドを無効にする方が便利かつ安定します。
  • 淡色表示された [切り取り] コマンドと [コピー] コマンドのスクリーンショット
    コンテキスト タブを使用するよりも、[切り取り] や [コピー] などの一般的なコマンドを無効にすることをお勧めします。
  • 特定のオブジェクトの種類に固有のコマンドのみを含めてください。 ユーザーがオブジェクトを選択する前にコマンドを必要とする可能性がある場合、コンテキスト タブ以外にもコマンドを配置してください。
  • 特定の種類のオブジェクトを操作するときによく使用されるコマンドを含めてください。 頻繁に実行するタスク中にタブを切り替えなくてすむよう、よく使用する一般的なコンテキスト コマンドをコンテキスト メニューとミニ ツールバーに配置します。 あるいは、頻繁なタブの切り替えを回避する場合、一般的なコマンドをコンテキスト タブに重複して配置することを検討してください。 ただし、やりすぎには注意してください。ユーザーがオブジェクトを操作する際に必要になる可能性のあるすべてのコマンドを含めないようにしてください。
  • [デザイン] タブの [罫線] コマンドののスクリーンショット
    この例では、よく実行されるタスク中にタブを頻繁に切り替える必要がないよう、[デザイン] タブに [罫線] コマンドが含まれています。
  • 現在表示されているコンテキスト タブとは異なるコンテキスト タブの色を選択してください。 これを実現するため、同じタブ セットを後で別の色を使用して表示することもできますが、可能な限り、呼び出し全体で一貫した色の割り当てを使用してください。
  • コンテキスト タブを自動的に選択すると、見つけやすさが向上して安定性が向上し、タブを切り替える必要性が低下します。 次の場合にコンテキスト タブを自動的に選択します。
    • ユーザーがオブジェクトを挿入した。 この場合は、セット内の最初のコンテキスト タブを選択します。
    • ユーザーがオブジェクトをダブルクリックした。 この場合は、セット内の最初のコンテキスト タブを選択します。
    • ユーザーがコンテキスト タブを選択し、オブジェクトをクリックした後、同じ種類のオブジェクトをすぐにクリックした。 この場合、前に選択したコンテキスト タブに戻ります。
  • アクティブ タブであるコンテキスト タブを削除するとき、[ホーム] タブまたは最初のタブをアクティブ タブにします。こうすると最も安定するようです。
  • 特定の一時モードに適用されるコマンドのコレクションを表示し、コア タブをどれも適用しない場合は、モーダル タブを使用します。 一部のコア タブが適用される場合、代わりにコンテキスト タブを使用し、適用されないコマンドを無効にします。 モーダル タブにはかなり制限があるため、より適した代替手段がない場合のみ使用してください。
  • [印刷プレビュー] タブのスクリーンショット
    印刷プレビューは、よく使用されるモーダル タブです。
  • モーダル タブを閉じるには、タブの最後のコマンドとして [<モード>を閉じる] コマンドを配置します。コマンドを見つけやすくするため、[閉じる] アイコンを使用します。 何を閉じようとしているのか混乱するのを防ぐため、コマンドでモードを指定します。
  • [印刷プレビューを閉じる] ボタンのスクリーンショット
    この例では、[閉じる] コマンドに明示的にモードのラベルを付けることで、何を閉じようとしているのかがはっきりします。
  • モーダル タブを閉じるには、ウィンドウのタイトル バーの [閉じる] ボタンも再定義して、プログラムではなくモードを閉じるようにします。 ユーザー テストでは、多くのユーザーがこの動作を期待していることが示されました。

標準リボン タブ

可能な場合は必ず、プログラムのコマンドを、標準的な表示順序で表示される、これらの標準タブにマップしてください。

通常のタブ

  • ホーム。 最も頻繁に使用されるコマンドが含まれています。 使用する場合、常に最初のタブになります。
  • 挿入。 ドキュメントにコンテンツとオブジェクトを挿入するコマンドが含まれています。 使用する場合、常に 2 つ目のタブになります。
  • ページ レイアウト。 テーマ、ページ設定、ページの背景、インデント、間隔、配置など、ページ レイアウトに影響するコマンドが含まれています。 (十分なスペースがある場合、インデント グループと間隔グループを [ホーム] タブに置くことができます)。使用する場合、常に 3 つ目のタブになります。
  • レビュー。 コメントの追加、変更の追跡、バージョンの比較を行うコマンドが含まれています。
  • ビュー。 表示モード、表示/非表示オプション、ズーム、ウィンドウ管理、Windows メニュー カテゴリに従来からあったコマンドを含む、ドキュメント ビューに影響を与えるコマンドが含まれます。 使用する場合、[開発者] タブが表示されていない限り、最後の通常のタブになります。
  • Developer。 開発者のみが使用するコマンドが含まれています。 使用する場合、既定では非表示になりますが、表示される場合は最後の通常のタブになります。

ほとんどのプログラムでは、[レビュー] タブと [開発者] タブは必要ありません。

標準コンテキスト タブ

  • フォーマット。 選択したオブジェクトの種類の形式の変更に関連するコマンドが含まれています。 通常はオブジェクトの一部に適用されます。
  • デザイン。 選択したオブジェクトの種類にスタイルを適用するためのコマンドが (多くの場合ギャラリーに) 含まれています。 通常はオブジェクト全体に適用されます。
  • レイアウト。 テーブルやグラフなどの複雑なオブジェクトの構造を変更するコマンドが含まれています。

書式、デザイン、レイアウトに関連するコンテキスト コマンドが存在するが、複数のタブでは不十分な場合、[書式] タブを追加するだけです。

標準グループ

  • 可能であれば必ず、標準グループを使用してください。 一般的なコマンドが同じ名前で同様の場所に表示されれば、見つけやすさが大幅に向上します。 この記事で後述する「標準リボン グループ」をご覧ください。
  • 次の場合、新しいグループを追加します。
    • そのコマンドに密接な関連があり、グループ ラベルによって正確に説明できる。 グループを追加すると、コマンドが見つけにくくなるのではなく、見つけやすくなる。
    • そのコマンドは、他のグループのコマンドとの関係が弱い。 タブ上のすべてのコマンドは密接に関連している必要がありますが、一部のコマンドの関係性は他のコマンドよりも強くなります。
    • そのグループには、追加の場所を用意する価値があるコマンドが含まれている。 ほとんどのグループでは、3 ～ 5 個のコマンドを目指してください。 1 ～ 2 個のコマンドのみを含むグループは使用しないでください。ただし、グループ内に他のコマンドを含まないリボン内ギャラリーは使用してもかまいません。 単一のコマンドを含む多数のグループが存在する場合、構造が多すぎるか、コマンドの結束が欠如していることを示しています。
  • 必要のないグループを追加して過度に整理することのないようにしてください。
  • 次の場合、グループを分割することを検討してください。
    • 整理されていないコマンド グループのスクリーンショット
      このグループにはさまざまなサイズのコマンドが多数あり、整理が必要です。
    • 2 つの長い段落グループ名のスクリーンショット
      このグループには、追加のラベルがあれば大きなメリットを得られるコマンドがあります。
  • 最もよく使用されるグループを最も目立つ場所に配置し、タブ全体でグループに論理的な順序があることを確認します。
  • ユーザーがすばやく自信を持ってコマンドを見つけられるようグループ デザインを最適化してください。 その他の考慮事項はすべて二次的なものです。
  • 1 つのボタンを含むグループをポップアップ グループ アイコンに拡大縮小しないでください。 縮小するときは、1 つのボタンのままにしてください。
  • 最大 7 つのグループを使用します。 グループが 7 つを超えると、どのグループにコマンドがあるかを判断するのが難しくなります。

標準リボン グループ

可能な場合は必ず、プログラムのコマンドをこれらの標準グループにマッピングします。これらのグループは、関連するタブ内に標準的な表示順序で表示されます。

メイン タブ

  • クリップボード
  • フォント
  • 段落
  • 編集

タブの挿入

  • Tables
  • 図

ページ レイアウト タブ

  • テーマ
  • ページ設定
  • 整列

レビュー タブ

  • Proofing
  • Comments

[表示] タブ

  • ドキュメント ビュー
  • 表示/非表示
  • ズーム
  • ウィンドウ

コマンド

  • リボン上の行番号コマンドのスクリーンショット
    よく使用されるすべてのコマンドを公開することにより、リボンの見つけやすさと拡張性の利点を生かします。 適切であれば、頻繁に使用するコマンド、特に見つけにくいことが分かっているコマンドをダイアログ ボックスからリボンに移動します。 ユーザーがダイアログ ボックスを使用せずに一般的なタスクを実行できるのが理想的です。

  • リボンの拡張性を理由に、不必要に複雑にしないでください。 常に控えめにし、できるからといってリボンにコマンドを追加しないでください。 コマンド エクスペリエンス全体をシンプルに保ってください。 表示を簡略化する方法を以下に示します。

    • ミニ ツール バーとコンテキスト メニューのスクリーンショット
      インプレースのコンテキスト コマンドには、コンテキスト メニューとミニ ツール バーを使用してください。
    • ダイアログ ボックス内のあまり使用されないコマンドは移動 (または保持) してください。 これらのコマンドにアクセスするには、ダイアログ ボックス起動ツールを使用します。 ダイアログ ボックスは、リボンで引き続き使用できます。 一般的なタスク中にそれらを使用する必要性を減らすようにしてください。
    • 冗長で使用頻度の低い機能を排除してください。

プレゼンテーション

  • 各コマンドは 1 つのタブにのみ表示します。特にコマンドを呼び出すために多くのクリックが必要な場合、同じコマンドへの複数のパスを避けてください。 複数のパスからコマンドを見つけるのが便利に思えるかもしれません。 しかし、ユーザーは探しているものを見つけると、探すのをやめるという点を覚えておいてください。 ユーザーは、最初に見つけたパスが唯一のパスであると想定しがちですが、そのパスが非効率的である場合、深刻な問題となります。 例外: コンテキスト タブでは、一般的なコンテキスト タスクのタブを変更できなくなる場合、[ホーム] タブと [挿入] タブのいくつかのコマンドが重複することがあります。

  • グループ内では、最も頻繁に使用されるコマンドを優先しながら、コマンドを論理的な順序で配置してください。 全体として、コマンドは論理的な流れを持ち、見つけやすくすると同時に、最も頻繁に使用されるコマンドが最初に表示されるようにする必要があります。 一般に、32 x 32 ピクセルのアイコンを持つコマンドは、16 x 16 ピクセルのアイコンを持つコマンドの前に表示され、グループ間で見つけやすくします。

  • 頻繁に使用されるコマンドの横に、破壊的なコマンドを配置しないでください。 コマンドは、その効果が広範囲に及び、簡単に元に戻すことができないか、効果がすぐに気が付くものではない場合、破壊的と見なされます。

  • 相互に排他的なオプションのセットなど、関連性の強いコマンドを示すには、区切り文字を使用します。

  • フォントと段落グループのスクリーンショット
    ラベルを必要としない、関連性が高く、よく知られているコマンドのセットには、ツール バー スタイルのグループを使用することを検討してください。 そうすることで、見つけやすさや習得のしやすさに影響を与えることなく、コンパクトなスペースに多くのコマンドを表示できます。 よく知られているように、このようなコマンドは頻繁に使用されて、すぐに認識されるため、[ホーム] タブに表示される傾向があります。

  • 最も頻繁に使用される重要なラベル付きコマンドには、32 x 32 ピクセルのアイコンを使用してください。 グループを縮小するときは、これらのコマンドを最後に 16 x 16 ピクセル アイコンに変換します。

  • 気まぐれなコマンド配置を避けてください。 ユーザーが必要なコマンドを見つけるためにすべてのタブを調べる時間を無駄にしないよう、タブとグループのデザインを慎重に検討してください。

  • マーケティング ベースの配置は避けてください。 新機能のプロモーションに関するマーケティング目標は、時間の経過と共に変化する傾向があります。 製品の将来のバージョンを考慮に入れ、構成が絶えず変化するとどれだけのフラストレーションを引き起こすかを考えてください。

相互作用

  • 現在のコンテキストに適用されないコマンドや、エラーに直接つながるコマンドは無効にしてください。 役に立つ場合は、拡張ツールヒントを使って、コマンドが無効になっている理由を説明します。 このようなコマンドを非表示にしないでください。非表示にするとリボンのレイアウトが変更され、リボンの表示が不安定になる可能性があります。

  • コマンド ラベルを動的に更新しないでください。 繰り返しになりますが、これを行うとタブのレイアウトが変更され、外観が不安定になる可能性があります。 代わりに、一定のラベルを使用するようコマンドをデザインしてください。

    正解です。 不正解です
    ノートの挿入とメモの削除のスクリーンショット
    使用できないときにコマンドを無効にする    		 ノートの挿入、メモの削除なしのスクリーンショット
    コマンドが使用できない場合でも、コマンドを非表示にしない

  • 直接コントロールを優先してください。 コマンドは、1 回のクリックで (つまり、メニュー内を移動せずに) 呼び出された場合、直接呼び出されます。 ただし、リボン内のギャラリーを除き、直接コントロールはライブ プレビューをサポートしていないため、ライブ プレビューの必要性も要因となります。

  • 関連する書式設定オプションのセット内にコマンドがある場合にオプションの効果を示すには、ライブ プレビューを使用します。特にユーザーが間違ったオプションを選択する可能性がある場合、ライブ プレビューが重要かつ実用的です。

    • コマンドが頻繁に使用される場合、リボン内ギャラリーを使用して直接表示します。
    • コマンドが頻繁に使用される場合、ドロップダウン ギャラリーを使用します。

  • 以下のコントロールを使用し、以下の優先順位で直接コマンドを公開します。

    • コマンド ボタン、チェック ボックス、ラジオ ボタン、インプレース ギャラリー。 これらは常に直接的です。
    • 分割ボタン。 最も一般的なコマンドを直接指定しますが、コマンド バリエーションには間接的に指定します。
    • メニューのボタン。 これらは間接的ですが、見つけやすい多くのコマンドが表示されます。
    • テキスト ボックス (スピン コントロール付き)。 通常、テキスト入力には他のコントロールの種類よりも多くの労力が必要です。

  • メニュー ボタンのみのリボンのスクリーンショット
    フル サイズで表示されたときにリボンがほとんどのメニュー ボタンで構成されている場合、メニュー バーを使用することもできます。

  • 即時コマンドを優先してください。 [分割印刷] ボタンとそのサブメニューのスクリーンショット
    コマンドがすぐに有効になる場合 (つまり、追加の入力を集めるダイアログ ボックスがない場合) は、すぐに実行されます。 コマンドに入力が必要な場合、ボタン部分に即時コマンドを配置し、入力が必要なコマンドをサブメニューに配置する分割ボタンの使用を検討してください。

ギャラリー

次の場合、ギャラリーを使用します。

  • ユーザーが通常選択する、明確に定義された関連する選択肢のセットが存在する。 バリエーションの数は無限にあるかもしれませんが、可能性のある選択肢は十分に抑えられているはずです。 選択肢の関連性が強くない場合、別のギャラリーを使用することを検討してください。
  • 選択肢は、書式設定機能など、視覚的に表現するのが最適です。 サムネイルを使用すると、参照、把握、選択が容易になります。 選択肢にラベルを付けることもできますが、選択は視覚によって行われるため、選択肢を把握するためにテキスト ラベルは必要ありません。
  • 選択肢には、1 回のクリックですぐに達成される結果が表示されます。 ユーザーの意図をさらに明確にするためのフォローアップ ダイアログ ボックスや、示された結果を達成するための一連の手順は表示されません。 ユーザーが選択を調整することを希望する場合、後で調整できるようにします。

次の場合、リボン内ギャラリーを使用します。

  • 選択肢が頻繁に使用される。 選択肢にはスペースが必要であり、他のコマンドから取得される可能性のあるスペースに見合う価値がある。
  • 一般的な用途では、表示された選択肢をグループ化またはフィルター処理する必要はありません。
  • 選択肢は、リボンの高さ (48 ピクセル) 内で効果的に表示することができます。

ギャラリー内のサムネイル

ジョブを適切に実行する最小の標準ギャラリー サムネイル サイズを選択します。

  • リボン内ギャラリーの場合、16 x 16、48 x 48、または 64 x 48 ピクセルのサムネイルを使用します。
  • ドロップダウン ギャラリーの場合、16x16、32x32、48x48、64x48、72x96、96x72、96x96、または 128 x 128 ピクセルのサムネイルを使用します。
  • すべてのギャラリー項目のサムネイル サイズは同じにする必要があります。

リボン内ギャラリーの場合:

  • 少なくとも 3 つの選択肢を表示します。スペースがあれば、さらに表示します。 通常のウィンドウ サイズで少なくとも 3 つの選択肢を表示するのに十分なスペースがない場合、代わりにドロップダウン ギャラリーを使用します。
  • リボン内ギャラリーを展開し、使用可能なスペースを活用します。 追加のスペースを使用してより多くの項目を表示し、1 クリックで簡単に選択できるようにします。

ドロップダウン ギャラリーの場合:

  • コンボ ボックス、ドロップダウン リスト、分割ボタン、またはメニュー ボタンからギャラリーを表示します。
  • ユーザーがメイン ウィンドウをクリックしてドロップダウン ギャラリーを閉じる場合、メイン ウィンドウの内容を選択または変更せずにギャラリーを閉じます。
  • ギャラリーに多くの選択肢があり、一部の選択肢がほとんど使用されない場合、よく使用される選択肢に重点を置き、既定のギャラリーを簡素化します。 残りのコマンドについては、ギャラリー ドロップダウンの下部に適切なコマンドを追加します。
    • コマンドに他のバリエーションの一覧が表示される場合、"その他の singular feature name オプション..." という名前を付けます。
    • ユーザーが独自のカスタム オプションを作成できるダイアログ ボックスがコマンドに表示される場合、"カスタム feature name..." という名前を付けます。
  • 選択肢をグループに整理すると、閲覧の効率が上がります。
  • シンボル ギャラリーとフィルターのスクリーンショット
    ギャラリーに多数の項目がある場合、ユーザーがより効率的に選択肢を見つけるのに役立つフィルターを追加することを検討してください。 混乱を避けるため、フィルター処理されていないギャラリーを最初に表示します。 ただし、多くのギャラリーには選択肢があまり多くないため、フィルターは必要ありません。グループを使用するだけで十分です。

コマンド プレビュー

  • プレビューを使用すると、ユーザーがコマンドを実行しなくてもコマンドの効果を表示できます。 役立つプレビューを使用することで、プログラムの効率と学習のしやすさが向上し、試行錯誤の必要性が減ります。 さまざまな種類のコマンド プレビューについては、この記事の「デザインの概念」セクションの「プレビュー」をご覧ください。
  • ライブ プレビューの場合、プレビューを適用して現在の状態を 500 ミリ秒以内に復元できることを確認してください。 そのためには、書式設定の変更をすばやく、中断可能な方法で適用する機能が必要です。 ライブ プレビューのメリットを最大限に受けるには、ユーザーがさまざまなオプションをすばやく評価できる必要があります。
  • プレビューではテキストを使用しないでください。 使用する場合、プレビュー イメージをローカライズする必要があります。

アイコン

  • ドロップダウン リストとチェック ボックスのスクリーンショット
    ドロップダウン リスト、チェック ボックス、ラジオ ボタンを除くすべてのリボン コントロールのアイコンを指定します。 ほとんどのコマンドでは、32 x 32 と 16 x 16 の両方のピクセル アイコンが必要です (クイック アクセス ツール バーでは 16 x 16 ピクセルのアイコンのみ使用されます)。 ギャラリーでは通常、16 x 16、48 x 48、または 64 x 48 ピクセルのアイコンが使用されます。

  • 一意のアイコンを指定します。 異なるコマンドに同じアイコンを使用しないでください。

  • リボン アイコンがリボンの背景色に対して明確に表示されていることを確認します。 必ず、コンテキストに沿ってハイ コントラスト モードでリボン アイコンを評価してください。

  • 特に頻繁に使用されるコマンドについては、その効果を明確に伝えるアイコン デザインを選択してください。 適切なデザインのリボンにはわかりやすいアイコンがあり、ユーザーがコマンドを効率的に見つけて理解するのに役立ちます。

  • 特に頻繁に使用するコマンドについては、認識しやすく区別しやすいアイコンを選択してください。 必ず、アイコンは特徴的な形と色にしてください。 そうすることで、アイコン記号を覚えていない場合でも、ユーザーはコマンドをすばやく見つけることができます。

    正解です。 不正解です
    青いスポイトと黄色の鉛筆のスクリーンショット
    図形と色を使用して、区別しやすいアイコンを作成します。    		 青いスポイトと青色の鉛筆のスクリーンショット
    同じ色のアイコンは区別が難しい

  • ポップアップ コンテナー内のコメント コマンドのスクリーンショット
    グループ内で最も目立つコマンドの 16 x 16 ピクセルのアイコンを 32 x 32 ピクセルのビジュアル コンテナー内に配置し、ポップアップ グループ アイコンを作成することを検討してください。 ポップアップ グループに異なるアイコンを作成する必要はありません。

  • テキスト書式設定コマンド ボタンのスクリーンショット
    役立つ場合、アイコンを変更して現在の状態を反映してください。 これは、既定の効果が変更される可能性がある分割ボタンには特に役立ちます。

  • リボン アイコンが Aero スタイルのアイコン ガイドラインに準拠していることを確認します。 ただし、リボン アイコンは遠近法で表示されるのではなく、正面から表示されます。

正解です。 不正解です
2 次元コマンド アイコンのスクリーンショット
2 次元アイコンを使用します。		 3 次元コマンド アイコンのスクリーンショット
3 次元アイコンは使用しないでください。

拡張ツールヒント

  • すべてのリボン コマンドには、コマンド名、ショートカット キー、説明、オプションの補足情報を指定するために拡張ツールヒントが必要です。 単にラベルを言い直すだけのツールヒントは避けてください。

    誤った例:

    コマンド名を繰り返すツールヒントのスクリーンショット

    この例では、ツールヒントはコマンド ラベルを言い換えたにすぎません。

  • 可能であれば、簡潔な説明を使ってコマンドを十分に説明してください。 詳細な説明が本当に必要な場合のみヘルプにリンクしてください。

    誤った例:

    取り消し線コマンドのヒントのスクリーンショット

    この例では、コマンドにヘルプは必要ありません。

  • 役に立つ場合、プレビューを使用してコマンドの効果を示します。

    グラフの挿入用のヒントとグラフのスクリーンショット

    この例では、ツールヒント画像はコマンドの効果を示しています。

ラベル付けのガイドラインについては、「拡張ツールヒントのラベル」をご覧ください。

アクセス キーと KeyTip

KeyTip は、リボンに直接表示されるコマンドのアクセス キーを表示するために使用されるメカニズムです。

ドロップダウン メニュー コマンドのアクセス キーは、下線付き文字で示されます。 メニュー アクセス キーとは次の点で異なります。

  • 2 つの文字アクセス キーを使用できる。 たとえば、FP を使用して [書式のコピー/貼り付け] コマンドにアクセスできます。

  • アクセス キーの割り当ては下線ではなくヒントを使用して表示されるため、文字の幅や下に延びる部分は割り当てを行う際の要素にはなりません。

  • すべてのリボン タブとコマンドにアクセス キーを割り当てます。 考えられる唯一の例外は、レガシ アドインからのコマンドです。

  • [アプリケーション] ボタンとクイック アクセス ツール バーの場合:

    • [アプリケーション] ボタンに F を割り当てます。 この割り当ては、[アプリケーション] ボタンが従来の [ファイル] メニューと類似しているために使用されます。
    • リボン上のコマンド キーヒントのスクリーンショット
      クイック アクセス ツール バーと最近使用したファイルの一覧では、アクセス キーを数値で割り当てます。

  • タブの KeyTip を示すスクリーンショット
    タブの場合:

    • H を [ホーム] に割り当てます。
    • 最も頻繁に使用されるタブから、ラベルの最初の文字を割り当てます。
    • 最初の文字に割り当てることができないタブの場合、ラベル内の固有の子音または母音を選択します。
    • 以前メニュー バーをサポートしていたプログラムについては、可能な限りアクセス キーの互換性を維持するように努めてください。 従来のメニュー カテゴリからのアクセス キーに異なる意味を割り当てないようにしてください。 たとえば、プログラムの従来のメニュー バー バージョンに [編集] メニューがあった場合、同等のタブに E アクセス キーを使用します。同等のタブがない場合、混乱を避けるため、どのタブにも E アクセス キーを割り当てないでください。

  • リボンの KeyTip を示すスクリーンショット
    リボン コマンド、メニュー、サブメニューの場合:

    • タブ内で一意のアクセス キーの組み合わせを割り当てます。さまざまなタブ内でアクセス キーの組み合わせを再利用できます。
    • 可能な限り、よく使用されるコマンドに標準のアクセス キーを割り当てます。 標準アクセス キーの表をご覧ください。
    • 他のコマンドの場合:
      • 最も頻繁に使用されるコマンドの場合、ラベルの最初または 2 番目の単語 (できれば最初の文字) の先頭に文字を選択します。
      • 使用頻度の低いコマンドの場合、"Exit" の "x" など、ラベル内の固有の子音または母音である文字を選択します。
      • 使用頻度の低いコマンドとダイアログ ボックス起動ツールでは、必要に応じて 2 文字を使用します。
      • メニューとサブメニューの場合、1 文字を使用して、コマンド全体に必要なキーストロークの数を減らします。
      • J、Y、または Z で始まるアクセス キーは、コンテキスト タブ、割り当てられていない KeyTip、ポップアップ グループに使用されるため、使用しないでください。

  • ポップアップ グループの KeyTip のスクリーンショット
    ポップアップ グループの場合:

    • Z で始まる 2 文字のアクセス キーを使用します。
    • 最も頻繁に使用されるグループから始めて、ラベルの最初の文字に 2 番目のアクセス キー文字を割り当てます。
    • 残りのグループには、ラベル内の固有の子音または母音を選択します。

ショートカット キーのガイドラインについては、「キーボード」をご覧ください。

[アプリケーション] ボタン

  • ファイルに対して何らの操作を実行するコマンドのメニューを表示するには、[アプリケーション] ボタンを使用します。 例としては、ファイルの作成、開く、保存、印刷、ドキュメントの送信と公開を行うため、従来は [ファイル] メニューに含まれていたコマンドが挙げられます。

  • リボンを使用するときは、常に [アプリケーション] ボタンを追加してください。 プログラムがファイルを使用しない場合、[アプリケーション] ボタンを使用してプログラム オプションと [終了] コマンドにアクセスします。 [アプリケーション] ボタンでは、常にコマンド メニューが表示されます。単なる装飾ではありません。

  • 必要に応じて、次の標準 [アプリケーション] メニュー コマンドを使用してください。

    • 新しい
    • 始
    • および
    • 名前を付けて保存...
    • 印刷...
    • クイック印刷
    • 印刷プレビュー
    • 終
    • [オプション]
    • 終了

  • [アプリケーション] メニューに属するコマンドは、そのメニューにのみ予約します。 いずれのタブにも冗長に配置しないでください。

  • メニュー項目ごとに、以下を追加します。

    • コマンド名を含むラベル。
    • 32 x 32 ピクセル アイコン。
    • 簡単な説明。 最大 2 行のテキストを使用して説明を表示できることを確認します。

  • ショートカット キーをドキュメント化するツールヒントのスクリーンショット
    ツールヒントを使ってショートカット キーをドキュメント化します。 通常のメニューとは異なり、[アプリケーション] メニューはラベルを使ってショートカット キーをドキュメント化しません。

クイック アクセス ツール バー

  • クイック アクセス ツール バーを使って、頻繁に使用されるコマンドにアクセスできます。 コマンドは、[アプリケーション] ボタンまたはリボンから実行できます。
  • リボンを使用する場合、必ずクイック アクセス ツール バーを追加してください。 リボンにタブが 1 つしかない場合でも、これを行うと、プログラム間で一貫性が保たれます。
  • クイック アクセス ツール バーには、[アプリケーション] メニューで頻繁に使用されるコマンドを事前に入力します。 プログラムでサポートされている場合は [保存] と [元に戻す] を追加し、サポートされていて頻繁に使用される場合は [開く] と [印刷] を追加します。
  • [クイック アクセス ツール バーのカスタマイズ] メニューには、最も頻繁に使用される即時コマンドを最大 12 個追加します。 即時コマンドは、有効になる前に追加の入力を必要としないため、クイック アクセス ツール バーに適しています。 これらは任意の即時コマンドにすることができますが、ユーザーが選択する可能性が高いため、[ホーム] タブにないコマンドを優先してください。
  • [クイック アクセス ツール バーのカスタマイズ] メニューに関連するコマンドのペアがある場合は、頻度に関係なく両方を追加してください。 一般的なペアは、開く/閉じる、戻る/進む、元に戻す/やり直すです。
  • [クイック アクセス ツール バーのカスタマイズ] ダイアログで、コマンドを追加する方法を提供します。 最も頻繁に使用されるコマンドを表示する "よく使用されるコマンド" フィルターを提供し、このフィルターを既定で選択します。

ダイアログ ボックス起動ツール

  • [フォント] ダイアログ ボックスとフォント グループのスクリーンショット
    使用頻度の低いコマンドと設定を含む関連ダイアログ ボックスがある場合、ダイアログ ボックス起動ツールを使用してグループを指定します。 ダイアログ ボックスには、グループ内のすべてのコマンドに加えて、グループとまったく異なるコマンド セットや同じコマンドではなく、その他のコマンドが含まれている必要があります。

  • ダイアログ ボックス起動ツールを使用してコマンドを直接実行しないでください。 ダイアログ ボックス起動ツールはダイアログ ボックスを表示する必要があります。

  • ダイアログ ボックス起動ツールを使用して、頻繁に使用されるコマンドと設定にアクセスしないでください。 リボン上に直接配置されているコマンドと比較すると、ダイアログ ボックスのコマンドと設定は比較的見つけにくくなります。

  • ダイアログ ボックスの名前とグループの名前を一致させてください。 完全に一致する必要はありませんが、ユーザーが結果に驚かないよう、十分に似た名前にする必要があります。

    誤った例:

    [リマインダー サウンド] ダイアログ ボックスのスクリーンショット

    リマインダー サウンドはリマインダー オプションであるため、ダイアログ ボックス起動ツールを使用してリマインダー サウンドを設定することは予期されません。

  • グループに関連するコマンドと設定のみ表示してください。 ダイアログ ボックスに他の内容が表示される場合、ユーザーは、他のコマンドや設定へのこのパスが唯一のパスであると結論付ける可能性があります。

    誤った例:

    フォント ダイアログ ボックスのスクリーンショット

    この例では、[フォント] ダイアログ ボックスに文字間隔の設定が表示されています。この設定は、関連するタブとは無関係です。

Labels

タブ ラベル

  • すべてのタブにラベルを付けます。
  • 可能であれば必ず、標準リボン タブを使用してください。
  • 簡潔な 1 つの単語ラベルを使用します。 複数単語のラベルも使用できますが、使用するスペースが増え、ローカライズが困難になります。
  • 内容を明確かつ正確に説明するわかりやすいタブ名を選択してください。 名前は具体的な名前にする必要がありますが、具体的にしすぎないでください。 タブ名は、ユーザーがその内容に驚かないように、十分に予測可能なものにする必要があります。 [ホーム] タブは、最も頻繁に使用されるコマンドに使用されるため、一般的な名前が付けられている点に注意してください。
  • "基本" や "高度" などのグループ名は使用しないでください。これらのグループ名を使用すると、ユーザーは探しているコマンドが基本コマンドか高度なコマンドかを判断しなければならなくなります。
  • 目的を反映したタブ名を選んでください。 タブに関連付けられている目標またはタスクを検討してください。
  • 他のすべてのタブ名と明確に異なるタブ名を選択してください。
  • タブには、名詞または動詞を使用します。 タブ名には並列フレーズは必要ないので、名詞か動詞かに関係なく最適なラベルを選択してください。
  • 動名詞 ("-ing" で終わる名前) は使用しないでください。 代わりに、その動名詞の派生元の動詞を使用してください。 (例: "描画している" ではなく "描画" を使用してください)。
  • 特に隣接するタブでは、タブ名の最初の文字を同じにしないでください。 リボンが縮小されると、これらのタブ名のテキストが切り捨てられて同じような内容になります。
  • 単数形の名前を優先してください。 ただし、単数名が不自然な場合は複数名を使用することもできます。
  • タイトル スタイルで大文字化します。
  • 末尾に句点を付けないでください。

コンテキスト タブとタブ セットのラベル

  • コンテキスト タブ セットのラベルの最後は、[ツール] にしてください。 これを行うと、コンテキスト タブの目的を特定可能になります。
  • タイトル スタイルで大文字化します。
  • 末尾に句点を付けないでください。

グループ ラベル

  • グループに単一のコマンドがあり、グループとコマンドのラベルが同じになる場合を除き、すべてのグループにラベルを付けてください。

  • 可能であれば必ず、標準リボン グループを使用してください。

  • 簡潔な 1 つの単語ラベルを使用します。 複数単語のラベルも使用できますが、使用するスペースが増え、ローカライズが困難になります。

  • 内容を明確かつ正確に説明するわかりやすいグループ名を選択してください。 名前は、一般的なものではなく、具体的な名前にしてください。

  • 目的を反映したグループ名を選んでください。 グループ内のコマンドに関連する目標またはタスクを検討してください。

  • 動名詞 (「-ing」で終わる名前) の使用は避けてください。 ただし、動名詞の派生元である動詞を使用すると混乱を招く場合は、動名詞を使用することができます。 たとえば、"編集" や "文章校正" の代わりに "編集中" と "校正中" を使用します。

  • タブ名と同じグループ名は使用しないでください。 グループが存在するタブ名を使用すると情報が提供されず、別のタブの名前を使用すると混乱を招きます。

  • 単数形の名前を優先してください。 ただし、単数名が不自然な場合は複数名を使用することもできます。

  • 文スタイルの大文字を使用します。

  • 末尾に句点を付けないでください。

コマンド ラベル

  • すべてのコマンドにラベルを付けてください。 明示的なテキスト ラベルを付ければ、ユーザーがコマンドを見つけて理解することができます。 例外: コマンドのアイコンが非常によく知られており、スペースが限られている場合、コマンドにラベルを付けなくてもかまいません。 ほとんどの場合、ラベルのないコマンドは [ホーム] タブにあります。この場合、その Name プロパティを適切なテキスト ラベルに割り当ててください。 これにより、スクリーン リーダーなどのアシスト テクノロジ製品が、グラフィックに関する代替情報をユーザーに提供できるようになります。
  • コマンド ボタンの場合、簡潔でわかりやすいラベルを使用します。 可能であれば、1 つの単語を使用します (最大 4 単語)。
  • ドロップダウン リストでは、リストに常に値がある場合、現在の値をラベルとして使用します。
  • 検索アドレス帳プロンプトのスクリーンショット
    編集可能なドロップダウン リストに値がない場合、プロンプトを使用します。
  • 説明が不要であったり、あまり使用されないドロップダウン リストには、明示的なラベルが必要です。 ラベルの末尾にコロンを置きます。
  • [秒] の後に自動的に表示されるスクリーンショット<br>テキスト ボックスの場合、明示的なラベルを使用します。ラベルの最後にコロンを付けます。
  • 文スタイルで大文字化します。 このようにすると、Windows のトーンによりふさわしくなります。
  • ラベルは命令形の動詞で始めてください。 ただし、タブ名やグループ名、または "表示"、"作成"、"挿入"、"書式設定" などの一般的な動詞と同じである場合は除きます。
  • 末尾に句点を付けないでください。
  • スペースを節約するため、リボン コマンド ラベルに省略記号を付けないでください。 ただし、省略記号は、[アプリケーション] ボタンとドロップダウン メニューのコマンドで使用されます。

拡張ツールヒントのラベル

  • コマンド名とそのショートカット キー (該当する場合) を指定するには、タイトルを使用します。
  • タイトルでは、終了句読点を使用しないでください。
  • 動詞で説明を開始してください。 説明を使用すると、特定の機能が探している機能であるかどうかをユーザーが判断するのに役立ちます。 説明は、「これは、... する場合に使用するのに適切な機能です」という文を完成できるように表現する必要があります。
  • 説明は短くしてください。 要点を述べてください。 テキストが長いと読む気が失せてしまいます。
  • [分割貼り付け] ボタンと 2 つのヒントのスクリーンショット
    分割ボタンの場合、別のツールヒントを使って分割ボタン メニューを説明します。
  • オプションの補足説明を使って、コントロールの使用方法を説明します。 コントロール自体が状態を示していない場合、このテキストにはコントロールの状態に関する情報 (無効になっている理由を含む) を含めることができます。 このテキストは短くし、より詳しい説明についてはヘルプ トピックを使用してください。
  • グラフィックとテキストを含ツールヒントのスクリーンショット説明と補足説明には、句読点をつけて完全な文章を使用してください。
  • 文スタイルで大文字化します。

アプリケーション ボタンのラベル

ドキュメント

リボンを参照する場合:

  • リボンとそのコンポーネントをリボン、タブ、グループ、コントロールと呼びます。 これらの用語は大文字にしません。
  • 丸いボタンをアプリケーション ボタン、そこに含まれるメニューをアプリケーション メニューと呼びます。
  • ツール バーをクイック アクセス ツール バーと呼びます。
  • タブは、ラベルと "タブ" という単語で参照します。大文字と小文字の区別を含め、正確なラベル テキストを使用してください。
  • コマンドはラベルで参照します。 ラベルのないコマンドはツールヒント名で参照します。 大文字と小文字を含む正確なラベル テキストを使用しますが、省略記号は含めないでください。 単語ボタンやコマンドは含めないでください。
  • ユーザー操作を説明するには、タブとコントロールのクリックを使用します。 編集可能なドロップダウン リストには、Enter を使用します。 "選択"、"選択する"、"選ぶ" は使用しないでください。
  • 使用できない項目については、淡色表示、無効、または灰色表示ではなく、使用できないものとして参照してください。 プログラミング ドキュメントでは、無効を使用します。
  • 可能な場合は、太字のテキストを使用してラベルを書式設定してください。 それ以外の場合、混乱を防ぐため、必要な場合にのみラベルを引用符で囲みます。

例 :

  • [ホーム] タブの [形式を選択して貼り付け] をクリックします。
  • [ホーム] タブの [フォント] ボックスに「Segoe UI」と入力します。
  • [レビュー] タブの [変更履歴とコメントの表示] をクリックし、[レビュー担当者] をクリックします。
  • [書式] タブの [画像ツール] で、[画像の圧縮] をクリックします。