次の方法で共有


ステータス バー (デザインの基本)

Note

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

ステータス バーは、現在のウィンドウの状態 (表示されている内容や方法など)、バックグラウンド タスク (印刷、スキャン、書式設定など)、またはその他のコンテキスト情報 (選択やキーボードの状態など) を表示する、プライマリ ウィンドウの下部にある領域です。

ステータス バーは通常、テキストとアイコンを使用して状態を示しますが、進行状況インジケーターや、状態に関連するコマンドやオプションのメニューを含めることもできます。

一般的なステータス バーのスクリーン ショット

一般的なステータス バー。

Note

通知領域に関連するガイドラインは、別の記事で示されています。

これは適切なユーザー インターフェイスですか?

それを判断するには、以下の質問を考えます。

  • ユーザーが他のプログラムを積極的に使用している場合、状態は関連していますか? その場合は、 通知領域アイコンを使用します。

  • ステータス アイテムは通知を表示する必要がありますか? その場合は、通知領域アイコンを使用する必要があります。

  • ウィンドウはプライマリ ウィンドウですか? そうでない場合は、ステータス バーを使用しないでください。 ダイアログ ボックス、ウィザード、コントロール パネル、およびプロパティ シートにステータス バーを含めることはできません。

  • 情報は主に状態ですか? そうでない場合は、ステータス バーを使用しないでください。 ステータス バーは、セカンダリ メニュー バー または ツール バーとして使用しないでください。

  • この情報は、選択したコントロールの使用方法を説明していますか? その場合は、代わりに補足説明または命令ラベルを使用して、関連付けられているコントロールの横に情報を表示します。

  • 状態は役に立ち、関連性がありますか? つまり、ユーザーは、この情報の結果として動作を変更する可能性がありますか? 表示されない場合は、状態を表示しないか、ログ ファイルに保存します。

  • 状態は重要ですか? 即時アクションは必要ですか? その場合は、 ダイアログ ボックス やプライマリ ウィンドウ自体など、注意が必要で、簡単に無視できないフォームで情報を表示します。

    赤い '証明書エラー' ステータス バーのスクリーン ショット

    Windows インターネット エクスプローラーの赤いアドレス バー。

  • プログラムは主に初心者向けですか? 経験の浅いユーザーは通常、ステータス バーを認識しないため、この場合はステータス バーの使用を再検討してください。

設計概念

ステータス バーは、ユーザーを中断したり、フローを中断したりすることなく、状態情報を提供する優れた方法です。 ただし、ステータス バーは見落としやすいです。 実際、多くのユーザーがステータス バーにまったく気付かないのは簡単です。

この問題の解決策は、ガーリッシュ アイコン、アニメーション、またはフラッシュを使用してユーザーの注意を喚起するのではなく、この制限を設計することです。 これは次の方法で実行できます。

  • 状態情報が役立ち、関連性があることを確認します。 そうでない場合は、ステータス バーをまったく指定しないでください。
  • 重要な情報にステータス バーを使用しません。 ユーザーは、ステータス バーの内容を知る必要はありません。 ユーザーが表示する必要がある場合は、ステータス バーに配置しないでください。

1 つだけ行う場合...

ステータス バーの情報が役に立ち、関連性は高いが、重要ではないことを確認します。

使用パターン

ステータス バーには、いくつかの使用パターンがあります。

使用法
現在のウィンドウの状態
表示されている内容のソースと任意のビュー モードを表示する

この例では、ステータス バーにドキュメントへのパスが表示されます。
進行状況
明確な進行状況バーまたはアニメーションを使用して、バックグラウンド タスクの進行状況を表示します。
進行状況バーを含むステータス バーのスクリーン ショット
この例では、ステータス バーに、インターネット エクスプローラー ウィンドウへの Web ページの読み込みを示す進行状況バーが含まれています。
コンテキスト情報
ユーザーが現在行っていることに関するコンテキスト情報を表示します。
ピクセル数を示すステータス バーのスクリーン ショット
この例では、Microsoft ペイント選択サイズをピクセル単位で示します。

