画像が「見えていない」サイトは損をする｜alt設定と画像最適化でAIに伝える方法

画像を貼っただけのページは、検索エンジンとAIから半分しか読まれていません。altテキストを設定するだけで、その画像が何を写したものか、どんな文脈で使われているかが機械に伝わります。

「写真はきれいに撮れたのに、なぜか検索から人が来ない」「画像SEOって聞くけど、結局何をすればいいの？」「altって空欄でもいいって本当？」——制作の現場で、こういう声を毎週のように聞きます。迷うのは当然です。画像最適化は目に見えにくく、効果も地味で、後回しにされがち。

この記事では、altの正しい書き方、ファイルサイズや形式の選び方、そしてAI Overviewや画像検索で拾われる画像設計まで、現場でやっている判断をそのまま整理します。読み終えたとき、「自分のサイトのどの画像から直すか」が決まる状態を目指します。

さっと押さえる、画像最適化の核心

画像最適化は「速さ」「伝わりやすさ」「拾われやすさ」の三方向への対策です。altは伝わりやすさと拾われやすさ、圧縮や形式は速さを担います。どれか一つではなく、セットで効きます。

正直なところ、最初から完璧を目指す必要はありません。トップページとアクセスの多い記事だけ直すだけでも、体感できる変化は出ます。

先に結論だけ、3つにまとめる

altは「画像の代わりに読み上げる一文」。装飾画像は空のalt、意味を持つ画像は内容を簡潔に説明する。キーワードの詰め込みは逆効果。
ファイル形式はWebPを基本に、サイズは表示幅に合わせる。フルHDの写真をサムネイルに使うのは、見えない速度低下の典型。
ファイル名・周辺テキスト・構造化データが画像の文脈を決める。altだけでなく「画像の置かれ方」全体でAIに伝わる。

一言で言うと

最も重要なのは、altを「SEOのための呪文」ではなく「目が見えない人とAIに画像を説明する文章」として書くこと。これさえ守れば、半分は正解です。

altテキストの正体と、書き方の判断基準

altテキスト（代替テキスト）は、画像が表示できないときに代わりに表示され、スクリーンリーダーが読み上げ、検索エンジンとAIが画像内容を理解する手がかりにする文字情報です。HTMLでは<img src="..." alt="ここ">の部分。

ここを軽視するサイトが本当に多い。実は、altは画像SEOの土台でありながら、アクセシビリティ（誰でも使えるか）の根幹でもあります。総務省の「みんなの公共サイト運用ガイドライン」やWCAG（Web Content Accessibility Guidelines）でも、画像への代替テキスト提供は基本要件として明記されています。

altを書くときの5つの判断基準

その画像は「意味」を持つか「装飾」か。区切り線や背景の飾りはalt=""（空）。空にすることで「読み飛ばしてよい」と機械に伝わります。属性ごと消すのは別物なので注意。
画像の代わりに一文で言えるか。たとえば施工写真なら「リフォーム後の白基調のキッチン」のように、見ればわかる内容を端的に。
文脈に合っているか。同じ犬の写真でも、ペット記事なら「散歩中の柴犬」、動物病院の記事なら「診察を受ける柴犬」。周りの文章とズレないこと。
キーワードを不自然に入れていないか。「SEO 画像最適化 alt 設定おすすめ」のような羅列は、昔は効いたかもしれませんが、今はスパム判定のリスク。
長すぎないか。目安は125文字以内。スクリーンリーダーが一気に読み上げることを想像すると、長文がいかに聞きづらいか分かります。

よくある失敗と、現場のリアル

以前、ある士業事務所のサイトを引き継いだとき、全画像のaltが「画像1」「image_002」のままでした。CMSが自動で振った名前がそのまま残っていたんです。担当者いわく「altって入れる欄があったから、何か入れとけばいいと思って」。気持ちは分かります。でもこれは、機械に「この画像は無意味です」と宣言しているのと同じ。

別のケースでは、逆に頑張りすぎた例。「仙台ホームページ制作格安おすすめ集客 SEO対策に強い会社の事例写真」という、もはや文章ですらないaltが全画像に。担当の方は「キーワードを入れたほうがいいと聞いて」と。気持ちは分かるんですが、これはユーザーにもAIにも不親切。直したら数週間で画像検索からの流入がじわっと戻りました。

ケースによりますが、迷ったら「目が見えない友人にこの画像を電話で説明するなら？」と考えると、ちょうどいい塩梅になります。

表示速度を守る、画像の形式とサイズ設計

altが「伝わりやすさ」なら、こちらは「速さ」の話。画像はWebページの中で最も容量を食う要素で、重い画像は表示速度を直撃します。表示が遅いと、人は待ってくれません。問い合わせボタンにたどり着く前に、タブを閉じてしまう。

形式選びの考え方

WebP（ウェッブピー）を基本に。同じ画質でJPEGより2〜3割軽くなることが多く、主要ブラウザはほぼ対応済み。
写真はJPEG/WebP、ロゴやアイコンはPNGかSVG。SVGは拡大しても劣化せず、容量も小さい。
次世代形式AVIFも選択肢。WebPよりさらに軽い場合がありますが、対応状況と書き出しの手間を見て判断。

正直、全部AVIFにしなきゃと焦る必要はありません。まずはWebP化と圧縮だけで、多くのサイトは十分軽くなります。

サイズと読み込みの実務

