【注意】この文書にはより新しいバージョンが存在します: WCAG 2.1 達成方法集
この達成方法 (参考) の使用法と、この達成方法が WCAG 2.0 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.0 を満たすコンテンツを作成するために使用できることを意味するものではない。
HTML 及び XHTML
これは、次の達成基準に関連する失敗例である:
この文書は、タブ順序がコンテンツの論理的な関係性及び順序に従っていない失敗例について述べている。
リンク及びフォーム要素のようなフォーカス可能な要素には、tabindex
属性がある。要素は、tabindex
属性の値が小さいものから大きいものへという順序でフォーカスを受け取る。tabindex
属性の値が、コンテンツ内での関係性及び順序とは異なる順序で割り当てられていると、もはやタブ順序はコンテンツの関係性及び順序に従っていないことになる。
この失敗例の最も一般的な原因の一つは、tabindex
が使用されているページを編集するときに発生する。コンテンツが編集されても、tabindex
属性がコンテンツの変更を反映するように更新されない場合、タブの順序とコンテンツの順序が一致しなくなり易い。
次の事例は、代替のタブ順序を指定するために tabindex を誤って用いている。
コード例:
<ol>
<li><a href="main.html" tabindex="1">Homepage</a></li>
<li><a href="chapter1.html" tabindex="4">Chapter 1</a></li>
<li><a href="chapter2.html" tabindex="3">Chapter 2</a></li>
<li><a href="chapter3.html" tabindex="2">Chapter 3</a></li>
</ol>
このリストを Tab キーを用いてナビゲートする場合、リストは、Homepage、Chapter 3、Chapter 2、Chapter 1、という順序でナビゲートされ、コンテンツにおける順序通りではなくなってしまう。
すべてのテキストフィールドに対して tabindex
属性を提供することによって、ウェブページでのタブ順序が明確に設定されていた。後に、そのページには新しいテキストフィールドがページの中央付近に追加されたが、コンテンツ制作者はその新しいテキストフィールドに tabindex
属性を付加し忘れてしまった。結果として、新しいテキストフィールドのタブ順序がそのページの最後になってしまっている。
この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
HTML 4.01 Tabbing navigation
訳注: HTML 4.01 は Superseded Recommendation としてマークされ、廃止された仕様である。上記は、HTML 5.2§5.4.3. The tabindex attribute を代わりに参照できる。
tabindex
属性を用いている場合、tabindex
属性によって指定されているタブ順序がコンテンツの関係性に従っているかどうかを確認する。
1. の結果が偽である場合、この失敗例の条件は適用され、コンテンツは達成基準の失敗となる。