【注意】この文書にはより新しいバージョンが存在します: WCAG 2.1 達成方法集
area
要素にテキストによる代替を提供するこの達成方法 (参考) の使用法と、この達成方法が WCAG 2.0 達成基準 (規定) とどのように関係するのかに関する重要な情報については、WCAG 達成基準の達成方法を理解するを参照のこと。適用 (対象) のセクションは、その達成方法の範囲について説明しており、特定の技術に関する達成方法の存在は、その技術があらゆる状況で WCAG 2.0 を満たすコンテンツを作成するために使用できることを意味するものではない。
area
要素を含む HTML 及び XHTML ドキュメント
これは、次の達成基準に関連する達成方法である:
H24 に関するユーザエージェントサポートノートを参照のこと。
この達成方法の目的は、イメージマップ上の選択可能領域と同じ役割を果たすテキストによる代替を提供することである。イメージマップは、area
要素によって定義された選択可能領域によって分割されている 1 枚の画像である。各領域は、他のウェブページや、現在のウェブページ内の他の場所へのリンクである。各 area
要素の alt
属性は、その画像の選択可能領域と同じ目的を果たすものである。
訳注: WAIC では H24 に関するアクセシビリティ・サポーテッド(AS)情報を提供している。
2014 年 6 月版のアクセシビリティ・サポーテッド(AS)情報: H24 では、「達成可能」と評価されている。WAIC はこの達成方法が検証した環境で広く動作すると判断している。
訳注: WAIC では H24 に関するアクセシビリティ サポーテッド(AS)情報を提供している。
2020 年 3 月版の アクセシビリティ サポーテッド(AS)情報: H24 も参照されたい。
この事例では、イメージマップ上の各領域の目的を示したテキストを提供するのに、area
要素の alt
属性を利用している。
コード例:
<img src="welcome.gif" usemap="#map1"
alt="Areas in the library. Select an area for
more information on that area." />
<map id="map1" name="map1">
<area shape="rect" coords="0,0,30,30"
href="reference.html" alt="Reference" />
<area shape="rect" coords="34,34,100,100"
href="media.html" alt="Audio visual lab" />
</map>
この参考リソースは、あくまでも情報提供のみが目的であり、推薦などを意味するものではない。
訳注: HTML 4.01 は Superseded Recommendation としてマークされ、廃止された仕様である。上記はそれぞれ、HTML 5.1§4.7.17. Image maps 及び HTML 5.1§4.7.5.1. Requirements for providing text to act as an alternative for images を代わりに参照できる。
イメージマップ上の各 area
要素について:
その area
要素に alt
属性があることを確認する。
alt
属性で指定したテキストによる代替が、イメージマップの area
要素で参照されるイメージマップ画像の一部と同じ目的を果たしていることを確認する。
上記全ての結果が真である。
この達成方法が「十分な達成方法」の一つである場合、この手順や期待される結果を満たしていなければ、それはこの達成方法が正しく用いられていないことを意味するが、必ずしも達成基準を満たしていないことにはならない。場合によっては、別の達成方法によってその達成基準が満たされていることもありうる。