ガイドライン

全般

  • 一部のユーザーのみがステータス バー情報を必要とする場合は、ステータス バーの表示コマンドを指定することを検討してください。 ほとんどのユーザーがステータス バーを必要としない場合は、既定でステータス バーを非表示にします。
  • ステータス バーを使用してメニュー バーの項目を説明しないでください。 このヘルプ パターンは検出できません。

プレゼンテーション

  • 適用されないモーダル状態を無効にします。 モーダル状態には、キーボードとドキュメントの状態が含まれます。
  • 適用されない非モーダル状態を削除します。
  • 次の順序で状態情報を表示する: 現在のウィンドウの状態。進行 状況;コンテキスト情報。

アイコン

  • 簡単に認識できる状態アイコンのデザインを選択します。 四角形または長方形のアイコンよりも、一意の輪郭を持つアイコンを優先します。

  • 状態情報を伝えるためには、純粋な赤、黄、緑のみを使用します。 そうしないと、このようなアイコンが混乱します。

    正確:

    青いアイコンが表示されたステータス バーのスクリーン ショット

    正しくない:

    赤いアイコンが表示されたステータス バーのスクリーン ショット

    正しくない例では、赤いアイコンが誤ってエラーを示唆し、混乱を生み出しています。

  • アイコンのバリエーションまたはオーバーレイを使用して、状態または状態の変更を示します。 アイコンのバリエーションを使用して、数量または強度の変化を表示します。 その他の種類の状態の場合は、次の標準オーバーレイを使用します。

    オーバーレイ Status
    警告アイコンのスクリーン ショット
    警告
    エラー アイコンのスクリーン ショット
    エラー
    無効/切断されたアイコンのスクリーン ショット
    無効/切断済み
    ブロック/オフライン アイコンのスクリーン ショット
    ブロック/オフライン
  • 状態を頻繁に変更しないでください。 ステータス バーのアイコンは、ノイズが多い、不安定な、または注意を要しないようにする必要があります。 目は周辺視野の変化に敏感であるため、状態の変化は微妙である必要があります。

  • 重要な状態情報を提供するアイコンの場合は、インプレース ラベルを使用します。

  • ラベル付けされていないステータス バーのアイコンにはヒントが必要です。

詳細については、「 アイコン」を参照してください。

相互作用

  • ステータス バー領域を対話形式にして、ユーザーが関連するコマンドとオプションに直接アクセスできるようにします。
    • メニュー ボタンや分割ボタンのように見え、動作するコントロールを使用します。 これらのステータス バー領域には、クリック可能であることを示すドロップダウン矢印が必要です。
    • マウスを上にしてではなく、マウスを下にして左クリックでメニューを表示します。
    • 右クリックまたはダブルクリックはサポートされません。 ユーザーはステータス バーでこのようなやり取りを期待しないため、ユーザーが操作を試みる可能性は高くありません。
  • ホバー時にヒントを表示します。

Text

  • 一般に、簡潔なラベルを使用します。 削除できる任意のテキストを切り取る。
  • 句読点を終了せずに、文の断片を優先します。 文のフラグメントが大幅に短くない場合にのみ、完全な文 (句読点を含む) を使用します。
  • 省略可能な進行状況ラベルの場合は、動詞 (gerund 形式) で始まり、省略記号で終わるラベルを使用して、操作が何を行っているかを示します。 例: "Copying..."。 操作に複数のステップがある場合、または複数のオブジェクトを処理している場合、このラベルは動的に変更される可能性があります。
  • ステータス バーのテキストを強調するために、色、太字、斜体は使用しないでください。
  • ヒントの言い回しのガイドラインについては、「 ヒントとヒント」を参照してください。

ドキュメント

ステータス ラインやその他のバリエーションではなく、ステータス バーをステータス バーとして参照します。 例: "現在のページ番号がステータス バーに表示されます。"