Skip to content

テクニック F110:達成基準 2.4.11 隠されないフォーカス (最低限) の失敗例 ― フォーカスされた要素を完全に隠す固定フッター又はヘッダー

このテクニックについて

このテクニックは 2.4.11: 隠されないフォーカス (最低限) (失敗例) に関連する。

この失敗例は、キーボードインタフェースをサポートする全ての技術を使用したコンテンツに適用される。

解説

この失敗例の目的は、キーボードインタフェース (例: リンク及びコントロールをタブで移動) を使用する利用者が、コンテンツ制作者の他のコンテンツに邪魔されてインジケータの位置を見られない状況を回避することである。

ビューポートと共に移動する「スティッキー」コンテンツは、利用者がタブで移動できるコントロールを含む、ページ上の他の要素を覆い隠してしまう可能性がある。

事例

事例 2: スティッキーヘッダー

ウェブページには、利用者がページをスクロールしてもビューポートの上部に表示されたままになるスティッキーヘッダーがある。ヘッダーは、利用者がタブでページを上に移動したときに、フォーカスされている要素を完全に覆う高さがある。

Failure example of sticky header that completely cover elements in focus as a user tabs up the page.

検証

手順

ページ上のリンク及びコントロールをタブ移動する。ページを下に進んだり、上へ戻ったりする:

  1. フォーカスされた要素が他のコンテンツによって完全に隠されているかどうかをチェックする。

期待される結果

  • 1 が真である場合、この失敗条件が適用され、コンテンツは達成基準の失敗となる。
Back to Top