PINTO!株式会社PLAN-Bの情報発信メディア

2019.01.22

金城 和佳

SEO SOLUTION

モバイル検索結果にサムネイル画像を表示させる方法について

目次
    1. Googleは検索結果だけではなくそのデザインも進化させている
    2. モバイル検索結果にサムネイル画像を表示させる
    3. サムネイル画像の指定方法。『PageMap』『meta name=”thumbnail”』の2種類
      1. PageMapデータ
      2. thumbnailメタタグ
    4. サムネイル指定の注意点とその応用方法方
      1. URL一時ブロックツールを使う
      2. 「robots.txt」を使いクローラーをブロックする
    5. モバイルファーストを推し進めるGoogleに対応しましょう

Googleは検索結果だけではなくそのデザインも進化させている

Googleはユーザーに適切な情報を届けようと日々研究しアルゴリズムを進化させています。パンダアップデート、ペンギンアップデートなどが有名な所でしょう。これはユーザーに正しい検索結果を届けるために行なわれたアップデートでした。また一方で検索結果だけではなく、Google検索を便利に見やすく、使いやすくするために様々な機能を追加しています。

  • 強調スニペット
  • リッチスニペット
  • ナレッジグラフ

詳しく知りたい方は次の記事もあわせてご覧ください。強調スニペットとは|検索結果の一番上に表示されるアレの正体 | PINTO!

このように検索結果もユーザーにとって分かり易く、グラフィカルに進化し続けています。
その機能に対応していくのはサイト運営者にとって重要な事であるでしょう。

今回はその中の一つである「モバイル検索結果にサムネイル画像を表示させる」方法について解説します。


モバイル検索結果にサムネイル画像を表示させる

これは特定のキーワードで検索された場合、モバイル検索結果の右側にサイト内から適した画像を選んで表示してくれる機能になります。画像が表示されることでどんなサイトか一目でわかるようになります。また画像が設置されていると目立つのでユーザーへの訴求力が高まりクリック率の改善が期待できます。

タイトルやディスクリプションは文字の表現になりますのでユーザーに読んでもらわなければいけません。しかし画像なら目に入り易く内容も伝えやすいのでサイト内容を伝える手段として優れています。

例:モバイル検索結果


サムネイル画像の指定方法。『PageMap』『meta name=”thumbnail”』の2種類

サムネイルの指定方法には次の2種類の方法があります。

  • PageMap データ を使用する
  • thumbnail メタ タグを使用する

PageMapデータ

1つ目は「PageMapデータ」です。これはGoogleが開発した構造化データでHTMLで書かれた情報が何なのか、どういう属性なのかをクローラーに伝えるものです。ランキングに影響しませんしユーザーが見ることもできませんが、こちらを使用することで検索結果に特定のアクションや属性などの要素を追加することができます。

追加方法

この ”http://www.example.com/〇〇〇.jpg” 部分が画像のパスになります。

 

thumbnailメタタグ

2つ目はthumbnailメタタグを使用します。下記のタグを同じように部分に追加してください。

 

サイトがどの方法でモバイル対応しているかによって設定するページが変わります。レスポンシブ、動的配信であればページの<head>部分ですがセパレートタイプならモバイルページの<head>部分に設置してください。

方法としてはどちらもシンプルで特に複雑な部分もありません。TOPページや重要だと思われるカテゴリページなどに設置することを推奨します。


サムネイル指定の注意点とその応用方法方

このサムネイル指定方法は設定したからといって絶対に表示されるものではありません。Googleはこれらのタグをサイト運営者からのシグナルとして利用し、最終的に表示される画像の判断はGoogle側で行なわれることになっています。サイト運営者側は「PageMapデータ」「thumbnailメタ タグ」それぞれの方法を試し実際に表示されるか確認することが重要です。

またこのタグは検索結果が分かり易く目立つためのものですので実際にユーザーの目にとまらなければなりません。つまり上位表示してこそ力を発揮するタグだと言えるでしょう。

 

ここでは応用方法としてサムネイルの画像を削除する方法について解説します。意図しない画像が表示されていたり古い画像が設定されている場合に参考にしてみてください。

URL一時ブロックツールを使う

サーチコンソール上の機能の一つにGoogleの検索結果から特定のURLをブロックすることができます。詳しくはGoogleの公式ヘルプページをご覧ください。

https://support.google.com/webmasters/answer/1663419

「robots.txt」を使いクローラーをブロックする

robots.txtはクローラーの挙動をある程度制御できるテキストファイルです。こちらのファイルに

User-agent: Googlebot-Image
Disallow: http://www.example.com/〇〇〇.jpg

と記述することで画像ファイルがインデックスされなくなり検索結果に表示されなくなります。この方法はクローラーが回ってくるまで待つことになるので時間がかかりますが特定のディレクトリを指定する、特定の拡張子の画像ファイルだけを指定する等、柔軟に対応できます。


モバイルファーストを推し進めるGoogleに対応しましょう

Googleが2015年にモバイルファーストインデックスを発表してから検索結果のメインはモバイルに移り変わっています。今回ご紹介したサムネイルの指定方法はランキングに影響するものではありませんが、ユーザーにサイト内容を上手に伝えることができる手法です。ぜひ使いこなしてセッション数の向上を目指してください。

SEOをもっと学びたい方はこちらもチェック:SEO対策の全てを紹介!