【注意】この文書にはより新しいバージョンが存在します: WCAG 2.1 達成方法集
この達成方法 (参考) の使用法と、この達成方法が WCAG 2.0 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.0 を満たすコンテンツを作成するために使用できることを意味するものではない。
HTML 4.01 及び XHTML 1.x
これは、次の達成基準に関連する達成方法である:
この達成方法の目的は、テーブルにどのようにデータがまとめられているかという短い概略や、テーブルをどのように読み進めるかという短い説明を提供することである。table
要素に summary
属性を指定しておくことで、スクリーンリーダーの利用者がこのような情報を入手できるが、視覚的には表示されない。
summary
属性は、テーブルの構造が複雑な場合 (たとえば、行ヘッダーや列ヘッダーが複数組み合わせてある場合や、行グループや列グループが複数ある場合) に有用である。また、summary
属性は、構造は単純でもたくさんの行や列を含んでいるデータテーブルでも役に立つ。
summary
属性は、そのテーブルに caption
要素があるかどうかに関わらず指定できる。両方を用いる場合には、summary
属性の内容が単に caption
要素の繰り返しであってはならない。
注記: HTML5 では、summary
属性は廃止された。支援技術はこの属性を引き続きサポートしているかもしれないし、していないかもしれない。コンテンツ制作者は代替手段を検討し、慎重に使うべきである。
注記: WCAG 2.0 はレイアウトレテーブルの使用を禁止していないが、CSS ベースのレイアウトを推奨している。HTML の table
要素に与えられたセマンティックな意義を守り、コンテンツから提示を分離するというコーディング実務に従うためである。レイアウトテーブルを用いる場合には、summary
属性は使用しないか、値を空にする。レイアウトテーブルの目的は、コンテンツの配置を制御することのみであって、テーブルそのものは利用者から見て「透明 (不可視)」であるべきである。summary
属性がテーブルの存在を示してしまうと、この透明性を「壊して」しまう。なお、レイアウトテーブルに空の summary
属性 (summary=""
) を指定することは許容範囲である。F46: 達成基準 1.3.1 の失敗例 - レイアウトテーブルで、th 要素、caption 要素、又は空ではない summary 属性を使用しているを参照のこと。
この事例は、バスの時刻表を表している。summary
属性には、運行系統と目的地、時刻表の利用方法が記述されている。
コード例:
<table summary="Schedule for Route 7 going downtown. Service begins
at 4:00 AM and ends at midnight. Intersections are listed in the top row.
Find the intersection closest to your starting point or destination, then read
down that column to find out what time the bus leaves that intersection.">
<tr>
<th scope="col">State & First</th>
<th scope="col">State & Sixth</th>
<th scope="col">State & Fifteenth</th>
<th scope="col">Fifteenth & Morrison</th>
</tr>
<tr>
<td>4:00</td>
<td>4:05</td>
<td>4:11</td>
<td>4:19</td>
</tr>
…
</table>
訳注: WAIC では H73-1 に関するアクセシビリティ・サポーテッド(AS)情報を提供している。
2014 年 6 月版のアクセシビリティ・サポーテッド(AS)情報: H73-1 では、「要注意」と評価されている。WAIC はウェブ制作者にこの達成方法が一部の環境では動作しないことに注意を促すものである。
この事例では、summary
属性と caption
要素の両方を用いている。caption
要素ではバスの運行系統を特定している。summary
属性には、全盲の利用者が時刻表の利用方法を理解するのに役立つ内容を記述している。スクリーンリーダーは、まず caption
要素を、続いて summary
属性を読み上げる。
コード例:
<table summary="Intersections are listed in row 1.
Find the intersection closest to your starting point
or destination, then read down that column to find
out what time the bus leaves that intersection.
Service begins at 4:00 AM and ends at midnight.">
<caption>Route 7 Downtown (Weekdays)</caption>
…
</table>
訳注: WAIC では H73-2 に関するアクセシビリティ・サポーテッド(AS)情報を提供している。
2014 年 6 月版のアクセシビリティ・サポーテッド(AS)情報: H73-2 では、「要注意」と評価されている。WAIC はウェブ制作者にこの達成方法が一部の環境では動作しないことに注意を促すものである。
この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
HTML 4.01 summary attribute
訳注: HTML 4.01 は Superseded Recommendation としてマークされ、廃止された仕様である。上記は、HTML 5.2§11.2. Non-conforming features で不適合な機能として定義されている。
各データテーブルにおいて:
summary
属性がある場合、その summary
属性がテーブルの構造を記述しているか、又は、テーブルの使い方を説明していることを確認する。
データテーブルに summary
属性と caption
要素の両方が存在している場合、summary
属性の内容が単に caption
要素の繰り返しになっていないことを確認する。
1 及び 2 の結果が真である。
この達成方法が「十分な達成方法」の一つである場合、この手順や期待される結果を満たしていなければ、それはこの達成方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の達成方法によってその達成基準が満たされていることもありうる。