コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。

Google 画像検索 SEO のおすすめの方法

Google 画像検索では、ウェブ上の画像を検索できます。画像のキャプションやわかりやすいバッジなどの新しい機能により、ユーザーは画像の詳細なコンテキストに基づいて、すばやく情報を探索できます。

画像に関するコンテキストを追加すると利便性が増すため、より良質なトラフィックをサイトに呼び込むことにつながります。また画像やサイトを Google 画像検索用に最適化することで、ユーザーが目的のコンテンツを見つけやすくなります。たとえば、画像に alt 属性を指定したり、構造化データのマークアップを使用したりする方法があります。Google 画像検索の結果にコンテンツが表示される可能性を高めるには、Google のガイドラインに沿って対応してください。

ユーザーに高い利便性を提供する

Google 画像検索でコンテンツが表示される可能性を高めるには、ユーザーに高い利便性を提供することが重要です。つまり検索エンジンではなく、ユーザーの利便性を最優先に考慮してページを作成することが必要となります。以下にヒントをいくつかご紹介します。

  • 適切なコンテキストを提供する: ページのトピックに関連したビジュアル コンテンツを使用しましょう。ページには、独自の価値を追加する画像のみを表示することをおすすめします。特に、画像やテキストが独自のコンテンツではないページは推奨されません。
  • 配置を最適化する: 可能な限り、関連するテキストの近くに画像を配置しましょう。適宜、最も重要な画像をページ上部に配置することを検討してください。
  • 重要なテキストを画像に埋め込まない: 画像にテキストを埋め込むことは避けてください。特に、ページ見出しやメニュー項目などの重要なテキスト要素は埋め込まないでください。これは、すべてのユーザーがアクセスできるわけではないためです(また、ページ翻訳ツールも画像では動作しません)。ユーザーがコンテンツに最大限アクセスできるよう、テキストは HTML 形式で作成し、画像に代替テキストを設定してください。
  • 有益で質の高いサイトを作成する: Google 画像検索では、ビジュアル コンテンツだけでなく、質の高いコンテンツがウェブページに掲載されていることが重要になります。これにより、コンテキストが提供され、より有益な検索結果を得ることができます。ページのコンテンツは、画像のテキスト スニペットを生成するために使用されることがあります。また Google では、画像の掲載順位を決定する際にページのコンテンツの品質を考慮します。
  • あらゆるデバイスに対応したサイトを作成する: Google 画像検索は、パソコンよりも、モバイル デバイスで多く利用されています。このため、あらゆるデバイスのタイプやサイズに対応したサイトを設計することが重要です。モバイル フレンドリー テストを使用してモバイル デバイスでのページの動作をテストし、修正の必要な箇所についてのフィードバックを得ます。
  • 画像用に優れた URL 構造を作成する: Google は画像について理解するために、URL パスやファイル名を参照します。URL を論理的に構成できるよう、画像コンテンツを分類することを検討してください。

ページのタイトルと説明を確認する

Google 画像検索に表示される 1 つの画像の検索結果 Google 画像検索の結果ページ

Google 画像検索では、それぞれの検索結果とユーザーのクエリとの関連性をわかりやすく示すため、タイトルリンクとスニペットを自動的に生成します。これは、ユーザーが検索結果をクリックするかどうかを決定するために役立ちます。

これらの元になる情報は、各ページのタイトルやメタタグ内の説明情報など、いくつかあります。

表示されるタイトルリンクとスニペットの品質を向上させるため、Google のタイトルスニペットのガイドラインに沿ってページを構築するようご協力ください。

構造化データを追加する

構造化データを含めると、画像が Google 画像検索内で、わかりやすいバッジなどのリッチリザルトとして表示されます。これは、ページと関連性の高い情報をユーザーに表示する機能であり、ターゲットとしているトラフィックをサイトに呼び込むために有効です。Google 画像検索は、次のタイプの構造化データに対応しています。

一般的な構造化データのガイドラインや、使用する構造化データタイプに固有のガイドラインに準拠してください。ガイドラインに準拠していない構造化データは、Google 画像検索内でリッチリザルトとして表示されない場合があります。Google 画像検索内でバッジやリッチリザルトとして情報を表示させるには、各構造化データタイプで画像属性を指定しなければなりません。

