alt属性

更新日: 2024年2月20日

alt属性とは

alt属性はHTMLのimg要素やinput要素で使用され、画像や写真が表示されない場合に表示する代替テキストを指定するための属性です。
altは”alternative”の略で、「代替テキスト」や「altタグ」「altテキスト」とも呼ばれます。
この属性は、画像の内容をテキストで説明し、画像が表示されない時にその役割を果たします。

alt属性の効果

alt属性を適切に設定することによる効果は以下の通りです。

1. アクセシビリティの向上
   画像が表示されない時、または視覚障害を持つユーザーがスクリーンリーダーを使用している場合に、画像の内容をテキストで伝えることができます。
2. SEOの強化
   検索エンジンは画像の内容を直接解析することができませんが、alt属性のテキストを通じて画像の内容を理解し、ウェブサイトの検索ランキングを改善することが可能です。

alt属性の正しい使用方法

alt属性の設定はHTMLソースコードで行われます。適切なalt属性の設定例は以下の通りです。

<img src="image.jpg" alt="画像で何が表現されているか説明文を記載する">

この例では、imgタグにalt属性を追加し、画像の内容を簡潔に説明しています。
画像の内容に即したキーワードを用い、適切な長さのテキストで記述することが重要です。
画像が伝えるべきメッセージを正確に記載することで、ウェブサイトのアクセシビリティとSEO効果を高めることができます。