フォームのコントロールとラベルが関連付けられていません
JIS 5.3 b); WCAG 12.4;
概要 Webページに、コントロールと対応するラベルがlabel要素で関連付けられていないフォームがあります。
修正/チェック方法 ラベルとコントロールの関連付けは、以下の3つのステップで行ってください。 id属性を用いて、コントロールにユニークなIDを割り当てる。 そのコントロールと関連付けたいテキストまたはイメージのラベルをlabel要素でマークアップする。 そのlabel要素にfor属性を付加して、その属性値にコントロールのid属性値と同じ値を記述する。
修正/チェックのポイント ラベル（名称）とコントロールを関連づけ、複数のコントロールを適切にグルーピングすることで、設定すべきコントロールが見つけやすくなります。 また、上肢に障害のある利用者や高齢者の場合、チェックボックスなど表示面積の小さいコントロールを、マウスで選択することは困難です。 ラベルとコントロールを関連づけることで、ラベル部分をクリックし、コントロールを選択することが容易になります。 <label>タグを使用し、ラベルとコントロールを関連づける。 コントロールが多くなる場合は、グループ化する。<fieldset>タグを使って、グループ化し、<legend>タグでグループのタイトルをつければよい。 『富士通ウェブ・アクセシビリティ指針 第2.0版』 © 2004 富士通株式会社
JIS関連項目 5.3 操作及び入力 b) 入力欄を使用するときは，何を入力すればよいかを理解しやすく示し，操作しやすいよう配慮しなければならない。 例5. ラベル（対応するコントロールの名称）とチェックボックスなどのコントロールを関連付けること。ラベル部分をクリックしてもコントロールを選択できるようになる。また，ラベルを適切に記述することで音声ブラウザなどは，各コントロールの意味を利用者に誤らずに伝えることができるようになる。 JIS X 8341-3:2004『高齢者・障害者等配慮設計指針－情報機器における機器，ソフトウェア及びサービス－第三部：ウェブコンテンツ』（© 財団法人 日本規格協会）
解説 フォームをTabキーで操作しているとき、画面を見ているユーザーは、コントロールをすぐ近くにあるラベルと容易に関連付けることができます。しかしながら、スクリーンリーダーのユーザーは、視覚的に判断することができません。どのラベルがどのコントロールと対応しているのかを明示的に関連付けることが必要です。 ベストな方法は、label要素を用いてこの関連付けを行うことです。label要素でラベルとなるテキストをマークアップして、label要素のfor属性値をコントロールのid属性値と同じ値にします。 原則として、1つのラベルは1つのコントロールと関連付けることができますが、2つ以上のラベルを同じコントロールに関連付けることも可能です。ただ、すべてのスクリーンリーダーがサポートしているわけではないので、各コントロールに対して1つのラベルを関連付けることを推奨します。 あるラベルをあるコントロールと暗黙的に関連付けることも可能です。ラベルとなるテキストとコントロールの両方をlabel要素で囲みます。このテクニックは、HTML 4.01の勧告文書（標準仕様）で示されていますが、まだすべてのスクリーンリーダーがサポートしているわけではありません。
JIS X 8341-3について JIS X 8341-3 の内容は、以下のサイトにて規格番号「X8341-3」で検索して、規格票をご覧ください。 閲覧：日本工業標準調査会（JISC） http://www.jisc.go.jp/ 購入：日本規格協会（JSA Web Store） http://www.webstore.jsa.or.jp/