alt属性とは、通信が不安定であるなど何らかの理由で画像が表示できない時に、代替テキストを指定するために使われるものを表します。
alt属性で設定した代替テキストは、音声ブラウザやスクリーンリーダーによって読み上げられます。
HTMLタグのimg要素には以下のように記述します。
〈img scr=“/img.pngなどの画像のパスを記述します” alt=”画像の代わりとなるテキストを入力します” /〉
そもそもalt属性という用語は「代替テキスト」を意味する「alternative text」に由来していて、「オルト属性」と読みます。
W3C(WEBで利用される技術の標準化をすすめる国際的な非営利団体)には、下記のように定義がされています。
「画像をWEBサイトに掲載する場合は、その画像が何を表しているのかをalt属性に指定すること、また、注意点としては画像の視覚的な特徴までは必要ないが画像と同じ内容を設定する。」
とされています。
このようにalt属性は、非テキストコンテンツの代替テキストのWEBアクセシビリティ対応として、特に高齢者や視覚に障害のある方向けに活用されます。
そして正しく記述することで、コンテンツの情報を適切に伝えることができるだけでなく、検索エンジンのクローラーに画像の情報を伝えてSEO効果をもたらします。
WEBアクセシビリティ対応とSEO対策を両方とも行いたいとお考えの企業は、alt属性で画像の代替テキストを設定するようにしましょう。