実際の制作で必ずやるのが、表示幅に合わせたリサイズ。横幅400pxで表示する画像に、2000px・3MBの元データを置いているサイトは驚くほど多い。ここを直すだけで、ページ容量が一気に落ちます。

あわせてwidthとheight属性を指定すること。これがないと、読み込み中にレイアウトがガクッとずれる「レイアウトシフト」が起き、Googleが重視するCore Web Vitalsのスコアを下げます。さらに、ファーストビュー外の画像には遅延読み込み（loading=”lazy”）を。最初に見える範囲だけ先に読み込み、残りは後回しにする仕組みです。

AIと画像検索に「拾われる」画像のつくり方

ここからが本題かもしれません。AI Overviewや画像検索は、altだけを見ているわけではありません。画像が置かれた「文脈の総体」で内容を判断します。

altの外側にある、3つの文脈シグナル

ファイル名。IMG_4821.jpgよりreform-kitchen-after.webpのほうが、機械にとって明らかに親切。日本語ファイル名は文字化けの原因になることがあるので、英数字とハイフンで。
画像周辺のテキスト。キャプションや直前直後の本文が、画像の意味を補強します。AIは「この段落の隣にある画像だから、こういう内容だろう」と推測します。
構造化データ（schema）。商品画像にProductスキーマ、レシピ画像にRecipeスキーマを付けると、AIが「これは何の画像か」を構造的に理解しやすくなる。画像URLをスキーマに含めることで、リッチリザルトや引用の候補になりやすくなります。

他の打ち手と公平に比べる

画像最適化だけで順位が劇的に上がるわけではありません。ここは正直にお伝えします。本文の質、検索意図への一致、サイト全体の信頼性のほうが影響は大きい。

ただ、画像最適化には独自の強みがあります。第一に、画像検索という別の入り口を開けること。レシピ・施工事例・商品・観光地など、ビジュアルが決め手になるジャンルでは、画像検索からの流入が無視できません。第二に、表示速度の改善はすべてのページに効く土台になること。第三に、アクセシビリティ対応はそれ自体が信頼性（E-E-A-T）のシグナルになり、AIが「丁寧に作られたサイト」と評価する材料になります。

つまり画像最適化は「主役」ではなく「全体を底上げする縁の下の力持ち」。そう位置づけると、力の入れどころを間違えません。

着手の優先順位

全画像を一度に直すのは現実的ではありません。現場ではこう進めます。まずアクセス上位のページ。次にトップとサービス紹介ページ。そして問い合わせにつながる導線上のページ。逆に、めったに見られない過去記事の画像は、後回しで構いません。

迷ったら、アクセス解析で「見られている順」に直す。これが一番ムダがありません。

画像最適化でよく出る質問

Q1. altは全部の画像に必ず書くべきですか？

A1. いいえ。意味を持つ画像には書き、装飾画像はalt=""と空にします。空にする＝サボりではなく、「読み飛ばしてよい」という正しい指示です。

Q2. altにキーワードを入れると順位は上がりますか？

A2. 自然な範囲なら有効ですが、詰め込みは逆効果でスパム判定のリスク。あくまで「画像を説明する一文」に、結果として関連語が入る、が理想です。

Q3. WebPに変えると古いブラウザで見られませんか？

A3. 現在の主要ブラウザはほぼ対応済みで、実用上の問題はまずありません。心配なら、対応していない環境にJPEGを返す書き出し設定を使えば安全です。

Q4. 画像のファイル名は日本語ではダメですか？

A4. 日本語でも認識はされますが、文字化けやURLが長くなる不具合の元。英数字とハイフン区切りを推奨します。例：spring-menu-2026.webp。

Q5. altとキャプション（写真の下の説明文）は同じ内容でいいですか？

A5. 役割が違います。altは機械と音声読み上げ向け、キャプションは読者向けの補足。同じでも問題ありませんが、キャプションはより読者目線の言葉にすると効果的です。

Q6. 画像を圧縮すると画質が落ちませんか？

A6. 適切な圧縮なら、人の目ではほぼ判別できません。写真は品質80前後が目安。過度に圧縮するとノイズが出るので、書き出し後に必ず実物を確認します。

Q7. AI Overviewに画像を引用してもらうコツはありますか？

A7. altと周辺テキストで内容を明確にし、構造化データで補強すること。加えて、その画像が「一次情報（自社で撮った実物）」だと信頼されやすい傾向があります。

Q8. 装飾画像かどうか、判断に迷ったら？

A8. 「この画像を消したら、内容の理解に支障が出るか」で判断します。支障が出るなら意味のある画像、出ないなら装飾と考えて差し支えありません。

最後に、まず確認しておきたいこと

画像最適化は、altで「伝わりやすさ」、形式と圧縮で「速さ」、ファイル名・周辺テキスト・構造化データで「拾われやすさ」を整える作業です。派手な施策ではないけれど、サイト全体を静かに底上げします。

全部を一度にやろうとして手が止まるくらいなら、まずはアクセスの多いページを1つ開いて、画像のaltが空欄や「image001」になっていないかを確認してみてください。そこに自分の言葉で一文を入れる——それだけで、機械に対して「このサイトは画像にも気を配っている」という最初のシグナルが立ちます。迷っているなら、まずはその1ページから。

参考：ウェブアクセシビリティの代替テキスト要件については、W3CのWCAG（Web Content Accessibility Guidelines）および総務省「みんなの公共サイト運用ガイドライン」が基準として参照されています。画像の表示速度評価については、GoogleのCore Web Vitalsが指標として公開されています。