スニペットなどSERPに表示される内容を制御したい!その方法とは?

コンテンツSEO・コンテンツマーケティング
2019.10.30
2019.11.11
SERPのスニペット

SERPはSearch Engine Result Pageの略で、ユーザーが検索エンジンで検索したキーワードの検索結果を表示するページのことです。このページに表示されるスニペットなどの内容を見てユーザーはクリックするWEBページを決定するため、クリック率の改善にはスニペットなどSERPに表示される内容を制御することが欠かせません。ここでは、検索結果により魅力的な内容を表示するための制御方法と、制御する仕組みの概念をご紹介します。

構造化データとは?

まず、スニペットなどSERPに表示される内容を制御するために、理解しておかなければならない概念が「構造化データ」です。構造化データを利用することで、クローラーがWEBページの内容をメタデータとして解釈しやすくなります。また、SERPにスニペットなど様々な要素が表示されるようになります。

ボキャブラリーを利用する

構造化データには「ボキャブラリー」を利用します。ボキャブラリーは、モノゴトが持つ意味を表現するために定義されたものです。多くの種類のボキャブラリーが存在しますが、代表的なのは、「schema.org」です。schema.orgでは、誕生日を表す時には[Date]という値を利用し、出生地を表す時には[Place]という値を利用するというように、マークアップするために利用する値が定義されています。

シンタックス「JSON-LD」の仕様に従う

ボキャブラリーはマークアップ時に利用する「値」を定義しただけのもののため、HTMLにマークアップする際には、どのようにマークアップするかの「仕様」が必要になり、その仕様が「シンタックス」です。シンタックスには3つの種類がありますが、Googleは、「JSON-LD」と呼ばれるシンタックスを推奨しています。

構造化データをマークアップする方法

以上が「構造化データ」の概念です。それでは構造化データをマークアップする方法を簡単にご紹介します。

構造化データをHTML上で直接マークアップする場合

上述の「ボキャブラリー」と「シンタックス」により、構造化データをHTML上で直接マークアップすることが可能です。ウェブマスターツールには「構造化データ マークアップ支援ツール」があり、このツールを利用すれば簡単に構造化データをマークアップすることができて便利です。

構造化データマークアップ支援ツール

こちらは構造化データ マークアップ支援ツールの利用画面です。

※使い方は、Google「構造化データ マークアップ支援ツール」を参照してください。

構造化データをデータハイライターを利用してマークアップする場合

WEBページの構造化データのパターンをGoogleに伝えるためのウェブマスターツールに、「データハイライター」があります。構造化データのマークアップを行いたいサイトのURLとページタイプを選択してタグ付けを行うことが可能です。例えば、名前や場所、日付などのデータフィールドを簡単にタグ付けでき、タグ付けしたデータは随時新しい形式でより魅力的に検索結果に表示することができます。

データハイライターを利用するには、まずはSearch Consoleのアカウントを作成し、サイトをプロパティに追加する必要があります。既にサイトがSearch Consoleに登録されている場合、下記のアドレスよりデータハイライターを開くことが可能です。

データハイライター:https://www.google.com/webmasters/tools/data-highlighter

※使い方は、「データハイライター」を参照してください。

スニペットとは

「スニペット(snippet)」とは、SEOでは検索結果に表示されるWEBページの説明文を指し、「meta description」というマークアップを利用して表示しています。下の画像は「下北沢 カレー」でGoogle検索したSERPです。画像内赤枠で囲まれているのが、それぞれの記事のスニペットです。これらは「meta description」を利用した一般的なスニペットです。

検索エンジンにWebページの説明となる部分を適切に認識させることで、そのページが何をテーマに書かれている記事なのかを伝えることができるため、SEO対策において重要な施策となっています。ユーザーはSERPのタイトルとスニペットをみて、クリックするページを決めるため、適切なスニペットの設定は、クリック率改善の観点からも欠かせません。

なおスニペットには「リッチリザルト(リッチスニペット)」や「強調スニペット」、「AMP」などいくつかの種類があります。スニペットとして表示されるのはテキストのみではなく、写真や動画など様々です。このあと紹介する方法を使えば、スニペットとして表示されるテキストの内容や写真のサイズ、動画の長さを制御することができます。

リッチリザルトとは?

「リッチリザルト」とは、通常の、タイトル、URL、スニペットで表示される検索結果とは異なり、結果を表示する位置や形式を様々に変化させたものです。以前は「リッチスニペット」とも呼ばれていました。リッチリザルトにはいくつかの種類がありますが、下の画像の赤枠内のように、写真などの画像や動画が検索結果に表示されるものもあります。

リッチリザルトの例

リッチリザルトは、構造化データのマークアップを利用することで設定可能です。なお、リッチリザルト(リッチスニペット)について詳しくは下記の記事を参考にしていただくことをおすすめします。

リッチスニペットとは何か?設定方法も解説。

