SEOでよく使われる構造化マークアップは？有名サイトを徹底調査！

構造化マークアップは、検索エンジンのクローラーをはじめとしたロボットなどが、ページ内のテキストや画像などが何について書かれたものかを明示するためのマークアップです。

そのため、SEOにおいても活用され、GoogleにWebサイトのコンテンツを正しく理解させるのに役立ちます。構造化マークアップにはさまざまな種類があり、使用されるマークアップはサイトごとに特色があります。

今回は、SEO評価の高いサイトの構造化マークアップを調査し、SEOでよく使われる構造化マークアップを紹介します。サイトごとの特徴を読み取れるため、自社サイトに必要な構造化マークアップがわかるでしょう。ぜひ最後までご覧ください。

構造化マークアップとは？

構造化マークアップとは、Googleにページ内の情報を正しく認識させるために、どの情報が何の情報かを明確にした形式で情報をマークアップすることです。

構造化データとは？

構造化データとは、決められたルールに従って意味を付加したデータのことです。

Googleはページのコンテンツを収集し、適切な内容のページを検索結果画面に表示させています。その一方で、Googleは必ずしも人間と同じようにテキストを読み取ることはできず、情報を誤認してしまう可能性があります。

そのため、Googleにページ内のテキストや画像を理解してもらうためには、Googleが読み取れる形でページ内容を記述する必要があります。そこで、ルールに従ったタグを記述して、Googleにページの内容や構造を伝えるデータ形式のことを構造化データと呼びます。

例えば、「株式会社ヒトノテ」という文字列に対して、「ここの記述は社名を表している」と表現する（マークアップする）ことで、ページやコンテンツの意味を正しくGoogleに認識させることができます。

このような、Googleにデータの意味を理解させるために生まれたのが「セマンティックWeb」と呼ばれる考え方です。

セマンティックWeb
統一化された形式に基づいてデータを記載することで、コンピュータシステムが効率的・構造的に情報を収集・解釈できるようにすること

構造化データは、このセマンティックWebの考え方に基づいて生まれています。

▼関連記事
構造化データとは？マークアップを行うメリットやSEOへの影響を解説

構造化マークアップによるSEO効果はあるのか？

構造化マークアップを実装するだけで、検索順位が一気に向上するようなことはありませんが、一定のSEO効果は見込めます。

上記で述べたように、構造化マークアップによってGoogleがページ内の情報を正しく認識できるようになり、正しいコンテンツ評価の獲得につながります。それによって、コンテンツや内容に適した検索結果に表示される可能性も高まるといえます。

加えて、構造化マークアップを実装することによって、リッチリザルトが表示されることもあります。リッチリザルトとは、キーワードに関連して検索結果画面に表示されるコンテンツのことです。

上記のレビュー（星）表示は、リッチリザルトの一種です。リッチリザルトはユーザーの目に留まりやすいため、クリック率向上が期待できます。クリック率が上がると当然流入が増えることになるため、構造化マークアップによるSEO効果はあるといえるでしょう。

ただし、構造化マークアップを実装しても、必ずリッチリザルトに表示されるとは限りませんし、FAQリッチリザルトのように、突然表示されなくなるリッチリザルトもあります。

構造化マークアップによって期待できるSEO効果
・Googleに正しくコンテンツを評価してもらう
・リッチリザルトへの表示

【種類別】各サイトの構造化マークアップの使用例

ここでは、SEO評価の高いサイトで使用されている構造化マークアップを、トップページ・一覧ページ・詳細ページに分けて紹介します。自社サイトにはどのようなマークアップが必要なのかを考えながらご覧ください。

今回の調査では、Googleが提供しているリッチリザルトテストを活用しています。

転職サイト

転職サイトの例として、豊富な求人情報が掲載されているマイナビ転職の構造化マークアップを調査しました。マイナビ転職の各ページで実装されている構造化マークアップは以下の通りです。

構造化マークアップの各項目の詳しい解説は、後ほど「よく使われる構造化マークアップ一覧と記述方法」の箇所で行います。

トップページ

マイナビ転職のトップページに実装されている構造化マークアップはありませんでした。

一覧ページ

求人一覧ページでは、「パンくずリスト」が構造化マークアップとして実装されています。

詳細ページ

