画像SEO対策の完全ガイド｜alt・ファイル名・圧縮(WebP)・画像検索で流入を増やす

先に結論です。
画像SEO対策の要点は、alt属性・ファイル名・圧縮(WebP)・適切なサイズ・遅延読み込み(lazy)の5つを、制作段階からセットで実装すること。
これらは「見た目をきれいにする」ためではなく、検索エンジンに画像の内容を正しく伝え、ページの表示速度を保ち、Google画像検索やAI検索からの流入を増やすための土台です。
難しい専門知識は不要で、順番に押さえれば中小事業者やWeb担当者でも今日から取り組めます。
この記事では、良い例・悪い例を交えて実装レベルで整理します。

画像SEOとは何か｜なぜ今あらためて重要なのか

画像SEOとは、サイト内の画像を検索エンジンとユーザーの双方に最適化する取り組みの総称です。
テキストと違い、画像そのものの中身は検索エンジンには読み取りにくいため、alt属性やファイル名、周辺のテキストといった「手がかり」を整えて内容を伝えます。

重要度が上がっている理由は3つあります。
1つ目は、画像がページの表示速度に直結し、その速度がユーザー体験と検索評価の両方に影響すること。
2つ目は、Google画像検索が独立した集客チャネルとして機能すること。
3つ目は、生成AIによる検索(AI検索)が普及し、構造化された分かりやすい情報が引用されやすくなっていることです。

逆に言えば、画像を「とりあえず貼っただけ」の状態は、表示速度の低下・機会損失・アクセシビリティ低下を同時に招きます。
画像SEO対策は地味ですが、費用対効果の高い施策です。

alt属性の書き方｜良い例と悪い例

alt属性(代替テキスト)は、画像が表示できないときに代わりに読まれるテキストであり、スクリーンリーダー利用者にも読み上げられます。
検索エンジンにとっても画像の内容を理解する重要な手がかりです。
alt属性は画像SEOの中核と言ってよいでしょう。

基本の考え方

altは「その画像を見られない人に、内容を言葉で説明する」つもりで書きます。
装飾目的のアイコンや区切り線など、内容に意味を持たない画像は、あえて空(alt=””)にして読み上げをスキップさせるのが適切です。

良い例・悪い例

• 悪い例：alt=”画像”／alt=”IMG_1234″／alt=””(内容のある写真なのに空)
• やりすぎ例：alt=”相模原 ホームページ制作 格安 集客 SEO 対策 おすすめ”(キーワードの詰め込み)
• 良い例：alt=”木製ダイニングテーブルに並んだ焼きたてのクロワッサンとカフェラテ”
• 良い例：alt=”相模原市の美容室の外観、白い壁とガラス張りの入口”

ポイントは、画像に写っている事実を簡潔に描写し、文脈に沿った自然な日本語にすること。
キーワードを不自然に並べる行為は逆効果になり得ます。
SEO全体の考え方はcantikのSEO対策のページでも整理しています。

ファイル名のつけ方｜英数字で内容が分かる名前に

画像のファイル名も、検索エンジンが内容を推測する手がかりになります。
カメラやスマホが自動で付ける「IMG_0001.jpg」のような名前は情報量がゼロなので、内容が分かる名前に変えましょう。

ファイル名の基本ルール

• 内容が分かる英数字を使う(日本語ファイル名は文字化けやURLの複雑化を招きやすい)
• 単語の区切りはハイフン(-)を使う(アンダースコアより推奨)
• 全て小文字にそろえ、記号やスペースは避ける

良い例・悪い例

• 悪い例：IMG_1234.jpg／スクリーンショット 2026-07-04.png／photo1.jpg
• 良い例：croissant-cafe-latte.webp／sagamihara-beauty-salon-entrance.webp

ファイル名だけで順位が大きく動くわけではありませんが、alt・周辺テキストと合わせて一貫性を持たせると、画像の主題が伝わりやすくなります。
「画像 ファイル名 seo」で悩んだら、まずは「人間が見て内容を推測できる名前か」を基準にしてください。

画像の圧縮とWebP｜軽くして表示速度を守る

画像圧縮は、画像SEOで最も体感効果が大きい施策の一つです。
高解像度の写真をそのまま載せると1枚で数MBになることもあり、ページの読み込みを重くします。
「画像 圧縮 seo」が検索される背景には、この速度問題があります。

まずWebPを検討する

WebPは、従来のJPEGやPNGと比べて、同等の見た目でファイルサイズを小さくしやすい画像フォーマットです。
写真もイラストも扱え、主要ブラウザで広く表示できます。
制作段階でWebPを標準にしておくと、後からの手戻りが減ります。

圧縮の実務ポイント

• 写真はWebP(またはJPEG)、ロゴやアイコンなど線が主体の画像はWebPやPNG、可能ならSVGを使い分ける
• アップロード前に、表示に必要な解像度まで縮小してから圧縮する(元データのまま貼らない)
• 圧縮率は「見た目が破綻しない範囲で最小サイズ」を目安に調整する

cantikでは、ホームページ制作の段階でWebP化・圧縮を標準実装し、公開後に画像が原因で重くなりにくい状態を整えています。
制作の考え方はホームページ制作のページをご覧ください。

適切なサイズと表示速度｜Core Web Vitalsを意識する

「軽くする」ことと並んで大切なのが、「必要な大きさで出す」ことです。
画面に小さく表示する画像に巨大な原寸データを使うのは、通信量の無駄であり速度低下の原因になります。

width・heightの指定でレイアウトのガタつきを防ぐ