Google 画像検索に表示される商品のリッチリザルト Google 画像検索に表示される動画のリッチリザルト

速度を考慮して最適化する

画像が原因で全体的なページサイズが大きくなり、ページの読み込みが遅く、通信費が高くなる場合がよくあります。最新の画像最適化技術レスポンシブ画像技術を使用して、高品質で高速なユーザー エクスペリエンスを提供するようにしてください。

PageSpeed Insights でサイトの読み込み速度を分析し、「スピードが重要な理由とは?」ページにアクセスして、ウェブサイトのパフォーマンスを向上させるためのおすすめの方法やテクニックをご確認ください。

高画質の写真を追加する

ぼやけた不明瞭な画像よりも、高画質の写真はユーザーの関心を引きます。また、鮮明な画像は検索結果のサムネイルで目立つため、ユーザー トラフィックを得やすくなります。

画像にわかりやすいタイトル、キャプション、ファイル名、テキストを含める

Google は、画像のキャプションやタイトルなどのページのコンテンツから画像のテーマに関する情報を抽出します。可能な限り、画像のテーマに関連するページの、関連テキストの近くに画像を配置するようにしてください。

同様に、ファイル名も画像のテーマを判断する材料として使用されます。たとえば、IMG00023.JPG よりも、my-new-black-kitten.jpg の方がテーマを判断するのに役立ちます。画像をローカライズする場合は、ファイル名も翻訳してください。その際、ラテン文字以外の文字や特殊文字を使用している場合は、URL エンコード ガイドラインに従ってください。

alt 属性でわかりやすい代替テキストを使用する

代替テキスト(画像について説明するテキスト)は、スクリーン リーダーを使用するユーザーや、低帯域幅のネットワークを使用しているユーザーなど、ウェブページの画像を確認できないユーザー向けの補助機能として役立ちます。

Google では、代替テキストに加えて、コンピュータ ビジョン アルゴリズムやページのコンテンツを使用して、画像のテーマを理解します。また、画像の代替テキストは、画像をリンクとして使用する場合にアンカー テキストとして使用できます。

代替テキストを設定するときは、キーワードを適切に使用して、ページのコンテンツのコンテキストに沿った、情報に富む、有用なコンテンツを作成するようにしてください。alt 属性にキーワードを羅列すること(キーワードの乱用)は避けてください。これによって、ユーザー エクスペリエンスが低下し、サイトがスパムとみなされる場合があります。

悪い例(代替テキストがない):

<img src="puppy.jpg"/>

悪い例(キーワードの乱用):

<img src="puppy.jpg" alt="puppy dog baby dog pup pups puppies doggies pups litter puppies dog retriever labrador wolfhound setter pointer puppy jack russell terrier puppies dog food cheap dogfood puppy food"/>

良い例:

<img src="puppy.jpg" alt="puppy"/>

最も良い例:

<img src="puppy.jpg" alt="Dalmatian puppy playing fetch"/>

また、W3 ガイドラインに沿って、代替テキストのアクセシビリティについても検討します。<img> 要素の場合、alt 属性を追加できます。インライン <svg> 要素の場合は、<title> 要素を使用できます。次に例を示します。

<svg aria-labelledby="svgtitle1">
  <title id="svgtitle1">Googlebot wearing an apron and chef hat, struggling to make pancakes on the stovetop</title>
</svg>

アクセシビリティを監査し、低速ネットワーク接続エミュレータを使用して、コンテンツをテストすることをおすすめします。

Google に画像を検出されやすくするには

画像にセマンティック マークアップを使用する

Google ではページの HTML を解析して画像をインデックスに登録しますが、CSS の画像はインデックスに登録しません。

良い例:

<img src="puppy.jpg" alt="A golden retriever puppy" />

悪い例:

<div style="background-image:url(puppy.jpg)">A golden retriever puppy</div>

画像サイトマップを使用する

画像サイトマップを送信することで、サイトマップの情報を使用しなければ検出されない可能性のある画像の URL を指定できます。

