バズログ BUZZLOG

MENU

2019-10-11SEO

【初心者大歓迎】構造化データマークアップとは?2つの方法とSEO効果

かまとりーぬ 5

目次

構造化データマークアップとは?

構造化データマークアップとは何だろうとお悩みではないでしょうか。

構造化データマークアップとは、Googleの検索エンジンにページの内容を理解してもらうために行うマークアップ方法です。ページを構造化データマークアップすることで、様々な要素を認識してくれるようになります。

そんな構造化データマークアップについて、今回は基礎から詳しく紹介していきましょう。構造化データマークアップの方法についても解説します。ぜひ参考にしてみてください。

1:構造化データマークアップ!2つの基本的な目的

構造化データマークアップとは何だろう?

構造化データマークアップと聞いただけで、なんだか難しそうなイメージを抱いていませんか。構造化データマークアップはツールを使えば、かんたんに行うことが出来ます。Webサイトを管理しているのであれば、構造化データマークアップは行うべきです。そんな構造化データマップは、なぜ必要なのか・・・目的は2つあります。

  • 検索エンジンに内容を理解してもらうため
  • 検索結果で表示してもらうため

構造化データマークアップは、主に上記2つの目的から設定しておくべきです。

上記2つの理由について詳しく解説していきましょう。

1-1:検索エンジンに内容を理解してもらうため

構造化データマークアップの1つ目の目的は、検索エンジンに内容を理解してもらうためです。

検索エンジンのロボットはページに書かれているテキストを人間の様に理解することができません。

例えば、以下のテキストをご覧ください。

  1. <div>
  2. 会社名:バズったー
  3. 電話番号:03-5720-5273
  4. </div>

上記のテキストを見た時、わたしたち人間であれば社名と電話番号が書かれていると理解することが出来ます。

しかし検索エンジンのロボットは、テキストということは理解できるが意味までは理解することが出来ていないのです。そこで構造化データマークアップを行うことで「これは名前」「これは住所」「これは電話番号」という様に、テキストの意味を教えてあげることができます。

上記のテキストを、構造化データマークアップすると下記のように記述することが可能です。

  1. <script type=”application/ld+json”>
  2. {
  3.   “@context” : “http://schema.org”,
  4.   “@type” : “Corporation”,
  5.   “name” : “バズったー”,
  6.   “telephone” : “03-5720-5273”
  7. }
  8. </script>

構造化データのマークアップ方法については、後ほど詳しく紹介します。

上記のように名前にはname、電話番号にはtelephoneとマークアップすることにより検索エンジンはテキストの意味を理解することが可能です。

1-2:検索結果で表示してもらうため

構造化データマークアップを行う2つ目の目的は、検索結果で表示してもらうためです。

構造化データマークアップを行うことによって、検索エンジンはページの情報を理解することができるようになります。するとその情報を用いて、様々な要素を検索結果に表示することができるようになるのです。

検索結果で、評価・動画・スケジュールなどが表示されているのをみたことはありませんか?

それらはリッチスニペットと呼ばれ、ページ内に情報を構造化データマークアップすることで検索結果に表示される様になるのです。

Google 検索結果

検索結果に、他のWebサイトとは違う要素が表示されていればユーザーの目を惹くことができます。

検索結果により有益な情報を載せるためにも、構造化データマークアップは必要と言えるでしょう。

関連記事:【初心者向け】リッチスニペットでCTRを上げる!注意点と設定手順を紹介

2:マークアップ前に学ぶ!ボキャブラリーとシンタックス

構造化データマークアップの方法が知りたい!

構造化データマークアップを行うためには、ボキャブラリーとシンタックスという2つの言葉を理解しておく必要があります。構造化データをマークアップする上で重要なポイントとなるので、しっかり学んでいきましょう。2つの言葉について、簡潔にまずは紹介します。

  • ボキャブラリー:値を表す言語、値を定義している規格にようなもの
  • シンタックス:ボキャブラリーの記述方法、フォーマットのようなもの

