便利だけど使われていないLABEL
例えばGoogleで日本語のページを検索
のラジオボタンを選択しようとする際、どの辺をクリックして選択していますか？
←ここですか？
←ここですか？
ブラウザにも依りますが、大抵のブラウザでは日本語のページを検索
の文字列部分をクリックしてもラジオボタンが選択されます。この動作は通常のアプリケーション*1では当たり前なのですが、Web(というかHTML)ではそのようにはなっていなかったのです。
しかし、HTML4.0*2からlabelという要素が追加され、ラジオボタンやチェックボックス等にラベルを設定することができるようになりました。
W3Cのドキュメントによるとlabel要素は
- ラベルの内容をクリックすると関連付けられたform部品にフォーカスが行く(選択される)
- 音声読み上げブラウザ等でもラベルの内容がform部品と関連付けられるかもしれない
といった機能を持っていて、クリックできる場所が広くなる事で、特にマウスの扱いに慣れないユーザでも選択しやすくなる効果や、音声読み上げブラウザを使用している場合でもラジオボタンの選択がしやすくなるといった効果が期待できます。
そんなlabelですが、HTML4.0の勧告から8年近く経った今でもあまり使われていません。主要ポータルと呼ばれている所を何箇所か見ても、まったく使われていなかったり、所により一部使われていたりといった具合です。
ユーザビリティを向上させる手段としては前回のsubmitボタンを無効化させる方法に対して問題が起きる心配も無く、ユーザにとっては良い事ばかりに見えるのですが、不思議と普及していないのです。
さて、その理由はなぜかという点については思い当たる節があるのですが、それはまた後日。
