WCAG 2.0 達成方法集

Skip to Content (Press Enter)

-

F89: 達成基準 2.4.4、達成基準 2.4.9、及び 達成基準 4.1.2 の失敗例 - リンクで唯一のコンテンツである画像にアクセシブルな名前 (accessible name) が提供されていない

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

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

適用 (対象)

リンクを提供するコンテンツ

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

ユーザエージェント及び支援技術によるサポート

F89 に関するユーザエージェントサポートノートを参照のこと。

解説

この文書は、画像のような非テキストコンテンツのみで提供されているリンクについて、そしてそのリンクがアクセシブルな名前で特定できないときに起こる失敗例について述べている。リンクのアクセシブルな名前 (name) は Accessible Name Calculation によって決定される。

これはテキスト及び画像が同じリンク先に別々にリンクしている場合にも適合する。このケースでは、実装方法 H2: 同じリソースに対して隣接する画像とテキストリンクを結合する (HTML) は別々のリンク及び望ましくない冗長性を減少させるのに推奨される方法である。

事例

失敗例 1: HTML 検索結果

検索サイトは、試合のサイトへのテキストリンク及びイメージリンクの両方を含んだ検索結果を返す。 検索結果には既にテキストリンクがあるため、画像の alt 属性は空になっている。 しかし、スクリーンリーダーは画像リンクを無視しないで、リンクの目的が説明されていそうなテキストを見つけるための推測に基づいた修復を試みる。 例えば、スクリーンリーダーは「フットボール ドット ジフ フットボール スコアカード」と読み上げるかもしれない。

コード例:


<a href="scores.html">
   <img src="football.gif" alt="" />
 </a>
 <a href="scores.html">
   フットボールのスコアボード
 </a>
}

参考リソース

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

検証

手順

  1. リンクが非テキストコンテンツのみを提供している。

  2. 非テキストコンテンツが支援技術により無視される方法、role="presentation" や空の alt 属性で実装されている。

  3. aria-labelaria-labelledby のようなほかの方法でアクセシブルな名前 (name) を持たないリンクをチェックする

期待される結果