WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

F34: 達成基準 1.3.1 及び 達成基準 1.3.2 の失敗例 - プレーン・テキストのコンテンツで、テーブルをフォーマットするために、スペースを使用している

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

これらの達成方法(参考)の使用法及び、それらがWCAG 2.0 達成基準(規定)とどのように関係するかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用(対象)セクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法があるからといって、WCAG 2.0 を満たすコンテンツを作成する際に、常にその技術が使用可能であるわけではない。

適用(対象)

全てのウェブコンテンツ技術。

これは、次の達成基準に関連する失敗例である:

解説

この達成方法の目的は、テキストコンテンツ内でスペース、タブ、改行又はキャリッジリターン(CR)といった空白文字を使用してテーブルを整形すると、適切に構造を示すことができない失敗例について述べることである。 テーブルがこのような方法で作成されると、セルを見出しセルとして示すことができなくなり、見出しのセルとデータのセルを関連付けできなくなる。又はテーブルの中のセルへ直接誘導することができなくなる。

さらに、支援技術は現在の自然言語の音声読み上げ順序でコンテンツを解釈していく。視覚的なテーブルにおいて、データをレイアウトするために空白を使用すると、ドキュメントのソースの情報を自然な音声読み上げ順序で提供できなくなってしまう。このように、支援技術の利用者に対して情報が論理的な音声読み上げ順序で提示されなくなる。

プレーンテキストはテーブルのような複雑な情報を表示するのには適していない。なぜなら、テーブルの構造は知覚できないからである。テーブルの情報は見た目の書式を整える方法によって表形式の情報の関係を表現するよりは、別のウェブコンテンツ技術を使用するか又は直線的に読上げられるように提示する(プレーンテキストでテーブルの情報を表現するを参照)。

事例

失敗例 1

次の事例では、空白を不適切に使ってメニューを見かけ上のテーブル形式にしている。

コード例:


メニュー
     朝食        昼食       ディナー

月曜   目玉焼き2つ     トマトスープ   ガーデンサラダ
     ベーコン      ハンバーガー   フライドチキン
     トースト      オニオンリング  緑豆
     オートミール    マッシュポテト

火曜   ホットケーキ    野菜スープ    シーザーサラダ
     ソーセージ     ホットドッグ   ミートボールスパゲティ
     オレンジジュース  ポテトサラダ   イタリアンブレッド
               ブラウニー    アイスクリーム

この表は、スクリーンリーダでは次のように解釈され、読上げられる。

  • メニュー

  • 朝食 昼食 ディナー

  • 月曜 目玉焼き2つ トマトスープ ガーデンサラダ

  • ベーコン ハンバーガー フライドチキン

  • トースト オニオンリング 緑豆

  • オートミール クッキー マッシュポテト

このテーブルには、支援技術がこのメニューをテーブルとして特定するための構造がないため、この音声読み上げ順序では意味が伝わらない。テキストが折り返す、又は固定フォントから可変フォントに変更になる、又はページ内で行が収まらないほど文字サイズを拡大するといった場合、視覚表現で同様の問題が発生すると考えられる。

参考リソース

この達成方法に関する参考リソースはない。

検証

チェックポイント

  1. 見かけ上のテーブルがドキュメントにある。

  2. 空白文字を使ってデータをテーブル形式にレイアウトしてテーブルが作られている。

判定基準