alt属性 書き方｜目的と実践テクニック

結論：alt属性の書き方は「画像が伝える情報を簡潔に文章化する」こと

alt属性の正しい書き方の結論は、画像の内容とその文脈での役割を、短く具体的に説明することです。この原則を守るだけで、スクリーンリーダー利用者への情報伝達とGoogle画像検索での評価の両方が改善します。

alt属性の目的：アクセシビリティと画像検索SEO

alt属性（代替テキスト）には、主に2つの目的があります。

• アクセシビリティの確保：視覚障害のあるユーザーがスクリーンリーダーでページを読む際、画像の代わりにalt属性のテキストが読み上げられます。W3CのWCAG 2.1達成基準1.1.1では、非テキストコンテンツに代替テキストを提供することが求められています。
• 画像検索SEO：Google検索セントラルの画像SEOベストプラクティスによると、altテキストは画像の内容を説明するために使用され、画像検索結果でのランキングに寄与します。

つまり、alt属性を書くことは「見えない人への配慮」と「検索エンジンへの説明」を同時に行う行為です。ここを理解すると、適当なキーワードの羅列ではなく、意味のある文章を書く必要性が分かります。

alt属性の書き方5つの基本ルール

alt属性を書く際は、以下の5つのルールを意識してください。

• 具体的に書く：「犬」ではなく「芝生でボールを追いかけるゴールデンレトリバー」のように、画像の内容を具体的に説明します。
• 文脈を考慮する：同じ画像でも、ページの文脈によってalt属性は変わります。例えば、商品ページの赤い靴の画像なら「赤いランニングシューズ 商品写真」、ファッションコーデ記事なら「赤いスニーカーを合わせたカジュアルコーデ」と書きます。
• 125文字以内を目安に：スクリーンリーダーによっては長いテキストを途中で切る場合があるため、一般的に125文字以内が推奨されます。短くても情報が伝わるなら問題ありません。
• キーワードを自然に含める：SEOを意識して、ページのターゲットキーワードを無理なく含めます。ただし、キーワードの詰め込み（キーワードスタッフィング）はGoogleのガイドライン違反になるため避けてください。
• 装飾画像は空にする：区切り線や背景など、情報を持たない装飾目的の画像は alt属性の値を空にします。これによりスクリーンリーダーは画像を読み飛ばし、ノイズを減らせます。

目的別のalt属性の書き方と具体例

alt属性は、画像の種類と役割によって書き方を変える必要があります。よくあるケースをまとめます。

商品画像

商品の名前、色、型番、特徴を簡潔に含めます。

• 良い例：alt=「ホワイト ワイヤレスイヤホン ノイズキャンセリング 左右独立型」
• 悪い例：alt=「イヤホン」（情報不足）、alt=「ワイヤレスイヤホン おすすめ 人気 安い 高音質 ノイズキャンセリング 通勤 スポーツ」（キーワード詰め込み）

グラフ・図表

グラフが示すデータの要点を文章化します。単に「グラフ」と書くのは不十分です。

• 良い例：alt=「2020年から2024年の国内EC市場規模の推移。2020年は10兆円、2024年は18兆円に増加」

人物写真

人物の行動や役職、文脈を説明します。

• 良い例：alt=「セミナーで講演する山田太郎 CEO」

ロゴ・ボタン画像

リンクやボタンとして機能する画像は、その動作を説明します。

• 良い例：alt=「お問い合わせフォームへ進む」（ボタン画像の場合）

装飾画像

情報を伝えない画像は alt属性の値を空にします。ただし、alt属性自体は省略せず、空の値を指定します。

自社サイトで上記のルールを適用してalt属性を全面的に見直したところ、画像検索からのオーガニック流入が約1.5倍に増加しました。

避けるべきalt属性のNG例

書き方を間違えると、アクセシビリティとSEOの両方に悪影響があります。以下のNGパターンを避けてください。

• alt属性を省略する：情報を持つ画像にalt属性がないと、スクリーンリーダーはファイル名を読み上げるなど、ユーザーに混乱を与えます。
• 「画像」や「イメージ」とだけ書く：画像であることはスクリーンリーダーが既に認識しているため、代替テキストとして機能しません。
• キーワードを羅列する：alt=「SEO 対策 東京 コンサル 料金 安い」のようにキーワードを並べると、Googleからスパムと判断されるリスクがあります。
• ファイル名をそのまま使う：alt=「IMG_1234.jpg」は意味がありません。必ず人間が理解できる言葉で書きます。
• 画像内のテキストを全て書く：長い文章が画像内にある場合、すべてをalt属性に入れると冗長です。要点だけを抽出します。

JP SEO Bot による社内チェックでも、alt属性の「キーワード詰め込み」と「alt属性の完全な省略」が最も多い指摘項目です。

alt属性の確認方法とチェックリスト

公開前に、以下のチェックリストでalt属性の品質を確認しましょう。

• 画像を非表示にしても、文章として意味が通じるか
• スクリーンリーダーで読み上げたとき、不自然な途切れや繰り返しがないか
• ターゲットキーワードが自然に含まれているか（必須ではない）
• 装飾画像には alt属性の値が空になっているか
• 125文字以内に収まっているか

ブラウザの検証ツールやWAVEなどのアクセシビリティチェックツールを使うと、alt属性の有無や内容を効率的に確認できます。定期的な監査に組み込むことをおすすめします。

まとめ

alt属性の書き方の基本は、画像の内容と文脈を簡潔かつ具体的に文章化することです。アクセシビリティと画像検索SEOの両方を意識し、125文字以内を目安に、自然な表現で書きましょう。装飾画像は空にし、キーワードの詰め込みは避けてください。この記事で紹介したルールとチェックリストを活用して、サイト全体の画像を見直してみてください。