適用 (対象)
Accessible Rich Internet Applications (WAI-ARIA) をサポートするウェブコンテンツ技術。
これは達成基準 1.1.1: 非テキストコンテンツ (十分) に関する達成方法である。
解説
この達成方法の目的は、短いテキストによる代替がオブジェクトで提供される機能や情報を適切に伝達しない場合に、画像の説明を提供することである。
WAI-ARIA には、aria-describedby
プロパティを使用して、セクション、描画、フォーム要素、画像などと説明テキストを関連付けできる機能がある。これは、利用者が複雑な画像を理解するのを助ける追加情報を提供するのに両者が有用であるという点において longdesc
属性に似ている。longdesc
のように、aria-describedby
を使用して提供される説明テキストは、HTML で alt
属性を使用して提供される短い名前とは別のものである。longdesc
と異なり、aria-describedby
は画像を含むページの外の記述を参照できない。画像と同じページのコンテンツを使用して長い説明を提供する利点は、支援技術を持たない、目の見える人を含め、その代替が誰でも利用できることである。執筆時点 (2013 年 10 月) で、一部の支援技術が利用者の操作なしに画像の alt 属性情報の直後に aria-describedby
の内容を読みあげることは注目に値する――これは、longdesc
属性のほとんどの実装が、追加の説明を読むために利用者の明示的な操作を必要とすることとは対照的である。
aria-labelledby
のように、aria-describedby
は、スペース区切りのリストを使用してページの他の領域を指すための複数の ID を受け入れることができる。この集合を定義するものは ID に限定されている。
事例
例 1: 画像を説明する
次の例は、テキストの説明が画像と同じページ上にある場所で、長い説明を提供するためにどのように aria-describedby
が画像に適用されるかを示す。
<img src="ladymacbeth.jpg" alt="Lady MacBeth" aria-describedby="p1"> <p id="p1">This painting dates back to 1730 and is oil on canvas. It was created by Jean-Guy Millome, and represents ...</p>
参考リソース
この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
検証
手順
aria-describedby
属性が存在する各画像要素を調べる。- その
aria-describedby
属性が、その説明として用いられるテキストを含む要素のid
を介して、要素とテキストの説明とをプログラム的に関連付けているかどうかを調べる。 - 結合された同等のテキスト及び関連付けられたテキストの説明が、オブジェクトに同等の目的を正確に説明する又は提供していることを調べる。
期待される結果
- #1、#2, 及び #3 が真である。