TIL

Today I Learned. 知ったこと、学んだことを書いていく

aria-labelについて - HTML

ウェブアクセンシビリティを意識したWebアプリを作るときに使う!

アクセシビリティとは、特にWebサイト上における、情報やサービスへのアクセスのしやすさのことである。
アクセシビリティは、高齢者や障害者なども含めたあらゆる人が、どのような環境(うるさい場所や、暗い場所、逆に明るい場所など)においても柔軟にWebサイトを利用できるように構築することを考慮する場合に使われる。

アクセシビリティとは - IT用語辞典 Weblio辞書

アクセンシビリティとは「誰でも使える同じように使える」って意味かな?
これはすごい大事らしい!!imgタグにalt属性つけるとか

aria-labelはいつ使うの?

aria-label属性は画像や文字に情報を付けたいときとかに使う

文字列を表示する必要が無いケース、例えばアイコンのようなビジュアルで目的を表現する要素に対して指定を行います。

aria-label属性 | WAI-ARIA - HTMLリファレンス

アイコンフォントを表わす HTML 要素の中に「aria-label= "xxx" (xxx は具体的な自然言語によるラベル)」を記述することで、スクリーンリーダーが認識して読み上げてくれるラベルを付与することができます。

アイコンフォントのアクセシビリティ向上 — Website Usability Info

目の不自由な方のためのスクリーンリーダーというものが読み上げられるようになる

参考文献