こんにちは、西尾です。
検索エンジンでサイト集客する上で重要なポイントの一つにスニペットがあります。
大手グルメ口コミサイトの食べログを例に見てみましょう。
ユーザーが、検索結果を見て自分の求める商品、情報があるかないかの判断材料になりますので、スニペットを最適化することはサイトの集客力(クリック率)向上に寄与すると考えられます。
次にこちらの画像をご覧下さい。
アプリの評価がスニペット上に目立つ形式で掲載されています。
こちらの検索結果画面ですと最上位にリスティング広告が見受けられますが、赤枠で囲まれた上こちらのスニペットの方が目を引きますね。
リッチスニペットは通常のスニペットと両立して表示できれば集客力の向上が期待できます。
通常のスニペットは、meta descriptionタグにスニペットに表示ない情報ある程度、能動的にコントロールできますが、
このリッチスニペットを表示するためには構造化データというコードをサイト内に記述する必要があります。
そこで今回は、リッチスニペットの表示を目的とした構造化データの記述方法について解説していきます。
目次
構造化データとは
構造化データは、Googleのロボットが理解しやすいように言葉に対しての意味を付加するためのデータです。
当ブログでは下記のように構造化データを記述しています。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
function(){ <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "Webpage", "name": "アクシス集客ブログ", "url": "http://axis-blog.com", "provider":{ "@type": "Organization", "name": "株式会社アクシス", "member": [{ "@type": "Person", "name": "平岡謙一" }, { "@type": "Person", "name": "落合隆文" }, { "@type": "Person", "name": "西尾和晃" }, { "@type": "Person", "name": "宇野一成" }, { "@type": "Person", "name": "山田尚明" }, { "@type": "Person", "name": "松井南人" }] } } </script> |
下記の3行に着目してしてみましょう。
|
|
"@type": "Webpage", "name": "アクシス集客ブログ", "url": "http://axis-blog.com", |
この構造化データではこちらのWebサイトは「アクシス集客ブログ」であり、URLは「http://axis-blog.com」であると情報付加しています。
ロボットは「1+1=2」のような数式で算出できる内容は人間よりも早く理解できますが、「アクシスブログのURL=http://axis-blog.com」であったり、「黄色の看板の牛丼屋＝吉野家」のような情報の処理は理解は苦手です。
そのため、構造化データのようなメタデータを提供してロボットに学習させてあげることで、ロボットはユーザーにとって使いやすい検索結果を提供してくれるような仕組みになっています。
構造化データが付与されたサイトはGoogleのロボットにとってやさしいサイトであると言えるでしょう。
具体的な記述方法
具体的な構造化データの記述方法について説明していきます。記述方法は複数あるのですが、今回は最もポピュラーなschema.orgと呼ばれるルールに従ってJSON-LDという記述方法をご紹介します。
リッチスニペットに表示な必要最低限の構造化データが下記になります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<script type="application/ld+json"> { "@type": "Webpage", "name": "サイト名", "url": "サイトのURL", "provider":{ "@type": "Organization", "name": "サイト運営者の名前", "review": { "author": "レビュワーの名前", "reviewRating": { "worstRating": "レビュー最低点", "ratingValue": "レビュワーがつけた点数", "bestRating": "レビュー最高点" } } } } } </script> |
ここで、「name」や「url」など:(セミコロン)の左側を「キー」と呼びロボットに伝える事柄を記述します。
一方で、右側に「バリュー」と呼び、「キー」の具体的な内容を記述します。
schema.orgをJSON-LDで記述する場合最初の3行か下記のようになります。
|
|
<script type="application/ld+json"> { "@context": "http://schema.org", |
また、最後の2行は下記のようになります。この前後5行はこのような形式と割り切って下さい。
次に具体的に各キーに対してバリューを入れた例がこちらになります。
|
|
"@type": "Webpage", "name": "太郎のサイト", "url": "http://tarou.com", "provider":{ "@type": "Organization", "name": "太郎", "review": { "author": "花子", "reviewRating": { "worstRating": "0", "ratingValue": "3.5", "bestRating": "5" } } } } |
ここでは
・サイト「太郎のサイト」のURLは「http://tarou.com」である
・サイト「太郎のサイト」の主催者は「太郎」である
・サイト「太郎のサイト」に対して、レビュワー「花子」は5満点中(最低0点)、3.5点と評価した
ことを構造化データで定義しています。
この構造化データをGoogleのロボットが読み取り、リッチスニペットに反映させます。
構造化データをサイトに入れる方法
構造化データはサイトのHTMLに直接記述しても大丈夫ですが、タグマネージャを導入済のサイトであればタグマネージャを介して記述することも可能です。
Google Tag Manager
まず①から「タグ」→「新規」を選択して、プロダクトから「カスタムHTMLタグ」を選択すると②に「カスタムHTMLタグ」が表示されますので、、③でわかりやすい名前(例では、「構造化データ」)をつけ、④にJSON-LDを記述します。
その後、⑤にて適切なトリガー(例では全てのページ)を選択してタグを保存します。最後に公開を忘れないようにしましょう。
構造化データ作成ツールのご紹介
構造化データの記述法には少しクセがあり、HTMLのコーディングになれた方にも少し難しいかもしれません。
そこで、リッチスニペットを表示する上、必要最小限の構造化データを自動生成するツールをご用意しました。
あくまで必要な最低限の構造化データを生成するだけですので、実際にサイトに格納するよりは
構造化データの記述法をご理解頂くためのテストツールとしてご活用いただければと思います。
また、記述した構造化データの記述が確認できるツールをGoogleが用意してくれていますのでサイトにスニペットを入れたら正しく記述できているか確認してみることをおすすめします。
構造化データテストツール
おわりに
如何でしたでしょうか。
構造化データを記述したとしてもリッチスニペットが表示されるか否かはGoogleが判断するため、
記述後にすぐリッチスニペットが表示されるわけではありませんが、一度表示されれば集客力に貢献することは一目瞭然です。
地道なサイトの最適化が検索エンジン上での上位表示に繋がるように、同様に地道な構造化データの最適化が、将来的に大きな収益を生む可能性を秘めています。
(2016年現在、構造化データを付与しても直接検索エンジンの上位表示に寄与するわけでは御座いませんのでその点は留意してください。)
また他にも沢山のキーがあり、詳しくはschema.orgの公式サイト(英語)で確認することができます。
schema.org公式サイト
よろしければあなたのサイトにも構造化データを、記述してみてください。
