WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

H73: データテーブルの概要を提供するために、table 要素の summary 属性を使用する

達成方法に関する重要な情報

これらの達成方法(参考)の使用法及び、それらが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 属性を使用しているを参照のこと。

事例

事例 1: summary 属性はあるが、caption 要素はないデータテーブル

この事例は、バスの時刻表を表している。summary 属性には、運行系統と目的地、時刻表の利用方法が記述されている。

コード例:

<table summary="7系統、市街地行きの時刻表です。朝4時に運行開始、
深夜に終了します。経由地は先頭の行に示してあります。
出発地や目的地に最も近い経由地を見つけ、その列を下のほうに読み進めて、
バスの出発時刻を見つけてください。">
  <tr>
    <th scope="col">一番街</th>
    <th scope="col">六番街</th>
    <th scope="col">十五番街</th>
    <th scope="col">十五番街モリソン通り</th>
  </tr>
  <tr>
    <td>4:00</td>
    <td>4:05</td>
    <td>4:11</td>
    <td>4:19</td>
  </tr>
  …
</table> 

事例 2: summary 属性と caption 要素の両方があるデータテーブル

この事例では、summary 属性と caption 要素の両方を用いている。caption 要素ではバスの運行系統を特定している。summary 属性には、全盲の利用者が時刻表の利用方法を理解するのに役立つ内容を記述している。スクリーンリーダーは、まず caption 要素を、続いて summary 属性を読み上げる。

コード例:

<table summary="経由地は1行目に示してあります。
出発地や目的地に最も近い経由地を見つけ、その列を下のほうに読み進めて、
バスの出発時刻を見つけてください。
朝4時に運行開始、深夜に終了します。">
  <caption>7系統、市街地行き(平日)</caption>
…
</table> 

参考リソース

この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。

検証

チェックポイント

各データテーブルにおいて:

  1. summary 属性がある場合、その summary 属性がテーブルの構造を記述しているか、または、テーブルの使い方を説明していることを確認する。

  2. データテーブルに summary 属性と caption 要素の両方が存在している場合、summary 属性の内容が単に caption 要素の繰り返しになっていないことを確認する。

判定基準

この達成方法が「十分な達成方法」の一つである場合、このチェックポイントや判定基準を満たしていなければ、それはこの達成方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の達成方法によってその達成基準が満たされていることもありうる。