それぞれ2つの言葉は何を用いるかで、構造化データマークアップ方法も変わってくるので理解しておきましょう。それぞれのおすすめをお伝えしておくと、ボキャブラリーは「Schema.org」シンタックスは「JSON-LD」がおすすめです。上記2つの言葉について、詳しく紹介していきましょう。

2-1:ボキャブラリー

ボキャブラリーとは、構造化データをマークアップする上で「名前」や「電話番号」などに”name” “telephone”という値を付けることを指します。

  1. <script type=”application/ld+json”>
  2. {
  3.   “@context” : “http://schema.org”,
  4.   “@type” : “Corporation”,
  5.   “name” : “バズったー”,
  6.   “telephone” : “03-5720-5273”
  7. }
  8. </script>

 

構造化データマークアップは、どの様な値で記述しても良いというわけでは無いのです。検索エンジンが認識することのできる、ボキャブラリーで記述する必要があります。

ボキャブラリーの種類の中で、代表的かつ有名なものが「Schema.org」です。

schema.org

Schema.orgは、Google・Yahoo!・Microsoftの大手検索エンジンが共同で取り組んでいる規格になります。構造化データマークアップを行う場合には、Schema.orgのボキャブラリーを使って記述してみましょう。

Schema.orgの公式サイトを見る

2-2:シンタックス

シンタックスとは、ボキャブラリーで指定した値をどの様なフォーマットでマークアップするのか仕様を決める必要があります。その仕様(フォーマット)というのがシンタックスです。

Googleの検索エンジンが認識することのできるシンタックスは3つあります。

  • JSON-LD
  • microdate
  • RDFa

上記3つの中でもおすすめなのが、JSON-LDです。

近年、GoogleからJSON-LDが推奨されており最も使用しやすいシンタックスと言えるでしょう。JSON-LDで作成したHTML(構造化データ)は、各ページに直接マークアップする必要がありません。HTMLのどこに記述しても反映される仕様なので、管理しやすいシンタックスなのです。

今回、ボキャブラリーはSchema.org、シンタックスはJSON-LDの仕様で行う構造化データマークアップ方法について紹介していきましょう。

3:構造化データマークアップ2つの方法

構造化データのマークアップ方法は、主に2つあります。

  • HTMLを直接記述する方法
  • データハイライターを使用する方法

上記2つの方法がありますが、かんたんなのはデータハイライターを使用する方法でしょう。
しかし何を構造化データマークアップするかにより、使用すべき方法が異なります。

データハイライターでマークアップできるサービスは9つのみです。

  • 記事
  • イベント
  • 商品
  • レストラン
  • 映画
  • テレビ番組のエピソード
  • 地域のお店やサービス
  • ソフトウェア アプリケーション
  • 書籍

上記9つのサービスに該当しない場合には、HTMLを直接記述する方法を用いるようにしましょう。

2つの構造化データマークアップ方法について詳しく紹介していきます。

3-1:HTMLを直接記述する方法

HTMLを直接記述する方法について紹介していきましょう。

Schema.orgのボキャブラリーを参照しながら、マークアップしたいテキストをJSON-LDのフォーマットで構造化データマークアップしていきます。まず初めに構造化データマークアップのルールを把握しておきましょう。

下記のコードをご覧ください。

  1. <script type=”application/ld+json”>
  2. {
  3.   “@context” : “http://schema.org”,
  4.   “@type” : “Corporation”,
  5.   “name” : “バズったー”,
  6.   “telephone” : “03-5720-5273”
  7. }
  8. </script>

各要素について紹介していきます。

<script type=”application/ld+json”>
JSON-LDでマークアップする際に必ず必要な記述です。
“@context” : “http://schema.org”
Schema.orgで記述していることを宣言するための記述で、必らず<script type=”application/ld+json”>とセットで記述しておきましょう。
“@type” : “Corporation”
@typeで何について表現しているのかを記述します。
“name” : “バズったー”
@typeで指定したバリューを表現するためのキーを指定しています。
キーはnameで値は「バズったー」です。キーはバリューに紐づいています。
上記のことを理解したら、早速マークアップしていきましょう。

