フォームのボタンのalt属性が無効です
米国508条 1194.22(a); WAI/ WCAG1.0 チェックポイント 1.1
 
 
概要

フォームのボタンとして使用されているイメージに、有効な代替テキストがありません。

有効な代替テキストは以下のいずれにも該当しないalt属性値です。

  • 空("")である
  • 1つ以上のスペースのみ(" ")である
  • イメージのファイル名である
  • イメージファイルのサイズのみである
  • アルファベット150字以上である (これは推奨でしかありません: WCAG 1.0 や 508条では規定されていません)
 
 
修正方法

以下に挙げる点に留意して、input要素にalt属性を付加してください。

  • 代替テキストでボタンをクリックするとどうなるのかを説明する。
  • alt属性値では(X)HTMLのタグはブラウザに解釈されないので使わないでください。alt属性値に(X)HTMLのタグがあると、ユーザーを困惑させるだけでなく、検索エンジンをも混乱させる恐れがあります。
  • alt属性値の代替テキストが長すぎると、ブラウザが後半部分を省略したり、ページの読み込みに時間がかかったりすることがあります。目安として、英単語で10ワード、アルファベットで64文字以内にしてください。(訳者注:日本語の場合は全角文字なので、半分の32文字以内を目安と考えてください。)

マウスでイメージをクリックすると、フォームとクリック座標がサーバに送信されます。もし、ユーザーがクリックした位置によってサーバが異なるアクションを起こすとしたら、ノングラフィカルなブラウザのユーザーにとっては不便でしょう。このような理由から、以下のような代替手段を考えるべきです。

  • 1つのサブミットボタンではなく、複数のサブミットボタン(別々のイメージ)を使ってください。スタイルシートを用いてボタンの位置を調整することができます。
  • クライアントサイド・イメージマップをスクリプトと一緒に用いてください。
 
 
解説

alt属性値は画像が伝えている情報を説明するもので、画像を表示するブラウザ以外を使用しているユーザーがWebページを利用することを可能にします。ハンドヘルド端末やテキストブラウザなどの登場により、alt属性値の代替テキストの重要性はこれまで以上に高まっています。

もし、ボタンのイメージに代替テキストがなければ、ノングラフィカルなブラウザのユーザーは、そのボタンをクリックするとどうなるのかが分からないでしょう。

もう一つ問題が起こる可能性があることに注意してください。

マウスでイメージをクリックすると、フォームとクリック座標がサーバに送信されます。

もし、ユーザーがクリックした位置によってサーバが異なるアクションを起こすとしたら、ノングラフィカルなブラウザのユーザーにとっては不便でしょう。このような理由から、以下のような代替手段を考えるべきです。

  • 1つのサブミットボタンではなく、複数のサブミットボタン(別々のイメージ)を使ってください。スタイルシートを用いてボタンの位置を調整することができます。
  • クライアントサイド・イメージマップをスクリプトと一緒に用いてください。