ドメイン間の制限が設けられている通常のサイトマップとは異なり、画像サイトマップには他のドメインの URL を含めることができます。これにより、CDN(コンテンツ配信ネットワーク)を使用して画像を提供できます。CDN を使用している場合は、クロールエラーが検出された際に Google から通知を受け取れるように、Search Console で CDN ドメイン名の所有者を確認しておくことをおすすめします。

サポートされている画像形式

Google 画像検索では、 BMP、GIF、JPEG、PNG、WebP、SVG の形式の画像をサポートしています。

データ URI としてインライン画像にすることもできます。データ URI を利用すると、画像などのファイルをインラインとして埋め込むことができます。次の形式を使用して、img 要素の src 属性を Base64 エンコード形式の文字列で設定します。

<img src="data:image/svg+xml;base64,[data]">

インライン画像によって HTTP リクエスト数は減りますが、ページのサイズが大幅に増加するため、インライン画像の使用は慎重に判断してください。詳細については、web.dev ページに掲載されている、画像のインライン化の長所と短所のセクションをご覧ください。

レスポンシブ画像

ウェブページをレスポンシブ デザインにすると、ユーザーがさまざまなデバイスタイプで使用できるため、ユーザー エクスペリエンスが向上します。ウェブサイトで画像を処理するためのおすすめの方法については、レスポンシブ画像に関するガイドをご覧ください。

ウェブページでは、<picture> 要素や、img 要素の srcset 属性を使用してレスポンシブな画像を指定します。しかし、一部のブラウザやクローラーではこれらの属性を理解できません。常に src 属性を使用して代替 URL を指定することをおすすめします。

srcset 属性を使用すると、同じ画像について画面サイズに応じたさまざまなバージョンを指定できます。

: <img srcset>

<img srcset="example-320w.jpg 320w,
       example-480w.jpg 480w,
       example-800w.jpg 800w"
   sizes="(max-width: 320px) 280px,
      (max-width: 480px) 440px,
      800px"
   src="example-800w.jpg" alt="responsive web">

<picture> 要素は、同じ画像の異なる <source> バージョンをグループ化するために使用するコンテナです。この方法は、ピクセル密度や画面サイズなどのデバイスの仕様に応じて、ブラウザが適切な画像を選択できるようにするための代替手段として活用できます。また、新しい画像形式を使用する場合に、その形式をまだサポートしていないクライアント向けにグレースフル デグラデーションを組み込む目的でこの picture 要素を利用することもできます。

picture 要素を使用する際は、次の形式を用いて、常に src 属性を含む img タグを代替として提供することをおすすめします。

: <picture>

<picture>
 <source type="image/svg+xml" srcset="pyramid.svg">
 <source type="image/webp" srcset="pyramid.webp">
 <img src="pyramid.png" alt="large PNG image...">
</picture>

セーフサーチは、露骨な表現を含む画像、動画、ウェブサイトを Google 検索結果で表示するかブロックするかを指定する、Google ユーザー アカウント内の設定です。Google がサイトの性質を把握し、必要に応じてセーフサーチ フィルタをサイトに適用できるようご協力ください。セーフサーチ向けのページのラベル付けについては、こちらをご覧ください。

Google 画像検索のインライン リンクを無効にする

必要に応じて Google の画像検索結果ページでインライン リンクを無効にすることで、Google の画像検索結果ページにフルサイズの画像が表示されないようにすることができます。

インライン リンクを無効するには:

  1. 画像がリクエストされる際、そのリクエストの HTTP リファラー ヘッダーを調べます。
  2. Google ドメインからのリクエストであれば、200 または 204 No Content HTTP ステータス コードを返します。

Google はページのクロールと画像の参照を引き続き行いますが、検索結果にはクロール時に生成されたサムネイル画像を表示します。このオプトアウトはいつでも可能で、ウェブサイトの画像を新たに処理する必要はありません。この行為は画像のクローキングとはみなされず、手動による対策の対象にはなりません。

検索結果に画像がまったく表示されないようにすることもできます。

最後に...

掲載順位を上げるために役立つ多くの情報が掲載されている SEO スターター ガイドをご覧ください。また、ご質問がある場合は、Google 検索セントラル ヘルプ コミュニティに投稿してください。