解説書 達成基準 2.4.12:隠されないフォーカス (高度) (レベル AAA)

要約

目標

フォーカスのある項目のどの部分も覆わない。

何をすればよいか

項目がキーボードフォーカスを取得したときに、その項目が完全に見えることを保証する。

なぜそれが重要か

マウスを使用できない人々は、キーボードフォーカスがどこにあるかを確認する必要がある。

意図

この達成基準の意図は、キーボードフォーカスを受け取る項目が、利用者のビューポート内で常に表示されることを保証することである。キーボード (又はスイッチ、音声入力など、キーボードインターフェースを通じて操作するデバイス) に依存している目の見える人にとって、現在のフォーカス地点を知ることは非常に重要である。フォーカスを持つコンポーネントは、ページ上のインタラクション地点を示す。利用者がフォーカスを持つ項目を見ることができない場合、利用者はどのように進めればよいのかわからない、又はシステムが応答しなくなったとさえ思うかもしれない。

フォーカスされた項目と重なる可能性のある代表的なコンテンツの種類は、スティッキーフッター、スティッキーヘッダー、及び非モーダルダイアログである。利用者がページ内をタブで移動すると、これらのコンテンツのレイヤーにより、フォーカスを受け取った項目がフォーカスインジケータと共に覆い隠されてしまう可能性がある。

Cookie バナーのようなスティッキーコンテンツとして実装された通知は、フォーカスを受け取るコンポーネントを部分的にでも覆う場合、この達成基準に失敗する。合格する方法には、利用者がページ内をナビゲートする前にバナーを閉じる必要があるようにバナーをモーダルにする、又はバナーが他のコンテンツと重ならないように scroll-padding を使用する、といったものがある。利用者のアクションを必要としない通知も、フォーカスが失なわれるときに閉じることでこの基準を満たすことができる。

別の隠される状況としては、ライトボックス又はその他の半透明効果がフォーカスを持つ項目に重なる場合がある。この隠される状況は、この達成基準の範囲外である。不透明度が 100％未満であればコンポーネントが視覚的に隠れることはないが、そのような半透明の重なりにより 1.4.11 非テキストのコントラスト 及び／又は 2.4.13 フォーカスの外観の失敗が発生する場合がある。フォーカスインジケータが半透明のコンポーネントによって覆われる場合、そのフォーカスインジケータは 1.4.11 及び 2.4.13 に照らして評価されるべきである。この達成方法の意図は、どちらの状況にせよ、利用者がどの項目にフォーカスがあるのか判断できないほどにフォーカスを受け取るコンポーネントが隠されるべきではない、ということである。

利点

• キーボードインタフェースに依存してページを操作している目の見える利用者は、キーボードフォーカスを取得するコンポーネントを見ることができる。そのような利用者には、キーボードインタフェースを利用するデバイス (音声入力、呼気・吸気ソフトウェア、オンスクリーンキーボード、スキャンソフトウェア、並びにさまざまな支援技術及び代替キーボードなど) に依存するような利用者が含まれる。
• 視力に制限がある又はロービジョンだが、(ビューポートの向き及び位置を変えるために) ポインティングデバイスに依存している利用者は、特に拡大によってコンテンツの全体的な使用可能部分が減少する場合に、キーボード操作の現在位置が明確に表示されることで恩恵を受ける。
• 注意力の制限、短期記憶の制限、又は実行プロセスの制限がある人々は、フォーカスがどこにあるのかをより容易に発見できることで恩恵を受ける。

事例

• ページにスティッキーフッター (ビューポートの下部に固定されている) がある。タブ操作でページの下に移動しても、フォーカスされた項目はフッターによって少しも隠れることはない。これは、ビューポート内のコンテンツが上にスクロールして、scroll-padding を使用してキーボードフォーカスのある項目が常に表示されるためである。
• ページに大きな (幅 30％の) クッキー承認ダイアログがある。ダイアログはモーダルであり、閉じられるまでページ内の他のコントロールへのアクセスを防ぐ。選択が行われて送信されるまで、クッキー承認ダイアログ (フォーカスインジケータを含む) は画面上に残るため、フォーカスは隠されない。
• 通知はスティッキーヘッダーとして実装され、キーボードフォーカスは通知に移動する。通知はフォーカスを失うと消え、他のコントロール (通知の前に表示されていたフォーカスインジケータを含む) に隠されることはない。

テクニック

この節にある番号付きの各項目は、WCAG ワーキンググループがこの達成基準を満たすのに十分であると判断するテクニック、又は複数のテクニックの組み合わせを表している。しかしながら、必ずしもこれらのテクニックを用いる必要はない。その他のテクニックについての詳細は、WCAG 達成基準のテクニックを理解するの「その他のテクニック」を参照のこと。