画像SEOの基本｜alt・サイズ・掲載位置の整え方

画像を置く目的を、先に決める

商品写真なら形状や使用場面、店舗写真なら場所や設備、図解なら文章で説明した関係を伝える役割があります。画像の枚数を増やす前に、読者のどの判断を助けるかを決めます。

画像に写っている対象は、周囲の本文でも特定できるようにします。商品名、場所、撮影時点、図解で扱う条件など、判断に必要な情報を画像の中だけへ閉じ込めないことが大切です。

altは、画像の内容と役割を具体的に伝える

記述例は、実際に見える内容と掲載の目的に合わせて調整します。写っていない特徴や未確認の効果を加えたり、検索語を繰り返し並べたりしません。図が複雑な場合は、altだけに情報を詰め込まず、本文にも説明を置きます。

画像と関連する本文を、近くへ置く

Googleは、画像の内容を理解する情報として、周囲の文章やキャプションなども使うと説明しています。写真を関連する説明の近くへ置き、何を確認できる画像なのかを読み取れる構成にします。

たとえば、設備紹介の写真を料金説明の途中に置くより、設備名、利用条件、利用できる範囲を説明する段落に添えた方が自然です。雰囲気を伝えるCGと、実物や実績を示す写真も、役割が区別できるキャプションにします。

画面に合うサイズで、鮮明さと軽さを両立する

Googleは通常のimg要素から画像を発見します。検索で見つけてもらう画像をCSSの背景として置いている場合は、実装を確認しましょう。形式の変更だけで満足せず、スマートフォンで見た鮮明さとページ全体の読込を点検します。

• 実際の表示幅に対し、大きすぎる画像を配信していないか調べる
• srcsetなどで画面に応じた画像を用意し、imgのsrcも確認する
• 圧縮後も商品や図の重要な部分を判別できるか見る
• 幅・高さや表示領域を用意し、読込時にレイアウトが動く原因を減らす
• 最初に見える重要な画像と、下方の画像の読込方法を分けて考える

画像の表示と、着地後の体験を確認する

画像を変更したら、読み込めるか、altとキャプションが内容に合うか、狭い画面で重要な部分が切れないかを確認します。PageSpeed Insightsなどの計測結果は、どの画像を見直すかの手がかりにします。

Search Consoleで確認できる画像検索の表示・クリックと、着地先での閲覧や問い合わせは分けて見ます。画像から訪れた人が仕様や利用条件を探せるかまで確かめ、差し替え日と同時に変えた本文を記録します。