知っていると便利なaria-label属性の使い方 – ofujimiki.jp

WAI-ARIAといえば、ランドマークなどのロール（role属性）が話題になることが多いようですが、aria-*属性の方にも便利な（アクセシビリティ対応がスマートに簡潔なコードで行える）機能はたくさんあります。本日は、その中でも特に有用性の高いaria-label属性を紹介します。 まずは、aria-label属性の解説を『わかりやすい「WAI-ARIA 1.0」仕様解説書』から抜粋して掲載します（部分的に簡略化・補足しています）。aria-label属性はグローバルな属性ですので、HTML5の文書であればどの要素にでも指定可能です。 aria-label属性 要素のラベルにする文字列を属性値として指定する属性です。 この属性で指定したラベルは画面上には表示されません。この属性は、画面には表示させずに支援技術に対してのみラベルを設定しておきたい場合に利用できます（この属性で指定したラベルは

[kikiki-kiki]

aria-label

[blue_night_blue]

フーン感ハンパねえ

[reboot_in]

“たとえば次のように指定しておくことで、支援技術のユーザーは複数のナビゲーションを区別できるようになります。”