技術

構造化データとは？SEOへの影響とメリット、実装方法を徹底解説

Ogata
2024.06.26

構造化データは、検索エンジンがウェブページの内容を正確に理解できるようにするための重要な技術です。適切に実装することで、検索結果にリッチリザルトが表示されやすくなり、ユーザーにとって価値のある情報を提供することができます。これにより、SEO効果を高め、クリック率（CTR）を向上させる期待が高まります。

本記事では、構造化データの定義やメリット、具体的なマークアップ方法、そして設定の確認方法までを詳しく解説します。初心者の方にも分かりやすく説明しますので、ぜひ参考にしてみてください。

構造化データとは

構造化データとは、ウェブページの情報を検索エンジン（Google、Yahoo!、Bingなど）が正確に理解できるように、特定の形式で記述されたデータのことです。構造化データを記述することは「構造化マークアップ」と呼ばれます。

人間は文字の意味を理解できますが、検索エンジンは文字を単なる「文字列」として認識します。たとえば、以下のようなHTMLで記述されたウェブページがあるとします。

<h1>サンプル株式会社</h1>
<p>ITコンサルティングを行う会社です。</p>
<p>URL：https://www.example.com</p>

私たちはこれを見て、会社名や説明文、ウェブサイトのURLが書かれていることを理解できますが、検索エンジンのクローラーにとっては単なる文字の羅列に過ぎません。

このように、人間には直感的に理解できるテキスト情報も、検索エンジンにとっては解釈が難しいのです。そこで、テキストに意味や背景情報を付加する構造化データが用いられます。構造化データを活用することで、検索エンジンが情報を理解しやすくなり、ウェブページの内容を正確に伝えることが可能になります。

たとえば、以下のように構造化データをHTMLに記述することで、検索エンジンに「このページではサンプル株式会社という組織に関する各種情報を提供している」ということを伝えることができます。

セマンティックウェブの考え方に基づいている

構造化データは、「セマンティックウェブ」の概念を実現するための重要な要素です。セマンティックウェブとは、W3C（ウェブ技術の標準化を推進する非営利団体）の創設者であるティム・バーナーズ＝リーによって提唱されたプロジェクトで、ウェブ上の情報をコンピュータが自動的に解釈できるようにすることを目的としています。

前述の通り、検索エンジンは文字列を読み取ることはできますが、その意味を理解することは難しいとされています。そのため、コンピュータが自動的に情報を解析できるように、データに意味（セマンティック）を付与する必要があります。

そこで、構造化データという技術が役立ちます。これを活用することで、コンピュータがウェブページの内容を理解し、会社名や説明文、ウェブサイトのURLなど、さまざまな情報を識別できるようになります。結果として、検索エンジンの精度が向上し、ユーザはウェブページの情報をよりスムーズに利用できるようになります。

構造化データのメリット

構造化データをウェブページに実装することで、さまざまなメリットが得られます。以下に、構造化データを活用することによって得られる具体的な利点について詳しく説明します。

メリット1：検索エンジンがページの内容を深く理解できる

構造化データを使用することで、検索エンジンはウェブページの内容をより深く理解し、具体的な情報を正確に把握できます。たとえば、ページが特定の製品、イベント、レビューなどを扱っている場合、その詳細を検索エンジンが認識できるようになります。

さらに、ページの内容が適切に分類されることで、検索エンジンはそのページを効率的にインデックス化できます。これにより、新しいコンテンツや更新されたコンテンツが迅速に検索結果に反映されるようになります。

メリット2：検索結果にリッチリザルトが表示されやすくなる

構造化データを使用することで、Googleの検索結果にリッチリザルトが表示されやすくなります。リッチリザルトとは、通常の検索結果よりも視覚的に目立つ情報を表示する機能です。さまざまな形式がありますが、たとえば以下のような例があります。

パンくずリスト（サイトの階層構造）

製品（価格、在庫状況、レビューなど）

レシピ（調理時間、評価、レビューなど）

リッチリザルトが表示されることで、ユーザーは検索結果ページ上でより多くの情報を得ることができ、クリック率（CTR）の向上が期待できます。

メリット3：SEO効果の向上が期待できる

構造化データそのものが直接的なSEO効果をもたらすわけではありませんが、間接的にSEOに良い影響を与えることがあります。

