【Blogger】Googleのモバイル検索結果に画像を表示する

本ページはプロモーションが含まれています


ブログのアクセス数を増やすことにおいて、SEO対策は重要です。読者の多くの方は目にしたことがあるかもしれませんが、Googleの検索結果にサムネイルが表示されていることがあると思います。

これはmetaタグ内に適切な記述をすることで表示させることができるそうです。今回は無料のブログサービスである「Blogger」で検索結果にサムネイルを表示させるためのカスタマイズ方法を紹介します。


カスタマイズ前の前提

今回のカスタマイズで必ずGoogleの検索結果に画像が表示されるというわけではありません。あくまでGoogleのクローラー(bot)に「この記事のサムネイルはこれです」と知らせるためのものであって、最終的に検索結果に画像を表示するかはGoogle側の判断によりますのでご注意ください。

参考にした記事

今回の記事を作成するにあたり以下の記事を参考にしました。


Bloggerのカスタマイズ方法

以下のタグを<head>内のblog:pageTypeが「item」になっている箇所の直下に以下のタグを追加してください。

See the Pen thumbnail by もなか (@monaka496) on CodePen.


モバイル検索結果の画像表示例

うまくGoogle側が認識してくれた場合は以下のように表示されます。
モバイルの検索結果画面なので、スマホの実機で確認するかChromeの検証画面(F12を押した画面)で確かめてみてください。

Googleのモバイル検索結果例

検索結果にサムネイルを表示するメリット

一般的にユーザーはリンクを押す前にそのページにどんな内容が書いてあるかを想像してからページに訪問します。単純なテキストだけではなかなかページの内容が理解できず、ページに訪問してもらうことができないですが、サムネイルを表示するとイメージが付きやすくアクセスしてもらいやすくなります。可能であれば設定しておくことをおすすめします。

まとめ

今回は、BlogeerでGoogleの検索結果画面にサムネイルを表示させる方法を紹介しました。繰り返しになりますが、あくまでこれは記事の内容を表す画像をGoogle側に理解してもらいやすくする方法であって、必ず表示させることはできないことに注意してください。この記事が参考になれば幸いです。