ランドマークと見出し

ランドマーク と 見出しは、支援技術 (AT) のユーザーが、ユーザー インターフェイスのさまざまなセクションを一意に識別することで、UI をより効率的にナビゲートするのに役立ちます。

概要

通常、ユーザー インターフェイスは、目が見えるユーザーがすべてのコンテンツを読む速度を落とさずに、興味があることにざっと目を通すことができるように視覚的に効率的な方法で編成されます。 スクリーン リーダー ユーザーにも、これと同じようにざっと目を通す機能が必要です。 コンテンツをランドマークと見出しにマークすることで、スクリーン リーダー のユーザーに、目が見えるユーザーと同じようにコンテンツにざっと目を通すオプションが提供されます。

スクリーン リーダー ユーザーがすばやいナビゲーションを行えるように、Web コンテンツには長年にわたり、ARIA ランドマーク、ARIA 見出し、および HTML 見出しの概念が使用されてきました。 Web ページでは、ランドマークと見出しを使用して、AT ユーザーが大きい塊 (ランドマーク) と小さい塊 (見出し) にすばやくアクセスできるようにすることで、コンテンツをさらに使いやすくしています。

具体的には、スクリーン リーダーに、ランドマーク間で移動したり、見出しの間で移動したりできるコマンドがあります (次へ/前へ、または特定の見出しレベルへ)。

ランドマークを使うと、コンテンツを検索、ナビゲーション、メイン コンテンツなど、さまざまなカテゴリにグループ化することができます。 グループ化すると、AT ユーザーはグループ間をすばやく移動できます。 このすばやいナビゲーションでは、以前は項目ごとに移動する必要があり、かなりの量になり得るコンテンツをスキップすることができます。

たとえば、タブ パネルを使用する際は、それをナビゲーション ランドマークと考えてください。 検索エディット ボックスを使用する際は、それを検索ランドマークと考え、メイン コンテンツをメイン コンテンツランドマークとして設定することを検討してください。

ランドマークの内部でも外部でも、サブ要素を論理見出しレベルがある見出しとして注釈することを検討してください。

Windows 設定アプリ

次の図は、以前のバージョンの Windows 設定アプリの [簡単操作] ページを示しています。

このページでは、検索エディット ボックスは検索ランドマーク内でラップされ、左側のナビゲーション要素はナビゲーション ランドマーク内でラップされ、右側のメイン コンテンツはメイン コンテンツ ランドマーク内でラップされています。

ナビゲーション ランドマーク内には、[簡単操作] (見出しレベル 1) と呼ばれるメインのグループ見出しがあり、[視覚]、[聴覚] などのサブオプション (見出しレベル 2) があります。 メインコンテンツ内で、[表示]は見出しレベル 1 に設定され、サブグループ ([すべて大きくする] など) が見出しレベル 2 に設定されます。

ランドマークや見出しがなくても設定アプリにアクセスできますが、これらがある方がさらに使いやすくなります。 この場合、スクリーン リーダーを持つユーザーは、関心のあるグループ (ランドマーク) にすばやくアクセスでき、そこからサブグループ (見出し) にすばやくアクセスできます。

使用方法

AutomationProperties.LandmarkTypeProperty を使用して、ランドマークの種類として UI 要素を設定します。 このランドマーク UI 要素は、そのランドマークに関連する他のすべての UI 要素をカプセル化します。

AutomationProperties.LocalizedLandmarkTypeProperty を使用して、ランドマークに名前を付けます。 メインやナビゲーションなど、定義済みのランドマークの種類を選択した場合は、それらの名前がランドマーク名に使用されます。 ただし、ランドマークの種類をカスタムに設定する場合は、このプロパティを使用してランドマークに名前を付ける必要があります (このプロパティを使用して、定義済みのランドマークの種類の既定の名前をオーバーライドすることもできます)。

AutomationProperties.HeadingLevel を使用して、UI 要素を Level1 ～ Level9 の特定のレベルの見出しとして設定します。

例

Windows デスクトップ アプリにおけるアクセシビリティに関する一般的なプログラムの問題の多くを解決する方法については、Windows デスクトップ アプリにおけるアクセシビリティに関する一般的なプログラムの問題を解決するためのコード サンプルに関するページを参照してください。

これらのコード サンプルは、Microsoft Accessibility Insights for Windows によって直接参照されています。これは、UI における多くのアクセシビリティの問題を識別するうえで役立ちます。