【注意】この文書にはより新しいバージョンが存在します: WCAG 2.1 達成方法集

WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

F65: 達成基準 1.1.1 の失敗例 - img 要素、area 要素、及び type "image"input 要素の alt 属性又はテキストによる代替を省略している

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

この達成方法 (参考) の使用法と、この達成方法が WCAG 2.0 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.0 を満たすコンテンツを作成するために使用できることを意味するものではない。

適用 (対象)

HTML 及び XHTML

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

解説

この文章では、画像のテキストによる代替の失敗条件を示す。画像の代替を提供するテキストがない場合、支援技術は画像を識別することも、その目的を利用者に伝えることもできない。 alt 属性は画像の代替テキストを提供するための好ましい実装方法であり続ける。アクセシビリティ サポーテッドである限り、適切な WAI-ARIA 属性を使用して代替テキストを提供することができる。アクセシビリティ サポートの詳細については、 アクセシビリティ サポートを文書化するを参照する。アクセシブル リッチ インターネット アプリケーション (WAI-ARIA) 1.0 仕様書は、要素の HTML および WAI-ARIA 属性からテキストによる代替を計算するための代替テキスト計算について説明している。

いくつかの支援技術は、画像のファイル名を読み取ることにより、欠落しているテキストによる代替を補うことを試みる。しかし、多くの理由からファイル名に単純に頼るのは不十分である。例えば、ファイル名は説明的ではない場合があり (例 images/nav01.gif)、技術仕様には説明的なファイル名は必須ではない。そして多くの支援技術は HTML 属性を介して提供されるテキストによる代替がない場合はファイル名を読み取らない。

事例

失敗例 1: テキストによる代替が存在しない

以下のコード例において、スクリーンリーダーを使っている人は画像の目的を知ることはできない。

コード例:


    <img src="../images/animal.jpg" />

参考リソース

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

検証

手順

imgarea 及び type "image" の input を特定する。これらの要素のそれぞれについて:

  1. alt 属性が存在するかどうかを確認する。

  2. aria-labelledby 属性が存在するかどうかを確認し、かつページ内の一つ以上の id 要素を参照し、かつ aria-labelledbyアクセシビリティ サポーテッドかどうかを確認する。

  3. aria-label 属性が存在するかどうかを確認し、かつ aria-labelアクセシビリティ サポーテッドかどうかを確認する。

  4. title 属性が存在するかどうかを確認し、かつ titleアクセシビリティ サポーテッドかどうかを確認する。

期待される結果