Webサイト構造化のイメージ

【初心者必見!】構造化データの基本からSEOとの関係性、実装方法まで徹底解説!

Webサイト構造化のイメージ

SEOに効果があるとされている技術は様々なものが存在します。構造化データもSEOに効果があると言われている技術の1つです。しかし、実際のところはどうなのでしょうか。意味のないSEO対策をしても、時間の無駄になるだけです。

そこで今回の記事では、構造化データとSEOとの関係について、概要や仕組み、実装方法を具体的に見ていくことでその効果を明らかにしていきます。日本で使用されている検索エンジンはほぼGoogleなので、構造化データについてもGoogleの仕様をもとにまとめていきます。

構造化データの仕組みとは

プログラミングのイメージ

まずは構造化データの仕組みから見ていきましょう。

構造化データの概要

Googleでは、ページのコンテンツは何についてのものなのかを正確に把握するために、構造化データというものを用意しています。ページについての情報をGoogleに向けて提供し、ページコンテンツを正確に分類してもらいやすくすることができます。(例えば、材料や加熱時間、カロリーなど。)

要するに、Webページの内容を検索エンジンにわかりやすく伝えるためのものが構造化データです。そして、この構造化データはセマンティック・ウェブという、Web業界にには古くからある考えのもとにあります。

セマンティック・ウェブとは
“セマンティック・ウェブ(英: semantic web)は W3C のティム・バーナーズ=リーによって提唱された、ウェブページの意味を扱うことを可能とする標準やツール群の開発によってワールド・ワイド・ウェブ[1]の利便性を向上させるプロジェクト。セマンティック・ウェブの目的はウェブページの閲覧という行為に、データの交換の側面に加えて意味の疎通を付け加えることにある。”(引用元:セマンティック・ウェブ – Wikipedia

つまり、ロボットにもWebページが何を意味しているものなのか、わかるようにしましょうということです。

具体的なイメージとしては、例えばある会社についてのWebページを通信する際に、

  • 会社名:〇〇
  • 代表:△△
  • 住所:×××

というように、情報を整理してロボットに伝えるようなイメージです。

構造化データのボキャブラリーとシンタックス

構造化データはボキャブラリーとシンタックスというものを用いて実装していきます。順に説明していきます。

ボキャブラリーとは

ボキャブラリーとは、直訳すると「単語」という意味になりますが、ここでいうボキャブラリーはどちらかというと単語の集合体、データ構造の集合体というようなイメージです。下記URLを見ると、ボキャブラリーのイメージが掴めるのではないかと思います。

Book – schema.org Type

構造化データで利用するボキャブラリーは、上記で挙げたschema.org、data-vocabulary.orgの2種類があります。Google 検索では、schema.orgの仕様がメインで利用されています。そのため、現在の構造化データで利用するボキャブラリーはschema.orgでほぼ問題ないです。ただし、一点注意点があります。schema.orgドキュメントに記載されているもののうち、Google検索では必須ではないものもあります。Googleはdevelopers.google.comのドキュメントを利用して実装するように推奨しているので、その点のみ注意が必要です。

シンタックスとは

シンタックスとは、ロボットに構造化データを正しく伝えるための記述法式のことです。Google検索で利用できる構造化データのシンタックスはJSON-LD、RDFa、microdataの3種類があります。

JSON-LD
ページの見出しや本文の<script>タグ内に埋め込まれる JavaScript 表記の事です。

JSON-LD
※画像引用元:構造化データの仕組みについて

microdata
オープン コミュニティの HTML 仕様。HTML タグ属性を使用して、構造化データとして公開するプロパティに名前を付けます。

microdata
※画像引用元:HTML Microdata

RDFa
HTML タグ属性を追加することによってリンクデータをサポートする HTML5 の拡張機能です。

RDFa

※画像引用元:海外SEO情報

これら3種類のうち、Google検索ではJSON-LDが推奨されています。ただし、JSON-LDで実装する場合は、注意点があります。

ブログ記事について構造化データを実装する場合、articleBody(記事本文)のプロパティにはHTMLで表記した記事本文をもう一度記述することになります。そのため、記事本文の更新をした際に、構造化データの更新を忘れ、記事本文と構造化データで差異が生じることになります。最悪の場合、Googleから悪質なリッチスニペット対策として判断され、ペナルティを受ける可能性もあります。

また、構造化データは必ず、ガイドラインに準拠する必要があります。準拠しない構造化データは、Google 検索でリッチリザルトとして表示されない場合があります。※リッチリザルトについては後述します。

構造化データを利用するメリット

ブロックを積み上げる

構造化データを利用し、Google検索エンジンにコンテンツ情報を正しく伝えるメリットは以下の2点があります。

リッチリザルトが表示できる

まずひとつは、リッチリザルトが表示できるという点です。リッチリザルトについて説明します。下記は「トランプ大統領」と検索した結果です。

「トランプ大統領」と検索した結果

上の画像のように、通常の検索結果と比べて、コンテンツの表示形式が多様な検索結果になることをリッチリザルトと呼びます。この表示形式はカルーセルやパンくずリスト、質問と回答形式などいくつかの種類があります。

ページ内コンテンツがナレッジグラフに表示される

Webページとして用意したコンテンツが、ナレッジグラフとして、表示されることです。

ナレッジグラフとは、Google検索エンジンが、検索キーワードを元に、ユーザーの得体情報を予測して、まとめて表示してくれる機能のことです。先ほどの「トランプ大統領」の検索結果でいうと右側の部分がナレッジグラフにあたります。

リッチリザルトやナレッジグラフとして検索結果に情報が表示されることで、通常の検索結果よりもクリックされやすくなります。クリック率の向上が見込まれると、結果としてWebサイトへの流入増加にも繋がると言ったメリットがあります。

構造化データとSEOの関係性とは

複数の紙人形

構造化データを利用するメリットはご理解いただけたでしょうか。ここでは、構造化データとSEOとの関係性について説明します。

構造化データはSEOの直接的な評価要因にはならない

説明すると言っておきながら、いきなり覆すようですが、Googleのウェブマスター・トレンド・アナリストのジョンミュラー氏は動画で以下のように発言しています。

原文:
you’re marking it up like this that’s really nice of you but we’re not using that to change rankings

和訳:
(原文前半省略)しかし、私たち(google)はそれ(構造化データ)をランキングの変動に利用していません。

上記発言の後半部分からもわかるように、Googleは構造化データを表示ランキングの変動要素としては使用していないことがわかります。GoogleのSEOに関する情報は、ジョンミュラー氏の他、マット・カッツ氏、ゲイリー・イリーズ氏などのスペシャリストがいるので、常に発言をチェックしておくと最新情報をゲットできます。

何も対策しないページよりクローラビリティは向上する

ジョン・ミュラー氏の発言からも、SEOのランキング要素にはなっていないことがわかりますが、だからと言ってSEOに直接的な効果がないわけで、間接的な効果はあります。

例えば、何も対策をしないページよりは、構造化データを実装したページの方が検索ロボットに情報を正しく伝えられていることになります。その結果、クローラビリティが向上して、検索順位に好影響を及ぼす可能性があります。

リッチリザルトによるクリック率の向上

また、先ほども説明しましたが、構造化データの実装によりリッチリザルトが表示され、クリック率の向上に繋がります。

クリック率が向上するということはユーザーにより多く見られる効果があるため、ロボットはユーザーにとって当該コンテンツが重要なものであると判断する可能性が高まります。その結果、検索順位が上がることは十分あり得ます。

構造化データの実装方法

プログラミングする様子

それでは、実際に構造化データを実装する方法を見ていきましょう。実装方法はHTMLファイルに直接マークアップする方法と、ツールを使用してマークアップする方法との2つあります。

HTMLファイルに直接マークアップする方法

WebサイトのHTMLファイルに直接マークアップして行く方法です。今回はJSON-LDで記述した例をあげていきます。

HTMLファイルに直接マークアップする場合も大きく分けると2つのパターンがあります。

  • 通常のHTMLファイルに記述する方法
  • WordPressのテンプレートに記述する方法

まずは、通常のHTMLファイルに実装していく方法を見ていきましょう。

通常のHTMLファイルに記述する方法

1.JSON-LDの構造化データマークアップを宣言する

まずは、JSON-LDを使用して実装していくということを宣言する必要があります。そのためには、構造化データに関する記述を下記タグで囲みます。

<script type=”application/ld+json”>
{

}
</script>

JSON-LDでマークアップしたこれをJSONオブジェクトと呼びます。

2.@context属性を宣言する

{ }の中に、@context属性を宣言します。

下記の例のように、schema.orgであることを記述します。

“@context”: “http://schema.org”,

JavaScriptを学んだことがある人であればわかりますが、:(コロン)の左が側がkey、右側がvalueとなるように記述していきます。

3.@type属性を指定する

次にtype属性について記述します。(Article,Event,JobPostingなど)

Schema Markup Generatorの選択項目を参考に記述するとわかりやすいです。

“@type”: “BlogPosting”,

4.プロパティの指定

あとは、自分の必要とするプロパティを実装していくだけです。

“name”: “ダミーな画像”,

“alternateName”: “ダミーの画像”,

“image”: “http://www.example.com/img/hogehoge.jpg”,

“description”: “ダミーテキストダミーテキスト”,

“creator”: [

{

“@type”: “Person”,

“name”: “Hoge Taro”,

“sameAs”: “https://www.hogehoge.com/”

}

],

※上記の例は画像について構造化したプロパティの例です。

WordPressのテンプレートに記述する

HTMLに記述するのと基本的には同じです。しかし、WordPressの場合、ページごとに自動生成されるもの(ページタイトルやURLなど)があるため、その部分をWordPress用に変更する必要があります。

WordPress用の構造化データ
※画像引用元:【コピペ用】WordPressブログの構造化データ作ってみました(ISO 8601 形式対応)

上記画像のように、valueにWordPressの変数が入ります。

ツールでマークアップする方法

Googleが用意している、「構造化データマークアップ支援ツール」を活用する方法があります。

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

以下、手順を説明します。

  1. はじめに、該当ページのデータタイプを指定します。
  2. 構造化データを実装したいページURLを指定します。
  3. 画面右側にプロパティの種類が出てくるので、画面左側のページ表示部分で選択して、プロパティに当てはめていきます。

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

  4. プロパティの当てはめが完了したら、画面右上の「HTMLを作成」を押します。
  5. 出力されたHTMLソースを該当ページHTMLに挿入して完了です。

操作は画面のクリックのみで進めていけるので、このツールを使用して原型を作り、足りない部分は自身で追加していくというのが無難な方法です。(一から自力で書くとスペルミスが生じる可能性があるため。)

構造化データの確認方法

虫眼鏡を持っているビジネスマン

構造化データの実装中は、構造化データ テストツールを使用して構造化データをテストすることが推奨されています。テンプレートや配信の問題が原因となって、構造化データを導入した後にWebページに異常が発生する可能性があるためです。

また、導入後はリッチリザルトのステータス レポートを使用してページの正常性を確認することも必須です。

Google 検索で拡張表示機能(リッチリザルトなど)を使用し表示できるようにするには、ドキュメントに記載のある必須プロパティをすべて含める必要があります。

推奨プロパティの機能の定義が多いほど、検索結果に拡張表示機能が適用される確率は高くなりますが、その分、精度が落ちてしまうようであれば、少数でも必須のプロパティを確実に提供する方が間違いありません。

そのあたりは、実装するエンジニアと相談して決定するようにしましょう。

まとめ

Webサイト構造化のイメージ

以上、構造化データについて、概要と仕組み、メリットや実装することでのSEO効果、実装方法と検証方法をまとめました。直接的なSEO効果はないですが、リッチリザルトによるクリック率の向上など、流入数の増加には効果が期待できるといえます。ただし、実装方法も仕様が決まっているので、その点だけ注意してミスのないように実装したいところです。

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