バズったーの会社情報を、マークアップしていきます。

  1. <div>会社名:株式会社バズったー</div>
  2. <div>設立:2017年9月1日</div>
  3. <div>所在地:〒153-0061 東京都目黒区中目黒FSビル5階</div>
  4. <div>電話番号:03-5720-5273</div>
  5. <div>代表取締役:土肥 大夢</div>
  6. <div>公式サイト:https://buzztter.co.jp</div>

構造化データマークアップしたHTMLが以下になります。

  1. <script type=”application/ld+json”>
  2. {
  3. “@context”: “http://schema.org”,
  4. “@type”: “Corporation”,
  5. “name”: “株式会社バズったー”,
  6. “founder”: “土肥 大夢”,
  7. “foundingDate”: “2017年9月1日”,
  8. “url”: “https://buzztter.co.jp/”,
  9. “contactPoint”: {
  10.  “@type”: “ContactPoint”,
  11.       “telephone”: “+813-5720-5273”,
  12.       “contactType”: “customer support”,
  13.       “areaServed”: “JP”
  14.     },
  15. “address”: {
  16.     “@type”: “PostalAddress”,
  17.     “addressLocality”: “目黒区,東京”,
  18.     “postalCode”: “153-0061”,
  19.     “streetAddress”: “中目黒3-6-2FSビル5階”
  20.   }
  21. } </script>

作成した構造化データマークアップは、HTML内に追記して保存しておくことでマークアップは完了です。

3-2:データハイライターを使用する方法

Googleのウェブマスターツールのデータハイライターを用いた、構造化データマークアップ方法を紹介していきます。データハイライターを使えば、直接的にHTMLを触る必要なくマークアップしていくことが可能です。

さっそくデータハイライターへアクセスし、マークアップしていきましょう。

データハイライターを使う

マークアップするWebサイトを選択

「プロパティを選択してください」を開いて、対象のWebサイトを選択します。

データハイライター

「ハイライト表示を開始」をクリック

データハイライター

構造化データマークアップしたいページのURLとサービス種類を選択

ページURLを入力し、該当するサービス内容を選択したらチェックボックスにチェックを入れましょう。

  • ①このページをタグ付けし、他のページも同様にタグ付けする
  • ②このページだけをタグ付けする

①はマークアップしたページと同様のページにも構造化データを認識させるという内容になります。ブログなどのコンテンツは、フォーマットが同じなので①と選択すると良いでしょう。そうでない場合は②を選びます。

データハイライター

マークアップした箇所を選択して「意味」を選択する

データハイライター

マークアップ作業が終わったら「完了」をクリック

データハイライター

「ページセットを作成」クリック

Google側が自動的に似ているページを表示します。

表示されたすべてのページにマークアップを施すのか、カスタムするのかを選んで「ページセットを作成」をクリックしましょう。

データハイライター

自動検出されたページへのマークアップに誤りがないか確認し「次へ」クリック

データハイライター

間違いが無ければ「完了」をクリック

データハイライター

きちんとマークアップされていることを確認し「公開」をクリック

データハイライター

以上がデータハイライターを使用したマークアップ方法です。

選択していくだけで簡単に行うことが出来るので、データハイライターを使用することのできるサービスであればデータハイライターを使うと良いでしょう。

4:構造化データマークアップする2つのメリット

構造化データマークアップを行うことで何かメリットは得ることができるのか?

構造化データマークアップでWebサイトの運営者側が得ることのできるメリットは2つあります。

メリットを理解して、構造化データを使ってみましょう。

  • コンテンツ内容を適切に伝えることができる
  • リッチスニペットを検索結果に表示できる

上記2つのメリットについて詳しく紹介していきます。

4-1:コンテンツ内容を適切に伝えることができる

