area-alt-present

<area>はアクセシブルな名前を持つ必要があります

automaticWCAG 1.1.1 (A)確度：high重大度：seriousperceivable

<area>要素が、alt、aria-label/aria-labelledby、またはtitleによる空でないアクセシブルな名前を持つことを確認します。

適用範囲：次の条件をすべて満たす<area>要素に適用されます。1) <img usemap>から参照される<map>内にある（照合はHTMLの方式に従い、「#」とマップのidまたはnameで、大文字と小文字を区別します）。2) 空でないhrefを持つ（hrefのない<area>はHTML仕様上そもそもハイパーリンクではなく、このルールが名前を求める対象がない）。3) 参照元の<img>が実際にレンダリングされている（hidden/display:none/visibilityでは除外されるが、<area>は<img>のDOM上の子孫ではないため、aria-hiddenでは除外されない）。4) <area>自体がアクセシビリティツリーの対象となる。<area>やその<map>に指定されたhidden、display:none、inertでは除外されません。どちらの要素もボックスを生成しないため、実際のブラウザーのイメージマップのヒットテストではこの3つはいずれも無視されます（ChromiumとFirefoxで確認済み）。除外されるのは、<img>と<map>の組み合わせ全体を含む本当の祖先要素にこれらが指定された場合だけです。

期待される結果：適用対象の各<area>要素が、alt、aria-label/aria-labelledby、またはtitleによる空でないアクセシブルな名前を持っています。使用中のマップ内の<area>は常にリンクなので、<img>の場合と違ってalt=""は装飾を意味しません。ほかの仕組みで名前が付けられていない限り、空のaltはaltがない場合と同じく失敗になります。

例

pass

<img src="image.png" alt="" usemap="#nav">
<map name="nav">
  <area href="/x" shape="rect" coords="0,0,40,24" alt="Go to green">
</map>

<area>は使用中のマップ内のリンクで、空でないaltを持っています。

fail

<img src="image.png" alt="" usemap="#nav">
<map name="nav">
  <area href="/x" shape="rect" coords="0,0,40,24">
</map>

<area>は使用中のマップ内のリンク（hrefあり）ですが、altがありません。