構造化データとは？事例やマークアップの方法を解説

2024.03.19

SEO

#CSS #google検索順位 #SEO内部施策

AI要約

ChatGPT4で要約生成中

構造化データのマークアップは、検索エンジンのクローラーにWebページの情報を理解させやすくするために非常に重要です。クローラーがウェブページの情報を適切に理解することにより、SEOにおける評価に良い影響を与えることができます。

本記事では構造化データの基本的な知識について解説し、構造化データを実装する方法も併せて紹介します。

構造化データとは

SEO（Search Engine Optimization）の構造化データは、ウェブページのコンテンツに関する情報を検索エンジンに理解しやすく伝えるための特定の形式やタグを指します。これは主にSchema.orgに基づいており、構造化データマークアップを使用して、ウェブページの内容を解釈しやすくし、検索エンジン結果ページ（SERP）にリッチスニペット（Rich Snippets）を表示するのに役立ちます。

構造化データのSEOへの影響

構造化データはSEOにおいて、ウェブページの内容が検索エンジンにより効果的に理解され、表示されるための重要な要素となっています。また、構造化データの適切な利用は、検索結果の質を向上させ、ユーザーに対してより有益な情報を提供することに繋がるため、SEOにおける上位表示においても効果的な施策です。

まず、構造化データは検索エンジンのクローラーへの情報の明確な伝達を可能にします。ウェブページ上のコンテンツが特定の形式に従ってHTMLにマークアップされることで、検索エンジンはそのコンテンツの構造や意味を容易に理解することができるようになります。たとえば、Organization（組織）の構造化データを用いて企業の基本情報をHTMLにマークアップすることで、クローラーが企業の基本情報を正確に理解し、検索結果に表示することができるようになります。これにより、強調スニペット表示などからユーザーは検索結果上で企業情報を得ることができます。

構造化データの適用は、検索結果ページ（SERPs）においてリッチスニペット（Rich Snippet）を生成することにも繋がります。Product（製品）やReview（レビュー）などの構造化データを使用することで、検索結果に価格、評価などが表示され、ユーザーは効率的に情報収集することができます。これにより、Googleのユーザーエクスペリエンスが向上するだけでなく、ECサイトなどの製品検索やレビューの重要性が高い分野におけるSEO優位性を高めることができます。

また、構造化データは検索エンジンのアルゴリズムにおいても重視されており、検索エンジンがウェブページのコンテンツを理解する際に構造化データが活用されます。そのため、適切な構造化データのマークアップは検索順位においても影響を与え、高い表示順位を獲得する一因となっています。

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

ウェブサイトに構造化データを設定するためには、主にSchema.orgで定義された構造化データのマークアップ方法を使用します。主な構造化データのマークアップ方法を以下の4つのステップで解説します。

1.Schema.orgの選択

まず、ウェブページにおいてどの種類の構造化データを使用するかを決定します。Schema.orgには、Organization（組織）、WebPage（ウェブページ）、Article（記事）、Product（商品）、Review（レビュー）など多くの種類が存在します。それぞれのページに合わせて適切な種類を選択しましょう。

2.HTMLタグの追加

選択した構造化データの種類に基づいて、HTMLタグをページに追加します。使用するHTMLタグにもいくつか種類があり、マイクロデータ、JSON-LD、RDFaのいずれかの形式で行います。最も一般的な方法はJSON-LDで、JavaScript内に構造化データを埋め込むことができます。

例えば、Organizationの場合、JSON-LD形式で以下のようにマークアップできます。

3.属性の設定

各構造化データにはそれぞれの属性があります。属性ごとに正確に設定して、ウェブサイトの情報を検索エンジンに詳細に伝えます。例えば、Articleの場合、タイトル、著者、公開日、本文などの属性があります。

4.Google Search Consoleへの登録

マークアップが正しく実装され、テストが完了したら、Google Search Consoleにサイトを登録することで、構造化データの変更やエラーに関する情報を確認することができます。

構造化データの例

いくつか代表的な構造化データの例を紹介します。

Organization（組織）

ウェブサイトやビジネスの基本情報（ロゴ、会社名、住所、連絡先情報など）を設定します。

JSON-LD形式での基本的な記載方法は以下です。—————————————————————————————————

<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Corporation",
"name": "［会社名］",
"description": "［会社説明］ ",
"logo": "［ロゴ画像URL］/",
"telephone": "［電話番号］",
"sameAs": {
"［SNSのプロフィールURL］",
"［SNSのプロフィールURL］"
},
"address": {
"@type": "PostalAddress",
"streetAddress": "［詳細住所］",
"addressLocality": "［都道府県］",
"postalCode": "［郵便番号］",
"addressCountry": "日本"
}
}
</script>

—————————————————————————————————

Article（記事）

記事のタイトル、著者、公開日、更新日、本文などの情報を設定します。

JSON-LD形式での基本的な記載方法は以下です。

—————————————————————————————————

<script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "NewsArticle",
      "headline": "[記事のタイトル]",
      "image": [
        "[記事に使用している画像のURL]",
        "[記事に使用している画像のURL]",
        "[記事に使用している画像のURL]"
       ],
      "datePublished": "[公開日]",
      "dateModified": "[更新日]",
      "author": [{
          "@type": "[person（個人）/ Organization（組織）]",
          "name": "[著者名/組織名]",
          "url": "[著者/組織に関するURL]"
        },{
          "@type": "person",
          "name": "［著者名］",
          "url": "著者に関するURL"
      }]
    }
    </script>

—————————————————————————————————

Product（商品）

製品の名称、価格、在庫状況、レビューなどの情報を設定します。

JSON-LD形式での基本的な記載方法は以下です。

—————————————————————————————————

<script type="application/ld+json">
  {
    "@context": "https://schema.org/",
    "@type": "Product",
    "name": "［商品名］",
    "image": [
      "［商品画像のURL］"
    ],
    "description": "［商品説明］",
    "sku": "［商品番号］",
     "mpn": "［グローバル識別子］",
    "brand": {
      "@type": "Brand",
      "name": "［ブランド名］"
    },
     "review": {
      "@type": "Review",
      "reviewRating": {
        "@type": "Rating",
        "ratingValue": "［レビュー点数］",
        "bestRating": "［レビュー最高点数］"
      },
      "author": {
        "@type": "Person",
        "name": "［レビューを書いた人の名前］"
      }
    },
 
    "aggregateRating": {
      "@type": "AggregateRating",
      "ratingValue": "［レビュー点数の平均］",
      "reviewCount": "［レビューの数］"
    },
    "offers": {
      "@type": "Offer",
      "url": "［商品ページのURL］", 
      "priceCurrency": "［通貨］",
      "price": "［価格］", 
      "itemCondition": "［商品の状態］",  
      "availability": "［在庫状況］"  
    }
  }
</script>

—————————————————————————————————

Breadcrumb（パンくずリスト）

ページの階層構造を示すための情報を設定します。

JSON-LD形式での基本的な記載方法は以下です。

—————————————————————————————————

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "［1番目の階層名］",
      "item": "［1番目の階層のURL］"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "［2番目の階層名］",
      "item": "［2番目の階層のURL］"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "［3番目の階層名］",
      "item": "［3番目の階層のURL］"
    }
  ]
}
</script>

—————————————————————————————————