強調スニペットとは?

「強調スニペット」とは、Google検索を行ったユーザーの疑問や悩みに直接答えるコンテンツを表示する形式のことです。例えば「眼瞼下垂」で検索するとSERP上部に下の画像のようなコンテンツが表示されます。他のスニペット同様に構造化データのマークアップを利用します。

強調スニペット

AMPとは?

「AMP(Accelerated Mobile Pages)」は、スマートフォンでWEBページを高速で表示させるための仕組みで、ニュースメディアや情報サイトの中にAMPを利用しているサイトが多くあります。下の画像は「天皇即位」で検索した検索結果です。画像内赤枠で囲まれているのが、AMPに対応したWEBページとなっています。

AMP

スニペットとは異なりますが、スニペット同様に構造化データマークアップを利用します。

スニペットの2つの制御方法

これまでスニペットに関して制御できるのは、「スニペットの表示を許可するかどうか」だけでした。しかし、2019年10月以降、SERPに表示されるスニペットの文字数や動画のプレビュー時間、画像のサイズを制御することができるようになりました。

Googleが公表した2つの制御方法をご紹介します。

  • robotsメタタグで記述する方法
  • HTML属性で記述する方法

robotsメタタグで記述する場合

robotsメタタグはHTMLページの <head> 要素内に追加するか、x-robots-tagのHTTPヘッダーで指定することで、ページレベルでスニペットを制御することが可能です。

以下、スニペットを制御するのに利用するrobotsメタタグを4つ紹介します。ここで紹介するrobotsメタタグはお互いに併用することが可能です。

nosnipet

「nosnipet」は以前から利用できたスニペットです。スニペットを表示したくない時に次のように記述して利用します。

<meta name=”robots” content=”nosnippet”>

max-snippet:[number]

「max-snippet」は、新しく利用できるようになったrobotsメタタグです。スニペットとして表示する文字数を設定したい場合に、[number]に任意の数値を設定して利用します。スニペットを200文字に設定するのであれば、以下のように記述します。

<meta name=”robots” content=”max-snippet:200″>

なおマイナスの数値は設定できません。マイナスの数値を設定した場合、スニペットの文字数の設定が無効となります。また、0を指定すると、「nosnipet」を利用した場合と同様、スニペットは表示されません。

なお、この設定は強調スニペットにも影響します。強調スニペットには最低文字数があるため、robotsメタタグの設定により最低文字数に満たない文字数に制限していた場合、強調スニペットとして表示されなくなります。

max-video-preview:[number]

「max-video-preview」は、動画のプレビューがSERPに表示されるリッチリザルトで利用できます。SERPに表示される動画のプレビューの最長再生時間を設定します。たとえば下記のように記述すれば、SERPに表示される動画のプレビューは15秒間だけ再生されるように設定可能です。

<meta name=”robots” content=”max-video-preview:15″>

なお、マイナスの値は無効で、最長再生時間を制限することはできません。0を記述すると動画のプレビューは再生されません。

max-image-preview:[setting]

「max-image-preview」は、SERPに表示される画像のサイズを設定するためのrobotsメタタグです。[settings]の部分に以下の3種類の値から選んで設定します。

なお、この設定はAMP(高速表示)化されたページや、Discoverフィード(各ユーザーが関心を持ちそうなコンテンツをGoogleが表示する機能)に掲載される画像にも影響を及ぼします。

  • none:非表示
  • standard:デフォルト
  • large:viewportの幅と同サイズ

“data-nosnippet” HTML 属性で記述する場合

“data-nosnippet” HTML 属性を利用することで、Webページのコンテンツのうちスニペットとして表示することを許可する部分を制限することが可能です。span、div または section 要素とともに用います。

ページ内のコンテンツではなく、meta descriptionをスニペットとして表示させたい場合には、ページ内のコンテンツを全て”data-nosnippet” HTML 属性で囲むことで可能となります。

まとめ

SERPに表示されるスニペット(リッチリザルト、強調スニペットを含む)やAMPなどの要素は、構造化データマークアップを利用し表示することができます。そしてrobotsメタタグもしくはHTML属性を利用することで制御することが可能です。このページで紹介しているrobotsメタタグを利用すれば、以前よりも簡単に制御することができます。

スニペットなどSERP(検索結果)に表示される内容は、最もユーザーの目に触れる場所です。スニペットなどが魅力的でなければ、上位表示できてもアクセス数を稼ぐことができないという事態になりかねません。このページで紹介した方法で、検索結果に表示される内容を制御し、ユーザーの興味を引き、クリック率の向上を図ることをおすすめします。

SEOやWEB制作に関する情報を検索

コラム

ピックアップコラム

最新コラム

人気コラム

過去の記事

ご質問やご相談などお気軽にお問い合わせください。

お電話でのお問い合わせはこちら

03-5829-9912

受付時間:平日10:00~19:00(土・日・祝日を除く)