求人詳細ページでは、「パンくずリスト」と「求人情報」が構造化マークアップとして実装されています。基本的には、Googleで定義されている内容に基づいて設定されていますが、一部エラー表示も出ています。

例えば、求人情報の中で、jobLocationの箇所の「streetAddress」「addressLocality」「postalCode」と、「experienceRequirements」の項目にエラーが出ています。

streetAddress・addressLocality・postalCodeは、詳細な住所を明記する要素で、任意項目であるため記述していないと考えられます。また、勤務地が多岐にわたることがページ内で確認できます。そのため、住所情報を明記する項目に、一意の情報を入れられず空欄になっているとも推察できます。

・streetAddress：勤務地のそれ以降の住所
・addressLocality：勤務地の市区町村
・postalCode：勤務地の郵便番号

一方、experienceRequirementsでは、「列挙値が無効」と書かれているため、きちんと整理して記入するとよいと考えられます。

・experienceRequirements：必須の経験やスキル

不動産サイト

不動産サイトの例として、豊富な物件が掲載されているSUUMO（スーモ）の構造化マークアップを調査しました。スーモの各ページで実装されている構造化マークアップは以下の通りです。

構造化マークアップの各項目の詳しい解説は、後ほど「よく使われる構造化マークアップ一覧と記述方法」の箇所で行います。

トップページ

スーモのトップページに実装されている構造化マークアップはありませんでした。

一覧ページ

物件一覧ページでは、「パンくずリスト」が構造化マークアップとして実装されています。

「トップページ→物件の種類→エリア」と、しっかり階層分けがされています。

詳細ページ

物件詳細ページでも、「パンくずリスト」が構造化マークアップとして実装されています。

物件一覧ページの階層に加え、物件のエリア（渋谷区）と最寄り駅（西新宿五丁目駅）の階層が用意されています。このように一覧で見ると、ユーザーにとってもクローラーにとっても非常にわかりやすく階層が分けられていることがわかります。

また、上記のように賃貸の物件詳細ページではパンくずリストの構造化マークアップしかありませんでしたが、同サイトの新築マンション（購入）の物件詳細ページでは「商品スニペット」や「販売者のリスティング」の構造化マークアップが実装されていました。

もしかしたら、賃貸の物件詳細ページにも、商品スニペットや販売者のリスティングの構造化マークアップを設定してもよいかもしれません。

ECサイト

ECサイトの例として、楽天市場の構造化マークアップを調査しました。ECサイトは、サポートされている構造化マークアップの種類が多いのが特徴です。楽天市場も各マークアップにしっかり対応しています。楽天市場の各ページで実装されている構造化マークアップは以下の通りです。

構造化マークアップの各項目の詳しい解説は、後ほど「よく使われる構造化マークアップ一覧と記述方法」の箇所で行います。

トップページ

楽天市場のトップページに実装されている構造化マークアップはありませんでした。

一覧ページ

商品一覧ページでは、「商品スニペット」「販売者のリスティング」「パンくずリスト」「カルーセル」「レビュースニペット」が構造化マークアップとして実装されています。

その結果、検索結果画面にも商品の画像や価格などの情報が、リッチリザルトとして表示されています。

また、基本的にGoogleで定義されている内容に基づいて構造化マークアップが設定されていますが、一部エラー表示も出ています。

例えば、商品スニペットと販売者のリスティングでは、以下のエラー表示が出ています。

商品スニペットのoffersの箇所の「priceValidUntil」と「availability」は、任意項目のため記入していないと考えられます。

・priceValidUntil：価格が有効な日付
・availability：在庫状況

販売者のリスティングのoffersの箇所の「hasMerchantReturnPolicy」「shippingDetails」「availability」は、任意項目のため記入していないと考えられます。

・hasMerchantReturnPolicy：返品に関するポリシー
・shippingDetails：配送ポリシーやオプション情報
・availability：在庫状況

description（ディスクリプション）も任意項目となっており記入されていませんが、一般的には記入したほうがよいでしょう。

詳細ページ

商品詳細ページでは、「商品スニペット」と「レビュースニペット」が構造化マークアップとして実装されています。

メディアサイト

メディアサイトの例として、ファッションや生活雑貨などのさまざまなアイテムを紹介しているキナリノの構造化マークアップを調査しました。キナリノの各ページで実装されている構造化マークアップは以下の通りです。

構造化マークアップの各項目の詳しい解説は、後ほど「よく使われる構造化マークアップ一覧と記述方法」の箇所で行います。

