Webアクセシビリティ勉強会

labelタグによるinput要素との紐づけ

labelタグの有無によるラジオボタンの操作性の違いを確認してみてください。

labelタグを使ったチェックボックス


labelタグを用いると、ラベルのテキストを押せばチェックボックスを操作できます。input要素(今回におけるチェックボックス)とラベルのテキストが視覚的・プログラム的に関連付けられていることが実感できます。

inputタグのみで実装されたチェックボックス

みかんジュース
りんごジュース

labelタグがないと、ラベルのテキストを押してもinput要素が反応しません。