送信ボタンとして用いる画像の alt 属性を使用する

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

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

適用 (対象)

画像の送信/実行ボタンを使用するコンテンツに適用する。

これはSuccess Criterion 1.1.1: 非テキストコンテンツ (十分) に関する達成方法である。

解説

この達成方法の目的は、type 属性が 'image' である input 要素において、input 要素の alt 属性を機能的なラベルを提供するのに使用することである。このラベルは、画像の説明をするのではなく、ボタンの機能を説明する。もしそのページに、それぞれ異なる結果につながる複数の送信/実行ボタンがあるならば、ラベルは特に重要である。

input 要素は、多くの種類のフォームのコントロールを作成するのに使用される。HTML 及び XHTML の DTD では、これら全てで alt 属性を用いることができるが、本来は画像の送信/実行ボタンだけに使用すべきである。ユーザエージェントでは、他の種類のフォームのコントロールでの alt 属性の使用をサポートしていないため、これらのコントロールをラベル付けするために他のメカニズムを用いている。

訳注

WAIC では H36 に関するアクセシビリティ・サポーテッド（AS）情報を提供している。2014 年 6 月版のアクセシビリティ・サポーテッド（AS）情報: H36 では、「達成可能」と評価されている。WAIC はこの達成方法が検証した環境で広く動作すると判断している。

訳注

WAIC では H36 に関するアクセシビリティ サポーテッド（AS）情報を提供している。2020 年 3 月版の アクセシビリティ サポーテッド（AS）情報: H36 も参照されたい。

事例

例 1

alt 属性がある input 要素 

<form action="http://example.com/prog/text-read" method="post">
  <input type="image" name="submit" src="button.gif" alt="Submit" />
</form>

検証

手順

  1. type 属性の値が "image" であるすべての input 要素に、alt 属性があることを確認する。
  2. その alt 属性がボタンの機能を説明していることを確認する。

期待される結果

  • #1 及び #2 の結果が真である。