短.bealt テキスト (代替テキスト、Alternative Text) とは、HTML の img 要素に設定する alt 属性の値で、画像の内容をテキストで説明するものです。画像が読み込めない場合に代わりに表示されるほか、スクリーンリーダー (視覚障害者向けの読み上げソフト) が画像の内容をユーザーに伝える際に使用されます。
alt テキストは Web アクセシビリティの基本要件です。WCAG (Web Content Accessibility Guidelines) 2.1 の達成基準 1.1.1 (レベル A) では、利用者に提示されるすべての非テキストコンテンツに、同等の目的を果たすテキストによる代替を提供することが求められています。この達成基準は後継の 2.2 でも変更されていません。alt テキストのない画像は、スクリーンリーダーのユーザーにとって「何があるか分からない空白」になります。
SEO の観点でも alt テキストは重要です。Google は画像検索の公式ドキュメントで、alt テキストとページの内容、画像認識のアルゴリズムを組み合わせて画像に何が写っているかを判断すると説明しています。画像をリンクにした場合、alt テキストはアンカーテキストとしても扱われます。適切な alt テキストは画像検索からの流入につながりますが、alt テキストだけで表示順が決まるわけではありません。
短縮 URL サービスとの関連では、OGP 画像に添える説明が該当します。Open Graph protocol は og:image を指定するなら og:image:alt も指定すべきとしており、その値は画像に何が写っているかの説明 (キャプションではない) と定義されています。SNS でリンクを共有したときのサムネイルに説明を付けておけば、画像が表示されない環境の利用者にも内容が伝わります。QR コードの画像には「○○へのリンクの QR コード」のように、読み取った先が何かを書きます。URL の文字列をそのまま alt に入れると、読み上げでは記号の羅列になって内容が伝わりません。
良い alt テキストの書き方は、画像の内容を簡潔かつ具体的に説明することです。「画像」「写真」といった冗長な表現は避け、画像が伝えている情報を直接記述します。装飾目的の画像には空の alt 属性 (alt="") を設定し、スクリーンリーダーに読み飛ばさせます。