画像SEOとalt属性の書き方【2026年版】表示速度とアクセシビリティの両立
画像はページの中で最も容量を占める要素であり、 同時に検索エンジンが内容を読み取れない要素でもあります。
このページでは、alt属性の書き方と 表示速度への影響の両面から、実装レベルで整理します。
alt属性の書き方
altは「画像が表示されないときに、代わりに読まれる文章」です。 スクリーンリーダーの利用者にとっては、その画像の内容を知る唯一の手段になります。
| 画像の種類 | altの書き方 |
|---|---|
| 商品・サービスの写真 | 何が写っているかを具体的に。「商品画像」ではなく製品名と特徴 |
| グラフ・図表 | 読み取れる内容を文章で。「グラフ」ではなく何がどう変化したか |
| 人物写真 | 氏名と役職、状況 |
| スタッフ・店舗 | 場所と何が写っているか |
| ロゴ | 会社名やサービス名 |
| 装飾目的の画像 | alt=""（空）にする。読み上げから除外される |
| リンクになっている画像 | リンク先が分かる文言にする |
当社サイトの実際のalt例です。
悪い例：alt="順位グラフ"
良い例：alt="「歯医者 地域名」の検索順位推移。57位から1位へ上昇し、以降1位を維持している順位計測ツールのグラフ"
画像が表示されなくても、内容が伝わるかを基準にしてください。
altにキーワードを詰め込むのは避けてください。 altは検索エンジンのためではなく、画像を見られない人のための説明です。 不自然な詰め込みはスパムと判断されるおそれがあり、 アクセシビリティの観点でも有害です。
表示速度への影響
画像はCore Web Vitals の LCP に最も影響する要素です。 ページ上部の大きな画像が重いと、それだけで評価が下がります。
実際に変換した結果
当社サイトの画像をWebPに変換したところ、次の結果になりました。
| 画像 | 変換前 | 変換後 | 削減 |
|---|---|---|---|
| 順位計測キャプチャ（6枚） | 734KB | 124KB | -83% |
| OG画像（5枚） | 535KB | 177KB | -67% |
| 合計（11枚） | 1,269KB | 301KB | -76% |
スクリーンショットや図表は、とくに削減率が高くなります。 写真より色数が少ないためです。 実績のキャプチャ画像は6枚で734KB → 124KB（83%削減）になりました。 画質の劣化は、実用上ほとんど分かりません。
実装方法
WebPに完全に置き換えるのではなく、<picture>で切り替えるのが安全です。
対応していない環境では元の画像が使われます。
OG画像はPNGのまま残してください。 og:image はページ訪問者が読み込むものではないため表示速度に影響しません。 一方、SNSのクローラーによってはWebPを正しく扱えないことがあります。 変換する価値があるのは、本文中に表示される画像だけです。
width と height を必ず指定する
画像に幅と高さの指定がないと、読み込み中にレイアウトがずれます。 これが CLS（Cumulative Layout Shift）として評価に影響します。
widthとheightを属性で指定する——CSSで可変にする場合も属性は残す- 実際の画像サイズと一致させる——比率が違うと歪みます
- 本文中の画像には
loading="lazy"を付ける - ページ上部の主要画像には lazy を付けない——LCPが遅くなります
decoding="async"を付ける——描画のブロックを避けられます
4番目は間違えやすい箇所です。 「遅延読み込みは常に良い」と思われがちですが、 ファーストビューの画像にlazyを付けると、かえって表示が遅くなります。 詳しくはCore Web Vitals の改善方法をご覧ください。
ファイル名と配置
| 避ける | 推奨 | |
|---|---|---|
| ファイル名 | IMG_2847.jpg | naiso-koji-before.jpg |
| 文字 | 日本語・スペース | 半角英数とハイフン |
| 長さ | 過度に長い | 内容が分かる範囲で簡潔に |
| 配置 | ページごとにバラバラ | /img/ 配下に整理 |
ファイル名だけで順位が変わることはありませんが、 画像検索での手がかりになり、管理も楽になります。 日本語ファイル名はURLエンコードされて読みにくくなるため避けてください。
AI検索での画像の扱い
Googleは公式ドキュメントで、 生成AI検索機能も関連する画像や動画を取り込むことがあり、 ページのリンク以外でもサイトが表示される機会が増えると説明しています。
そして「すでに画像SEOのベストプラクティスに従っているなら、 それは生成AI検索への最適化にもなっている」と明記されています。 AI向けの特別な対応は不要です。 altを正しく書き、表示速度を保ち、内容に関連する画像を使う—— 従来どおりの実装が、そのままAI検索でも効きます。
ほかの点検項目は内部対策チェックリスト30項目、 表示速度の改善はCore Web Vitals の改善方法をご覧ください。
よくあるご質問
alt属性は必ず書くべきですか？
意味のある画像には必ず書いてください。ただし装飾目的の画像は、alt属性を空にすることで読み上げから除外できます。altは検索エンジンのためではなく、画像を見られない人のための説明である点を基準にしてください。
altにキーワードを入れたほうがよいですか？
自然に必要な範囲で入れるのは問題ありませんが、詰め込みは避けてください。スパムと判断されるおそれがあり、アクセシビリティの観点でも有害です。画像が表示されなくても内容が伝わるか、を基準に書いてください。
WebPに変換すると、どのくらい軽くなりますか？
当社サイトで実際に変換したところ、11枚の合計が1,269KBから301KBへ76%削減されました。とくにスクリーンショットや図表は削減率が高く、順位計測キャプチャ6枚では83%削減しています。画質の劣化は実用上ほとんど分かりません。
画像をすべてWebPに置き換えてよいですか？
picture要素で切り替えるほうが安全です。対応していない環境では元の画像が使われます。またOG画像はページ訪問者が読み込むものではなく表示速度に影響しないため、SNSクローラーの互換性を優先してPNGのまま残すことをおすすめします。
遅延読み込みはすべての画像に付けるべきですか？
いいえ。ページ上部に表示される主要な画像に遅延読み込みを付けると、かえって表示が遅くなりLCPが悪化します。本文中の下部にある画像にだけ付けてください。
画像のファイル名は順位に影響しますか？
ファイル名だけで順位が変わることはありません。ただし画像検索での手がかりになり、管理も楽になります。日本語ファイル名はURLエンコードされて読みにくくなるため、半角英数とハイフンを使ってください。
関連ページ
ご自身のサイトで、同じことを試せます。
同一キーワードは1社限定。空き状況はその場で確認できます。