トップページ

キナリノのトップページに実装されている構造化マークアップはありませんでした。

一覧ページ

記事一覧ページでは、「パンくずリスト」が構造化マークアップとして実装されています。

詳細ページ

記事ページでは、「記事」と「パンくずリスト」が構造化マークアップとして実装されています。

基本的には、Googleで定義されている内容に基づいて構造化マークアップが設定されていますが、一部エラー表示も出ています。

例えば、authorのurlにエラーが表示されています。該当記事には、著者・執筆者が明記されていないため、構造化マークアップにも記入していないと考えられます。

一方で、著者や執筆者がいる場合は、きちんと明記したほうがよいでしょう。

よく使われる構造化マークアップ一覧と記述方法

よく使用される構造化マークアップを一覧で紹介します。それぞれのマークアップの検索結果画面（リッチリザルト）での表示例や記述方法も解説するので、参考にしてください。

パンくずリスト

パンくずリストは、そのページがサイトのどの階層に位置しているかを示します。パンくずリストがあることによって、サイト構造が整理され、ユーザーがサイト内を回遊・移動しやすくなります。

検索結果画面での表示例

パンくずリストの構造化マークアップを実装することによって、検索結果画面には以下のように表示されます。

通常、パンくずリストはURLを区切った形で表示されますが、構造化マークアップを行うと、日本語で表記されるようになります。

記述例

パンくずリストの書き方は以下の通りです。@typeに「BreadcrumbList」を指定します。

<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",
    "name": "3階層目の名前",
    "item": "3階層目のURL"
  }]
}
</script>

求人情報

構造化マークアップを行うことによって、求人情報がリッチリザルトで表示されることがあります。リッチリザルトとして表示されることによって、ユーザーの目に留まりやすくなります。クリックされる確率が高まり、流入数増加につながります。

検索結果画面での表示例

求人情報の構造化マークアップを実装することによって、検索結果画面には以下のように表示されます。

記述例

求人情報の書き方は以下の通りです。@typeに「JobPosting」を指定します。

<script type="application/ld+json">
{
  "@context" : "https://schema.org/",
  "@type" : "JobPosting",
  "title" : "タイトル（求人名）",
  "description" : "<p>求人内容</p>",
  },
  "datePosted" : "求人情報の公開日（例:2024-01-01）",
  "validThrough" : "求人情報の掲載期限（例:2024-03-31）",
  "employmentType" : "雇用形態",
  "hiringOrganization" : {
    "@type" : "Organization",
    "name" : "企業名",
    "sameAs" : "企業のサイトURL",
    "logo" : "ロゴの画像URL"
  },
  "jobLocation": {
  "@type": "Place",
    "address": {
    "@type": "PostalAddress",
    "streetAddress": "勤務地のそれ以降の住所",
    "addressLocality": "勤務地の市区町村",
    "addressRegion": "勤務地の都道府県",
    "postalCode": "勤務地の郵便番号",
    "addressCountry": "勤務地の国名"
    }
  },
  "baseSalary": {
    "@type": "MonetaryAmount",
    "currency": "JPY",
    "value": {
      "@type": "QuantitativeValue",
      "value": 年収,
      "unitText": "YEAR"
    }
  }
}
</script>

商品スニペット

商品スニペットは、商品のレビューや販売者などを示します。ECサイトなどの商品ページに記述するとよいでしょう。

検索結果画面での表示例

商品スニペットの構造化マークアップを実装することによって、検索結果画面には以下のように表示されます。

記述例

商品スニペットの書き方は以下の通りです。@typeに「Product」を指定します。

<script type="application/ld+json">
{
  "@context": "https://schema.org/",
  "@type": "Product",
  "name": "商品名",
  "description": "ディスクリプション",
  "review": {
    "@type": "Review",
    "reviewRating": {
      "@type": "Rating",
      "ratingValue": 平均評価(例:4),
      "bestRating": 最高評価(例:5)
    },
    "author": {
      "@type": "Person",
      "name": "販売者名"
    }
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": 評価の平均(例:4.4),
    "reviewCount": 評価の人数(例:89)
  }
}
</script>

販売者のリスティング

販売者のリスティングの構造化マークアップを実装すると、価格や在庫状況、配送と返品に関する情報など、商品のさらに詳しい情報をハイライトで表示できます。ECサイトなどの商品ページには、上記の商品スニペットに加え、販売者のリスティングも記述するとよいでしょう。