構造化データを導入することで、検索エンジンはページの内容をより深く理解し、適切にインデックス化することができます。また、リッチリザルトの表示が増えることで、検索結果ページでの視認性が高まり、クリック率が上昇し、結果としてオーガニックトラフィックの増加が期待できます。これらの要因が総合的に作用し、検索エンジンのランキングに良い影響を与える傾向があります。

構造化データの基本要素

構造化データを理解するためには、その構成要素である「ボキャブラリー」と「シンタックス」の役割を把握することが重要です。これらの基本要素を理解することで、実際のマークアップ作業がスムーズに進み、正確なデータを提供することができます。

ボキャブラリー

ボキャブラリーとは、ウェブページ内の特定の情報が何を意味するのかを定義するための規格です。構造化データとして記述できる情報は、ボキャブラリーに定義されている項目に限られるため、ページ内のすべての情報が構造化データとして記述できるわけではありません。

たとえば、記事のタイトルなら「headline」、公開日なら「datePublished」を使用して、それが記事のタイトルや公開日に関する情報であることを検索エンジンに伝えます。

代表的なボキャブラリーとしては、Google、Yahoo!、Microsoftが策定した「Schema.org」があります。Schema.orgは、さまざまなエンティティ（人物、場所、物、イベントなど）に関する詳細なスキーマを提供しており、これに基づいて情報を記述することで、検索エンジンがページの内容を正確に理解できるようになります。

Googleでは、主にSchema.orgのボキャブラリーが使用されているため、HTMLにマークアップする際には、この規格を確認しておくと良いでしょう。

シンタックス

シンタックスとは、構造化データを記述するための形式やルールのことです。構造化データは、特定のフォーマットに従って記述する必要があり、これにより検索エンジンが情報を理解することができます。主なシンタックスには、JSON-LD、Microdata、RDFaの3つがあります。

JSON-LD：JSON形式でデータを記述する方法で、Googleが推奨している形式です。
Microdata：HTMLタグに直接属性を追加して構造化データを記述する方法です。
RDFa：HTMLタグに属性を追加して構造化データを記述する方法で、特に複雑なデータモデルやリンクデータを扱う場合に適しています。

これらのシンタックスについての具体的なマークアップ方法は、次のセクションで詳しく説明します。

構造化データのマークアップ方法

構造化データを適切にマークアップすることで、検索エンジンがウェブページの内容を正しく理解できるようになります。以下に、一般的な構造化データのマークアップ方法を説明します。

方法1：JSON-LD形式

JSON-LD（JavaScript Object Notation for Linked Data）は、構造化データの記述方法としてGoogleが推奨している形式です。スクリプトタグ内にJSON形式でデータを記述し、HTMLのヘッダーまたはボディに埋め込みます。以下は、パンくずリストをJSON-LD形式でマークアップする例です。

<script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
      {
        "@type": "ListItem",
        "position": 1,
        "name": "ホーム",
        "item": "https://example.com/"
      },
      {
        "@type": "ListItem",
        "position": 2,
        "name": "カテゴリ",
        "item": "https://example.com/category"
      },
      {
        "@type": "ListItem",
        "position": 3,
        "name": "サブカテゴリ",
        "item": "https://example.com/category/subcategory"
      },
      {
        "@type": "ListItem",
        "position": 4,
        "name": "商品ページ",
        "item": "https://example.com/category/subcategory/product"
      }
    ]
  }
</script>

方法2：Microdata形式

Microdataは、HTMLタグに直接属性を追加して構造化データを記述する方法です。以下は、パンくずリストをMicrodata形式でマークアップする例です。

<ol itemscope itemtype="https://schema.org/BreadcrumbList">
  <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/">
      <span itemprop="name">ホーム</span>
    </a>
    <meta itemprop="position" content="1">
  </li>
  <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/category">
      <span itemprop="name">カテゴリ</span>
    </a>
    <meta itemprop="position" content="2">
  </li>
  <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/category/subcategory">
      <span itemprop="name">サブカテゴリ</span>
    </a>
    <meta itemprop="position" content="3">
  </li>
  <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a itemprop="item" href="https://example.com/category/subcategory/product">
      <span itemprop="name">商品ページ</span>
    </a>
    <meta itemprop="position" content="4">
  </li>