画像にwidth属性とheight属性(または縦横比)を指定しておくと、読み込み前にブラウザが表示領域を確保でき、後から画像が入り込んでレイアウトがずれる現象を抑えられます。
これはCore Web Vitalsの指標の一つである視覚的な安定性(CLS)の改善につながります。
cantikは制作時に寸法指定を標準で行っています。

Core Web Vitalsと画像の関係

Core Web Vitalsは、表示速度・操作への反応・視覚的安定性といったユーザー体験の指標群です。
中でも大きな画像は「主要な要素が表示されるまでの時間(LCP)」に影響しやすく、ファーストビューの画像最適化は体験改善の近道になります。
ここまで来ると個別ページの技術対応が絡むため、自社サイトの状態を把握したい場合は無料Web集客診断で現状を確認するのがおすすめです。

遅延読み込み(lazy)とレスポンシブ画像

表示速度をさらに底上げする実装が、遅延読み込みとレスポンシブ画像です。
どちらも一度仕組みを入れれば、以降の運用が楽になります。

遅延読み込み(lazy loading)

遅延読み込みは、画面に入りそうになってから画像を読み込む仕組みです。
多くのモダンブラウザは、画像タグにloading=”lazy”を付けるだけで対応できます。
初期表示の負荷が下がり、体感速度が改善しやすくなります。
ただし、ファーストビュー上部の主要画像には遅延を付けず、すぐ表示させるのがコツです。
cantikは制作時に遅延読み込みを標準実装しています。

レスポンシブ画像(srcset・sizes)

レスポンシブ画像は、閲覧端末の画面幅に応じて最適なサイズの画像を出し分ける仕組みです。
srcsetで複数サイズを用意し、sizesで表示幅の目安を伝えると、スマホには小さめ、大画面には大きめの画像を配信できます。
これにより、モバイルでの無駄な通信を減らしつつ、大画面でも粗く見えない状態を保てます。

画像の構造化データと画像検索・AI検索での見え方

ここまでで土台は整います。
仕上げとして、構造化データと各チャネルでの見え方を押さえておきましょう。

構造化データ(schema)で画像を関連づける

商品・レシピ・記事などのページでは、構造化データ(JSON-LDなど)に画像のURLを含めておくと、検索エンジンがその画像とコンテンツの関係を理解しやすくなります。
適切なマークアップは、検索結果でのリッチな表示の前提条件になり得ます。

Google画像検索での流入

画像検索から人を呼ぶには、これまで挙げた要素の総合力が効きます。
すなわち、内容を表すalt・ファイル名、軽く高品質な画像、そして画像の近くにある本文テキストの一致です。
画像とその説明文が噛み合っているページは、画像検索経由でも見つけられやすくなります。

AI検索(AIO)での見え方

生成AIによる検索では、構造化され、代替テキストや周辺文脈が整理されたページの情報が引用・参照されやすい傾向があります。
画像に意味のある説明が付いていること自体が、AIに内容を伝える助けになります。
cantikはMEO・SEO・AIOを一体で設計しており、その考え方はAIO対策のページで紹介しています。

中小事業者が今日から始める画像SEOチェックリスト

最後に、優先度の高い順に実務チェックリストをまとめます。
まずは主要ページのファーストビューから着手すると効果を実感しやすいです。

• 内容のある画像すべてに、文脈に合ったalt属性を書く(装飾画像は空に)
• ファイル名を、内容が分かる英数字・ハイフン区切りに変える
• 写真をWebP化し、表示サイズまで縮小してから圧縮する
• 画像タグにwidth・height(縦横比)を指定する
• ファーストビュー以外の画像にloading=”lazy”を付ける
• 端末差が大きいページでsrcset・sizesを用意する
• 商品・記事ページで構造化データに画像URLを含める

これらは一度に完璧を目指す必要はなく、アクセスの多いページから順に整えていけば十分です。
新しくホームページやLPを作る段階であれば、最初からこの状態で組み込んでおくのが結果的に最も効率的です。
cantikはこうした画像最適化(WebP化・alt・寸法指定・遅延読み込み)を制作段階で標準実装し、初期費用0円・月額19,800円〜のサブスク型で提供しています(制作・支援実績400件超・相模原拠点/全国オンライン対応)。

よくある質問(FAQ)

Q1. alt属性はすべての画像に書くべきですか？

内容に意味のある画像には、文脈に合った説明を書くのが基本です。
一方で、区切り線や装飾アイコンのように内容を持たない画像は、alt=””(空)にして読み上げをスキップさせるのが適切です。
目的は「見られない人にも内容が伝わる状態」を作ることなので、キーワードの詰め込みは避けてください。

Q2. 画像はWebPにすればそれだけで速くなりますか？

WebP化はファイルサイズを抑えやすい有効な手段ですが、それ単体で全てが解決するわけではありません。
表示サイズまでの縮小、遅延読み込み、寸法指定、レスポンシブ配信などを組み合わせて、はじめて表示速度の改善につながります。
画像は「フォーマット・サイズ・読み込み方」をセットで考えるのがおすすめです。

Q3. 既存サイトの画像を後から最適化することはできますか？

できます。
まずはアクセスの多いページや、ファーストビューの大きな画像から着手すると効果を実感しやすいです。
どこから直すべきか判断が難しい場合は、現状の把握から始めるとスムーズです。

自社サイトの画像やページの状態を確認したい方は、無料Web集客診断をご利用ください。
画像SEOを含めた改善の優先順位を整理できます。
具体的な制作・改修のご相談はお問い合わせページから受け付けています。
cantikは画像最適化を制作段階から標準実装し、MEO・SEO・AIOを一体で設計するWeb制作・集客支援を行っています。
まずは気軽にご相談ください。

▶ 関連サービス：SEO対策・コンテンツマーケティング