Google検索結果にリッチリザルトを表示させて検索流入を増やそう
Google検索をした場合、通常表示される内容は
・コンテンツタイトル
・パンくずリスト
・スニペット(コンテンツ内容の要約)
だけですが、サイトによっては以下のように口コミ評価を星マークで表示したり、価格を表示させることができます。
このようにタイトルやスニペット以外の表示をリッチリザルト(またはリッチスニペット)と呼んでいます。
このリッチリザルトがないページに比べリッチリザルトがあるページの方が目立ちますし、クリック率(CTR)もよくなります。
だから、自分のサイトの検索結果にもこのリッチリザルトを表示させたいのですが、どうやったらいいのでしょうか?
結論から言うと、リッチリザルトを表示させる、させないはGoogleの判断によります。
いろいろ対策しても、Googleが「これは表示させよう」と判断してくれないと表示してくれません。
とはいえ、何もしないよりも、何らかの対策をした方が表示してもらえる確率は高くなります。
というか、ちゃんと対策をしないと、いくら待っていても表示されません。
まずは、リッチリザルト対策をして、あとは待つ!という事が必要です。
では、リッチリザルトを表示してもらうための対策とは何か?
それは、サイトに構造化データーを設置することです。
構造化データーとは
構造化データーとは、HTMLで書かれたコードが何を意味するのか、検索エンジンのクローラに理解してもらうためのタグ付けしたデーターの事です。
例えば、皆さんのサイトには必ずパンくずリストがありますよね?
通常パンくずリストはリストタグ(ul,liタグ)で作ってあります。
検索エンジンクローラは、各ページをクロールして、関連のあるリストが各ページに配置されていると、「これはパンくずリストだな」と判断し、検索結果ページなどに表示してくれます。
しかし、ページ構成などによっては、パンくずリストだとわかりにくいものがあります。
また、検索結果に出すパンくずリストのワードは検索エンジンが判断するので、製作者側の意図とずれてしまう事もあります。
そこで、この構造化データーを使ってクローラーに
「このリストはパンくずリストですよ」
「検索結果に表示させるのなら、このように表示させてね」
という事を知らせてあげるのです。
なぜ構造化データーが必要なのか
検索エンジンは、サイトコンテンツからいろいろな情報を集めて、このコンテンツにはどんなことが書かれているのか、コンテンツ内のこのデーターは何なのかを一生懸命分析します。
ただ、機械が分析するので間違ってしまう事もあります。
また、分析に時間がかかり、なかなかインデックスされないこともあります。
だから、検索エンジンに早く、正しく理解してもらうために構造化データーにします。
構造化データーの書き方
構造化データーの書き方(きまり)は、大きく分けて次の3つがあります。
・microdata
・RDFa
・JSON-LD
どれも一長一短ありますが、GoogleはJSON_LD推しです。
ですので、JSON-LDで書いた方がいいと思います。
書き方ですが、Googleが構造化データーを自動で作ってくれるツールを用意してくれました。
それがこちらです。
構造化データマークアップ支援ツール
ただ、これがちょっと使いずらい。
自分でデータを作っちゃった方がいいでしょう。
Googleもそのあたりはわかっているようで、サポートしている構造化データーのサンプルが提供されています。
Google検索ギャラリーを使ってみる
リンク先のページに構造化データーのサンプルがあるので、該当するものをコピペして自分のページ内に設置します。
何個かをこの後にサンプルとして表示しておきます。
JSON-LDはスクリプト形式ですので、ページ内のどこに置いても結構です。
ページの読み込み速度を上げたいのであれば、一番最下層に置くのがおススメです
構造化データーは、結構めんどくさいコードなので、間違いやすいです。
通常のHTMLコードは間違っていたらデザインが崩れるとか表示されないと、目に見えてエラーが分かるのですが、構造化データーは目に見えないので、間違いに気づきにくいです。
そのためGoogleでは、構造化データが正しいかどうかのテストツールも用意してあります。
こちらのリンク先のアクセスして、構造化データを設置したページのURLもしくは、設置する予定のコードを貼り付けてテストを開始します。
データーに問題が無ければ、問題なしと出ますが、何か問題があれば「エラー」か「警告」が表示されます。
エラーの場合は、構造化データーが正しく動かないのですぐに修正しましょう。
どこを修正すべきかも教えてくれます。
警告の場合ですが、例えば任意設置パラメーターなどがないといった、とりあえず問題がないけどできたら直しておいた方がいいといった問題を教えてくれます。
構造化データーの設置手順
ということで、構造化データーの設置手順をまとめます。
1)構造化データーを作成する
↓
2)作成したデーターをサイトページ内に設置する
↓
3)構造化データテストツールで間違いがないか確認する
↓
4)間違いがなければサーチコンソールのURL検査をやってインデックスさせる
↓
5)検索結果にリッチリザルトが表示されるのを気長に待つ
いつになったら検索結果に表示されるのか?
はっきり言って、わかりません。
でも、これまでやってきた感覚だと2週間から1か月くらいかかります。
これを早める方法をご存知の方、ぜひ教えてください。
構造化データサンプル・パンくずリスト
パンくずリストの構造化データーサンプルです。
パンくずリストは、わざわざ構造化データーにしなくても、ほとんどの場合検索結果に表示されますので、やるべきものではないかとは思いますが、練習に使ってみてはいかがでしょうか?
↓
Google Search Consoleの拡張に構造化データにしたパンくずリストの検査結果が出るようになりました。(2019年9月20日)
ということは、Googleはパンくずリストの構造化を重要視しているという事です。
これは、やっておいた方がいいと思いますよ
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"name": "Books", ←第1層の名称
"item": "https://example.com/books" ←第1層のURL
},{
"@type": "ListItem",
"position": 2,
"name": "Authors", ←第二層の名称
"item": "https://example.com/books/authors" ←第二層のURL
},{
"@type": "ListItem",
"position": 3,
"name": "Ann Leckie", ←第三層の名称
"item": "https://example.com/books/authors/annleckie" ←第三層のURL
},{
"@type": "ListItem",
"position": 4,
"name": "Ancillary Justice", ←第四層の名称
"item": "https://example.com/books/authors/ancillaryjustice" ←第四層の名称
}]
}
</script>
構造化データーサンプル・商品
ECサイトなどで、商品の価格や口コミ評価などを表示させる構造化データーです。
この構造化データーは、必ずその商品を紹介・販売している詳細ページに設置します。
トップページやカテゴリーインデックスページに設置するとペナルティーとなる事があるそうです。
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Product",
"name": "商品の名前",
"image": [
"https://example.com/photos/1x1/photo.jpg", ←商品画像のURL(複数可能)
"https://example.com/photos/4x3/photo.jpg",
"https://example.com/photos/16x9/photo.jpg"
],
"description": "商品の説明",
"sku": "商品型番",
"brand": {
"@type": "Thing",
"name": "ブランド名"
},
"review": { 商品レビュー
"@type": "Review",
"reviewRating": {
"@type": "Rating",
"ratingValue": "評価点数",
"bestRating": "評価最高点"
},
"author": {
"@type": "Person",
"name": "レビュー投稿者"
}
},
"aggregateRating": { ←商品の総合評価
"@type": "AggregateRating",
"ratingValue": "レビュー平均点",
"bestRating": "レビュー満点",
"reviewCount": "得票総数"
},
"offers": {
"@type": "Offer",
"url": "商品ページのURL",
"priceCurrency": "通貨単位 日本円:JPY",
"price": "金額(小数点2桁までつけること)",
"priceValidUntil": "その金額の有効期限",
"itemCondition": "https://schema.org/NewCondition",←商品の状態(新品)
"availability": "https://schema.org/InStock",←在庫アリ
"seller": {
"@type": "Organization",
"name": "販売業者名"
}
}
}
</script>
このように、検索スニペット部に評価点と金額が表示されます。
構造化データサンプル・ローカルビジネス
レストランやアクティビティなどの構造化データーです
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "LocalBusiness",
"image":"画像URL"
,
"name": "施設名",
"description": "簡単な施設の説明",
"address": {
"@type": "PostalAddress",
"streetAddress": "住所(町名)",
"addressLocality": "住所(市)",
"addressRegion": "住所(県)",
"postalCode": "郵便番号",
"addressCountry": "国コード"
},
"priceRange":"平均的予算",
"review": { //評価
"@type": "Review",
"reviewRating": {
"@type": "Rating",
"ratingValue": "評価点",
"bestRating": "評価満点"
},
"author": { //評価者
"@type": "Person",
"name": "評価者氏名"
}
},
"aggregateRating": { //総合評価
"@type": "AggregateRating",
"ratingValue": "平均評価点",
"bestRating": "評価満点",
"ratingCount": "評価数"
},
"geo": { //Google Map
"@type": "GeoCoordinates",
"latitude": 緯度,
"longitude": 経度
},
"url": "サイトURL",
"telephone": "電話番号",
"openingHoursSpecification":[ //営業時間
{
"@type": "OpeningHoursSpecification", //営業時間
"dayOfWeek": [
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday"
],
"opens": "09:00",
"closes": "17:30"
},
{
"@type": "OpeningHoursSpecification",
"dayOfWeek": [
"Saturday",
"Sunday"
],
"opens": "09:00",
"closes": "19:00"
}
],
"potentialAction": { //予約
"@type": "ReserveAction",
"target": {
"@type": "EntryPoint",
"urlTemplate": "予約ページURL",
"inLanguage": "jp",
"actionPlatform": [
"http://schema.org/DesktopWebPlatform",
"http://schema.org/IOSPlatform",
"http://schema.org/AndroidPlatform"
]
},
"result": {
"@type": "Reservation",
"name": "予約"
}
}
}
</script>
構造化データーサンプル・FAQページ
FAQページの構造化データは、最近スタートしたのでまだ実装しているサイトは少ないです。
このデータを実装すると、以下のように検索スニペットにQ&Aが表示されます。
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "FAQPage",
"description": "FAQページの概要文",
"mainEntity":
[
{
"@type": "Question",
"name": "質問①",
"acceptedAnswer": {
"@type": "Answer",
"text": "質問①の回答",
"url": "質問①の詳細URL"
}
},
{
"@type": "Question",
"name": "質問②",
"acceptedAnswer": {
"@type": "Answer",
"text": "質問②の回答",
"url": "質問②の詳細URL"
}
}
]
}
</script>
質問を増やすには、以下の部分を追加していきます。
{
"@type": "Question",
"name": "質問①",
"acceptedAnswer": {
"@type": "Answer",
"text": "質問①の回答",
"url": "質問①の詳細URL"
}
},
この構造化コードもページのヘッダー部分に設置します。
WordPressでの設置について
構造化データーは、基本的にヘッダー部分に設置します。
自分でコーディングしているサイトの場合は、ヘッダー部分への設置は問題ないと思います。
しかし、Wordpressの場合、個別ページのヘッダーにコードを設置するにはちょっとした工夫が必要です。
WordPressの場合、標準でヘッダーへコードを追加設置する方法はありますが、すべてのページに同じコードが設置されます。
これはAdsenseのコードやGoogle Analyticsの追跡コードなどにはいいのですが、ページごとにコード内容を変えなくてはいけない構造化データーでは、使えません。
(Luxeritasなど一部テーマではページごとにヘッダーへの追加コード設置ができる機能がありますので、そのようなテーマをご利用の場合は、ここで紹介している方法は必要ありません)
そこで、カスタムフィールドを利用してヘッダーに構造化データーを埋め込みます。
具体的には
1)Custom Field Templateというプラグインをインストールする
2)header.phpに特殊なコードを追加して、カスタムフィールドの内容をヘッダー部分に埋め込みをする
3)各ページのカスタムフィールドに構造化データを書き込む
4)ヘッダー部に構造化データーが埋め込まれる
といった手順です。
この詳しい方法は以下のブログに載っていますので、ぜひご活用ください。
特定ページのヘッダーにだけコードを追加する方法|iscle
まとめ
ということで、みなさん、頑張って構造化データーを設置してみてください。
ちなみに私は、先日FAQ構造化データを設置してみましたが5日間経った今でも検索結果に反映されていません。
なかなか難しいようです