検索結果画面での表示例

販売者のリスティングの構造化マークアップを実装することによって、検索結果画面には以下のように表示されます。

記述例

販売者のリスティングの書き方は以下の通りです。商品スニペットと同じく、@typeに「Product」を指定します。

<script type="application/ld+json">
{
  "@context": "https://schema.org/",
  "@type": "Product",
  "name": "商品名",
  "image": [
    "商品画像(1×1の画像URL)",
    "商品画像(4×3の画像URL)",
    "商品画像(16×9の画像URL)"
   ],
  "description": "ディスクリプション",
  "sku": "販売者固有の識別子(例:0446310786)",
  "mpn": "製品番号(例:925872)",
  "brand": {
    "@type": "Brand",
    "name": "ブランド"
  },
  "review": {
    "@type": "Review",
    "reviewRating": {
      "@type": "Rating",
      "ratingValue": 平均評価(例:4),
      "bestRating": 最高評価(例:5)
    },
    "author": {
      "@type": "Person",
      "name": "販売者名"
    }
  },
  "aggregateRating": {
    "@type": "AggregateRating",
    "ratingValue": 評価の平均(例:4.4),
    "reviewCount": 評価の人数(例:89)
  },
  "offers": {
    "@type": "Offer",
    "url": "商品ページのURL",
    "priceCurrency": "JPY",
    "price": 料金,
    "priceValidUntil": "価格が有効な日付(例:2024-11-20)",
    "itemCondition": "商品状態",
    "availability": "在庫状況"
  }
}
</script>

記事

記事ページに構造化マークアップを実装すると、検索結果にページのタイトルテキストや画像、公開日などを表示できるようになります。

検索結果画面での表示例

記事の構造化マークアップを実装することによって、検索結果画面には以下のように表示されます。

記述例

カルーセルの書き方は以下の通りです。@typeに「Article」を指定します。

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "ページタイトル",
  "description": "ディスクリプション",
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "ページURL"
  },
  "image": [
    "OGP画像(横幅696px以上の1×1の画像URL)",
    "OGP画像(横幅696px以上の4×3の画像URL)",
    "OGP画像(横幅696px以上の16×9の画像URL)"
   ],
  "datePublished": "記事作成日（例:2024-01-05T08:00:00+08:00）",
  "dateModified": "記事更新日（例:2024-02-05T09:20:00+08:00）",
  "author": [{
    "@type": "Person",
    "name": "執筆者",
    "url": "執筆者のプロフィールページURL"
  }]
}
</script>

構造化マークアップの確認方法

構造化マークアップを正しく実装できているか、エラーが出ていないかなどを確認する際は、Googleの公式ツール「リッチリザルトテスト」を活用しましょう。

検索窓にページのURLを打ち込んで検索すると、構造化マークアップによって生成されるリッチリザルトやマークアップの構造を確認できます。また、Googleの検索結果画面で、リッチリザルトがどのように表示されるかのプレビューもできます。

まとめ

今回は、SEO評価の高いサイトで使用されている構造化マークアップを紹介しました。

構造化マークアップによって、正しいコンテンツの評価ややリッチリザルトへの表示が期待できます。構造化マークアップを実装するだけで、検索順位が一気に向上するようなことはありませんが、一定のSEO効果は見込めます。

本記事を参考に、自社サイト・ページにあった構造化マークアップを実装するようにしてください。

ヒトノテでは、さまざまな観点でWebサイトへの流入や問い合わせが増えるようにご支援をさせていただいております。

• SEO観点での自社サイトのベストプラクティス
• SEOの基礎知識や原理原則
• 効果的なSEO施策

などを知りたい場合は、ぜひこちらからお気軽にご相談ください。不明点や疑問点に対して、1つ1つ丁寧にご説明いたします。

監修者：坪昌史

株式会社ヒトノテの代表取締役CEO。 エンジニアとしてキャリアスタートし、サイバーエージェントのSEO分析研究機関を経て、リクルートの横断マーケティング組織のマネージャー&全社SEO技術責任者を務める。その後、独立しSEOを中心としたクライアントの課題解決を行う。2017年、株式会社ヒトノテを創業し、様々な企業のウェブマーケティングの支援を行う。