iframe-focusable-content
tabindex="-1"のフレームにフォーカス可能なコンテンツを含めてはいけません
tabindex="-1"を持つ同一オリジンの<iframe>/<frame>要素が、キーボードのユーザーが到達できないフォーカス可能なコンテンツを含まないことを確認します。負のtabindexは、フレームのコンテンツ全体をタブ順序から外すためです。
適用範囲:明示的な負のtabindexを持つ<iframe>/<frame>要素のうち、埋め込み文書が同一オリジンで、contentDocumentからアクセスできるものに適用されます。クロスオリジンのフレームなど中にアクセスできないフレームは内部を調べられないため、何も判定しません。
期待される結果:フレームの埋め込み文書に、シーケンシャルフォーカスナビゲーション順序に含まれる要素がありません。<iframe>の負のtabindexは、そのブラウジングコンテキスト全体をタブ順序から外します。Tabキーは中のものをすべてスキップするため、そこにあるリンクやコントロールにはキーボードで到達できません(ACT akn7bn。ChromiumではTabキーでフレームの前の要素から後の要素へ移動します)。要素がこの順序に含まれるかどうかは、フレーム自身の文書の中でHTMLの規則に従って判断します。無効(:disabled。無効な<fieldset>は該当しますが、その最初の<legend>は該当しません)またはinertの場合は含まれません。整数として解析できるtabindexがあればそれで決まり、無効な値(""、"abc")は無視します。それ以外の場合は、hrefを持つリンク、hidden以外のフォームコントロール、フレーム、controlsを持つメディア、レンダリングされた<img>が使うイメージマップの<area>(usemapは完全一致で照合)、<details>の最初の<summary>、編集ホスト(contenteditableが""、"true"、"plaintext-only")が含まれます。例外:widthとheightのHTML属性がどちらも2px以下のiframe(よくある「トラッキングピクセル」のパターン)は知覚できるコンテンツをレンダリングできないため、その中のフォーカス可能なコンテンツはACT akn7bnの「可視」の要件を満たすことがなく、数に入りません。
例
<iframe tabindex="-1" width="300" height="150" srcdoc="<p>No focusable content</p>"></iframe>
tabindex="-1"がフレームをタブ順序から外しており、中にもフォーカス可能なものはありません。
<iframe tabindex="-1" width="300" height="150" srcdoc="<a href='/x'>Link inside</a>"></iframe>
ホストのフレームはtabindex="-1"でスキップされますが、中のリンクには引き続きTabキーで到達できます。ブラウザーは負のtabindexを埋め込み文書に伝播しません。
確認方法
このルールが判断できない場合はcantTellを報告し、判断を人に委ねます。ルールが投げかける各質問を、理由コードごとに、答えるための手順とともにここに示します。検出結果にも同じ手順がhowToCheckとして、スキャンの言語で含まれます。出力スキーマを参照してください。
IFRAME_TABINDEX_NEGATIVE_CONTENT_RUNTIME_REDIRECT
- レポートに示されたフレームのすぐ手前でページをクリックし、Tabキーを押してフレームの方へ移動してください。
- Tabキーを押し続け、フォーカスがフレームの内側に移ることがあるか、またフレームに届くはずのときにどこへ移るかを観察してください。
- [Elements]パネルでフレーム内のフォーカス可能な要素を調べ、それが空のフォーカスガードか、内容のある実際のリンクやコントロールかを控えてください。
- 実際のリンクやコントロールであれば、ほかのあらゆるキーボードでの経路(Shift+Tab、フレーム自身のコントロール)を試し、到達して使えるか確認してください。
満たす場合:フレーム内で唯一のフォーカス可能な要素は、フォーカスを先へ送る空のフォーカスガードであり、フレーム内で利用者が必要とするものはすべてキーボードで到達できます。
満たさない場合:フォーカスが飛ばされるか跳ね返されるため、フレーム内の実際のリンクやコントロールにキーボードで到達できないか使えず、WCAG 2.1.1を満たしません。