1つ目のメリットは、コンテンツ内容を適切に伝えることができるという点です。構造化データをマークアップすることで、検索エンジンがコンテンツの内容を理解することが出来る様になります。

構造化データマークアップを行っておけば、いままで認識できていなかった情報を簡単に認識してもらう事ができるようになるのです。

4-2:リッチスニペットを検索結果に表示できる

2つ目のメリットは、リッチスニペットを検索結果に表示することができるという点です。

先ほどもお伝えしましたが、構造化データマークアップをすることで検索結果にリッチスニペットを表示させることができるようになります。

リッチスニペットを表示させることにより、通常のテキストだけを表示させているWebサイトより目立たせることが可能です。目につきやすくなるので、検索結果からトラフィックを獲得しやすくなるでしょう。

5:SEO効果は無い?構造化データマークアップの実態

構造化データマークアップを行うことで、SEO効果は得ることが出来るのか?

SEO対策をしているWebサイトの運営者であれば、一番気になるポイントですよね。

結論からお伝えすると、構造化データマークアップにはSEO効果が無いとされています。

構造化データマークアップは、検索順位を決定する指標には使用されていないからです。そのためSEO効果を直接的に与えることは出来ず、検索順位に影響しません。しかし、構造化データマークアップはコンテンツの内容を検索エンジンに的確に伝えることができます。Google自体もコンテンツの内容を理解するための補助として構造化データを使用しているので、今後ランキング決定要素に含まれる可能性もあるのです。

何よりコンテンツの内容を適切に伝え、リッチスニペットを検索結果に表示できる可能性があるという特徴だけでも大きなメリットを感じることが出来るでしょう。

構造化データは今のうちにマークアップしておくことをおすすめします。

6:マークアップを補助する!2つの便利ツール

構造化データをマークアップする際に、使える便利なツールが知りたい。

上記のようにお考えであれば、便利な2つのツールを活用してみましょう。

  • 構造化データマークアップ支援ツール
  • Google構造化データテストツール

上記2つはどちらもGoogleが提供し、無料で利用することのできるツールです。

構造化データマークアップ時には欠かせないツールとも言えるので、ぜひチェックしておきましょう。

6-1:構造化データマークアップ支援ツール

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

1つ目のツールは「構造化データマークアップ支援ツール」です。

構造化データをマークアップしたいURLもしくはHTMLを入力し、マークアップしたい箇所を選択すると自動でマークアップしたHTMLを表示してくれます。

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

マークアップが難しいとお悩みであれば、構造化データマークアップ支援ツールを用いてマークアップをしてみましょう。

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

6-2:Google構造化データテストツール

Google構造化データテストツール

2つ目のツールは、Google構造化データテストツールです。

構造化データテストツールは、マークアップした構造化データをHTMLでWebサイトに張り付ける前に必ず使用するようにしましょう。正しくマークアップされていない箇所は無いか、エラーをチェックすることが出来ます。コードを張り付け「テストを実行」をクリックしてみましょう。

Google構造化データテストツール

チェックは直ぐに行うことが出来ます。下記画像のように「エラーなし」と表示されていれば、正しくマークアップされていると確認することが可能です。

Google構造化データテストツール

URLを入れてチェックすることも出来るので、既にマークアップしたページの確認に使用することも出来ます。ぜひ活用してみてください。

Google構造化データテストツールを使う

まとめ

構造化データマークアップについて詳しく紹介してきました。

構造化データをマークアップすることで、ページ内のテキストの意味を検索エンジンに明確に伝えることができるようになるのです。

また検索結果ではリッチスニペットを表示できる可能性があり、ユーザーの目につきやすくすることが出来ます。ぜひ構造化データをマークアップし、Googleへコンテンツの内容を的確に伝えられる様にしましょう。

  • このエントリーをはてなブックマークに追加

  • 5

    • このエントリーをはてなブックマークに追加
    目次

    関連記事

    ページ上部へ