適用 (対象)
HTML 及び XHTML
これは達成基準 1.3.1: 情報及び関係性 (書かれていない達成方法を満たす慣習的な達成方法) に関する達成方法である。
解説
この達成方法の目的は、利用者がテーブルを見ることができない場合、又は提示形式が変更された場合でも、含まれる情報の関係を保てる方法で、表の情報を提示することである。情報を表として提示すべきと考えられるのは、テキスト、数値、画像、あるいは他のデータの論理関係が (垂直及び水平に) 2 次元で存在するときである。論理関係は列と行で示され、列と行は論理関係が認識できる状態でなければならない。
table
要素は、子要素 tr
、th
、td
といっしょに用いることで、論理関係を認識可能にする。一方、列を整形するのにタブを入れたり、pre
要素を利用するのは、純粋に見た目だけを考えた方法である。利用者がテーブルを見ることができない場合、又は提示形式が変更された場合は、視覚的に暗に示された論理関係は失われてしまう。
単純な表は一般的に列に対して一つのレベルの見出し、及び/又は行に対して一つのレベルの見出しがある。
通常、単純な表では、1 行目の 1 列目は空白または列全体の内容を 1 列目に記述する。1 行目の 1 列目は空白がなく (つまり、"列見出し"を含む)、列全体の内容を記述しており、読者は列と列の間の異なる意味を区別できる。
1 列目の行は、通常では空白ではなく、行全体の内容を記述した"行見出し"を含んでることが多い。読者は行と行の間の異なる意味を区別できる。その他に、1 列目は単純なデータが含まれる。
WAIC では H51 に関するアクセシビリティ・サポーテッド(AS)情報を提供している。2014 年 6 月版の アクセシビリティ・サポーテッド(AS)情報: H51 では、「達成可能」と評価されている。WAIC はこの達成方法が検証した環境で広く動作すると判断している。
WAIC では H51 に関するアクセシビリティ・サポーテッド(AS)情報を提供している。2020 年 3 月版の アクセシビリティ サポーテッド(AS)情報: H51 も参照されたい。
事例
事例 1: 列見出しと行見出しが付いた簡単なデータテーブルとしてマークアップしたスケジュール表
この事例では、簡単なデータテーブルに table 要素を利用している。1 行目は曜日、1 列目は時間である。これらのセルは th
要素でマークアップしてあり、列見出しが曜日、行見出しが時間という役割になっている。
スクリーンリーダーは、利用者がテーブルを読み進めるとき、対応する見出し情報の変化を読み上げる。それゆえ、スクリーンリーダーの利用者が同じ行を左右に動くときは、(もしあれば) 予定に対応する曜日 (列見出し) の読み上げを、同じ列を上下に移動するときは、対応する時間の読み上げを聞くであろう。
<table> <tr> <td> </td> <th>Monday</th> <th>Tuesday</th> <th>Wednesday</th> <th>Thursday</th> <th>Friday</th> </tr> <tr> <th>8:00-9:00</th> <td>Meet with Sam</td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <th>9:00-10:00</th> <td> </td> <td> </td> <td>Doctor Williams</td> <td>Sam again</td> <td>Leave for San Antonio</td> </tr> </table>
参考リソース
この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
- HTML 4.01 Table Element
- HTML 4.01 Table rows: The TR element
- HTML 4.01 Table cells: The TH and TD elements
HTML 4.01 は Superseded Recommendation としてマークされ、廃止された仕様である。上記はそれぞれ、HTML Standard: 4.9 Tabular dataを代わりに参照できる。
検証
手順
- 表形式の情報があることを確認する。
-
表形式の情報それぞれについて:
- 少なくとも
table
、tr
、th
、及びtd
要素をもつテーブルマークアップが使用されていることを確認する。
- 少なくとも
期待される結果
- 上記全ての結果が真である。