【注意】この文書にはより新しいバージョンが存在します: WCAG 2.1 達成方法集
この達成方法 (参考) の使用法と、この達成方法が WCAG 2.0 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.0 を満たすコンテンツを作成するために使用できることを意味するものではない。
HTML 及び XHTML。
これは、次の達成基準に関連する失敗例である:
F91 に関するユーザエージェントサポートノートを参照のこと。
この失敗例は、データテーブルが、テーブルコンテンツの内側からプログラムによる解釈が可能な見出しを作成するために、見出し要素 (th
) 又はほかの適切なテーブルマークアップ (scope
) 属性、headers
及び id
又は ARIA ロール columnheader
/ rowheader
) を使用しないときに起こる。データセルがヘッダー情報とともにのみ明瞭である場合、ヘッダーをプログラムによる解釈が可能にすることは、特に重要である。スクリーンリーダーの利用者がテーブルコンテンツを水平又は垂直にナビゲートする場合、データセル内の情報に必要な文脈を提供するために変更された見出しを読み上げることができる。
このテーブルは見出しとして th
(あるいはほかの適切な見出しマークアップ) を使っていない。かわりに、すべてのセルに td
要素が使われている。セルからセルへ移動するのに、スクリーンリーダーは見出しセルに関連付けられたコンテンツの読み上げにしばしば失敗する。
Example Code:
<table>
<tr>
<td>Name</td>
<td>Age</td>
<td>Height (cm)</td>
<td>Weight (kg)</td>
</tr>
<tr>
<td>Linda</td>
<td>33</td>
<td>169</td>
<td>59</td>
</tr>
<tr>
<td>Jack</td>
<td>37</td>
<td>184</td>
<td>74</td>
</tr>
<tr>
<td>Kira</td>
<td>8</td>
<td>120</td>
<td>21</td>
</tr>
<tr>
<td>Daniel</td>
<td>3</td>
<td>79</td>
<td>14</td>
</tr>
</table>
全てのデータテーブルについて、次のいずれかのメカニズムを用いて、テーブル見出しが正しくプログラムによる解釈が可能かどうかを確認する:
テーブル見出し要素 (th
) でマークアップされた見出し
テーブル見出しが 1 行より多い又は 1 列より多いテーブルの th
における scope
属性
テーブル見出しが 1 行より多い又は 1 列より多いテーブルの th
における scope
属性
headers
属性と id
属性を用いて関連付けられた見出し及びデータのセル
scope
属性を持つ td
要素としてマークアップされた見出し
ARIA ロールの rowheader
属性又は columnheader
属性でマークアップされた見出し
訳注: 2 と 3 は全く同一の内容であるが、原文ママである。
上記の全ての結果が偽である場合、この失敗条件は適用され、コンテンツは達成基準の失敗となる。