</ol>

方法3：RDFa形式

RDFa（Resource Description Framework in Attributes）もMicrodataと同様に、HTMLタグに属性を追加して構造化データを記述する方法です。特に複雑なデータモデルやリンクデータを扱う場合に適しています。以下は、パンくずリストをRDFa形式でマークアップする例です。

<ol vocab="https://schema.org/" typeof="BreadcrumbList">
  <li property="itemListElement" typeof="ListItem">
    <a property="item" href="https://example.com/">
      <span property="name">ホーム</span>
    </a>
    <meta property="position" content="1">
  </li>
  <li property="itemListElement" typeof="ListItem">
    <a property="item" href="https://example.com/category">
      <span property="name">カテゴリ</span>
    </a>
    <meta property="position" content="2">
  </li>
  <li property="itemListElement" typeof="ListItem">
    <a property="item" href="https://example.com/category/subcategory">
      <span property="name">サブカテゴリ</span>
    </a>
    <meta property="position" content="3">
  </li>
  <li property="itemListElement" typeof="ListItem">
    <a property="item" href="https://example.com/category/subcategory/product">
      <span property="name">商品ページ</span>
    </a>
    <meta property="position" content="4">
  </li>
</ol>

マークアップ支援ツールについて

構造化データを簡単に追加するために、Googleの「構造化データマークアップ支援ツール」を使用すると便利です。このツールを使うことで、初心者でも手軽に構造化データを生成できます。以下に、具体的な設定の流れを紹介します。

手順1）データタイプを選択し、マークアップしたいページのURLを入力します。ローカルファイルや未公開のページをマークアップする場合は、HTMLソースを直接貼り付けてください。その後、「タグ付けを開始」ボタンを押します。

手順2）指定したURLまたはHTMLソースが読み込まれ、そのページのプレビューが表示されます。設定したい要素を選択してハイライトし、リストから適切なデータタイプを指定します。すべての要素を設定し終えたら、「HTMLを作成」ボタンをクリックします。

手順3）生成されたHTMLコードをコピーし、ウェブページのHTMLソースに貼り付けて完了です。

熟練のエンジニアには手動で十分かもしれませんが、初心者にとってはこのツールが作業をスムーズにするでしょう。ツールを活用して、効率的に構造化データを実装してみてください。

構造化データの確認方法

構造化データを正しく実装した後、そのデータが期待通りに機能しているかを確認することが非常に重要です。誤った実装は検索エンジンがページの内容を正確に理解する妨げとなり、リッチリザルトが表示されない原因にもなります。

以下に、構造化データの確認方法を紹介します。

方法1：リッチリザルトテストを使用する

Googleのリッチリザルトテストは、構造化データが正しく実装されているかどうかを確認するための便利なツールです。このツールを使用して、構造化データがどのように検索結果に表示されるかをプレビューできます。

手順1）テストしたいページのURLを入力し、「URLをテスト」ボタンをクリックします。HTMLコードを貼り付ける場合は、ページ上部の「コード」タブをクリックし、テキストエリアにHTMLコードを貼り付けて、「コードをテスト」ボタンをクリックします。

手順2）テストが実行されると、ページ内で検出された構造化データが一覧表示されます。詳細を確認したい構造化データをクリックします。

手順3）詳細なテスト結果が表示されます。エラーや警告が表示された場合、その指示に従って修正してください。

方法2：スキーママークアップ検証ツールを使用する

スキーママークアップ検証ツールも、構造化データをテストするためのツールです。

先ほどのリッチリザルトテストツールは、構造化データがリッチリザルトとして表示されるかどうかを検証します。一方、スキーママークアップ検証ツールは、リッチリザルト対象でない構造化データも含め、すべての構造化データがSchema.orgの仕様に従って正しくマークアップされているかを検証しますが、Googleが特定のリッチリザルト要件に合致しているかどうかの検証は行いません。

手順1）テストしたいページのURLを入力し、「テストを実行」ボタンをクリックします。HTMLコードを貼り付ける場合は、「コードスニペット」タブをクリックし、テキストエリアにHTMLコードを貼り付けて、「テストを実行」ボタンをクリックします。