🍞

構造化データマークアップを考える(〜パンくずリストを添えて〜)

2025/03/04に公開

はじめに

パンくずリストを作った際、調べて見るとただマークアップするだけでは意味がないということに気づいた背景から勉強するハメになりました。
今回はパンくずリストの説明から構造化データマークアップまでを調べていこうと思います。

パンくずリストとは

パンくずリスト(Breadcrumb Navigation)は、ウェブサイト上でのナビゲーションの一種で、ユーザーが現在のページに至るまでの階層的な位置を示すリンクの集合です。通常、ページの上部や下部に表示され、ユーザーがサイト内のどの位置にいるかを視覚的に理解できるようにします。
よく見られると思いますが、通常は以下のような形式で表示されることが多いと思います。
ホーム > カテゴリ > サブカテゴリ > 現在のページ
https://developers.google.com/search/docs/appearance/structured-data/breadcrumb?hl=ja

パンくずリストの重要性

パンくずリストを配置するメリットは大きく分けて以下の2つがあると考えています。

  • ユーザビリティの向上: パンくずリストを配置することで、ユーザーがサイト内を簡単にナビゲートできるようになります。特に大規模なサイトや多階層のサイトでは、ユーザーは自分がどの位置にいるかを把握しやすくなると考えられ、またモバイルデバイスでは、ユーザーが指で簡単に操作できるためナビゲーションの容易性が向上すると考えられます。

  • SEOへの影響: 構造化データマークアップを使用することで、パンくずリストは検索エンジンに対してページの関係性を示す手段となります。これにより、検索結果にリッチスニペットリッチリザルト) として表示される可能性が高まり、クリック率の向上に寄与すると考えられます。

Google は、構造化データを使用してページのコンテンツを認識し、そのコンテンツを「リッチリザルト」と呼ばれる情報が豊富な検索結果に表示します。サイトが検索でリッチリザルトの一つとして表示されるようにするには、サイトに構造化データを実装する方法を説明しているガイドを実践してください。

パンくずリストの種類

階層型パンくずリスト

階層型パンくずリストは、ユーザーが現在いるページの階層的な位置を示します。通常、最上位のページから現在のページに至るまでの経路を示しますこの形式は情報が階層的に整理されているサイトに適しています。
ホーム > カテゴリ > サブカテゴリ > 現在のページ
階層型パンくずリストを配置する目的としては、ユーザーが自分の現在の位置を把握し、親ページに簡単に戻ることができるようにすることです。
例: デジタル庁のサイト

属性型パンくずリスト

属性型パンくずリストは、特定の属性やフィルタリングを示すために使用されます。これは通常、ECサイトなどデータベースを用いて検索されるサイトで見られ、特定の条件に基づいて情報を絞り込む際に役立ちます。 このタイプのパンくずリストは、ユーザーが選択したフィルタや検索条件を示します。
ホーム > 商品 > ブランド名など > カテゴリ名など > 商品名など
属性型パンくずリストを配置する目的としては、ユーザーが選択した条件を明示し、他の条件に戻るためのナビゲーションを提供します。
例: zozotown

他にもユーザーの閲覧履歴を辿るようにするパス型パンくずリストがありますが、ブラウザの機能として備わっているため、いまいち設置するメリットがないため、上記の二つからパンくずリストを構成するのがいいと思います。

パンくずリストの構造化データマークアップ

Googleをはじめ主要な検索エンジンはJSON-LD形式での構造化データマークアップを推奨しており、新しい構造化データの仕様はまずJSON-LDでサポートされる傾向があります​。

一般的に、Google は実装と管理が最も容易な形式(ほとんどの場合は JSON-LD)を推奨します。

We currently prefer JSON-LD markup. I think most of the new structured data that are kind of come out for JSON-LD first. So that’s what we prefer.

現在、私たちは JSON-LD マークアップを好んでいます。新しい構造化データのほとんどは、まず JSON-LD 向けにリリースされると思います。ですから、私たちは JSON-LD を好んでいます。

サポートされている形式
Google’s Preferred Structured Data: JSON-LD vs. Microdata
JSON-LDはHTMLの構造と分離して記述できるため、ページの<head>内や<body>の末尾など任意の場所に配置可能で、既存のHTMLを修正せずに追加できます。
パンくずリストをJSON-LDで記述する場合、<script type="application/ld+json">タグ内にSchema.orgの語彙を用いたJSONを記述します。

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "item": {
        "@id": "https://example.com/",
        "name": "ホーム"
      }
    },
    {
      "@type": "ListItem",
      "position": 2,
      "item": {
        "@id": "https://example.com/search",
        "name": "検索"
      }
    },
    {
      "@type": "ListItem",
      "position": 3,
      "item": {
        "@id": "https://example.com/search/result",
        "name": "検索結果詳細"
      }
    }
  ]
}
</script>
  • @contextでスキーマの参照先(通常はhttps://schema.org)を指定し、
  • @typeで最上位オブジェクトがBreadcrumbListであることを示しています。
  • itemListElement配列として各パンくず項目(ListItemオブジェクト)を並べています。各ListItemにはposition(序列)item(リンク先オブジェクト)が含まれ、itemオブジェクト内で実際のURL(@id)と表示名(name)を指定しています。最後のパンくずが現在のページに相当します。

構造化データマークアップの重要性

構造化データとは

構造化データとは、主に検索エンジンがウェブページのコンテンツを理解しやすくするために使用されるデータ形式です。 構造化データは、一般的にSchema.orgという標準に基づいており、JSON-LD、Microdata、RDFaなどの形式で記述されます。特にJSON-LD形式は現在Googleに推奨されています。

構造化データを使用してページの意図を伝えると、Google はそのページをより正確に理解できるようになります。構造化データとは、ページに関する情報をさまざまなサイトで活用できるように標準化したデータ形式

https://developers.google.com/search/docs/appearance/structured-data/intro-structured-data?hl=ja

構造化データの利点

構造化データを実装する最大の利点は、検索エンジンがページ内容を正確に理解できるようになることでしょう。 マークアップによってページ内の重要な情報を明示するため、検索エンジンはコンテンツを誤解することなく解釈できます。 これにより検索エンジンが他の類似コンテンツと比較・評価できるようになることが見込まれます。

また構造化データのもう一つの大きな利点は、検索結果における見栄えやクリック率(CTR)の向上です。
構造化データを正しくマークアップすると(ガイドライン)、ページが検索エンジンのリッチリザルトとして表示される可能性が高まります。リッチリザルトでは色々種類はありますが、星評価や価格など追加情報が表示されるため、通常のテキストのみの情報よりもユーザーの目を引きやすくなります。

以下にリッチリザルトとして表示された場合の例になります。

  • パンくずリスト

    パンくずリストの構造化データをマークアップすることで検索にも表示されます。

  • 商品に関する情報

    ECサイトなどでは商品に関する情報(価格、在庫状況、クチコミの評価など)を表示されることができます。

他にもレシピやイベント情報、記事などgoogleがサポートする構造化データマークアップはたくさんあるので、自分のサイトにあったマークアップをするとCTRの劇的な向上が見込まれます。

Nestlé では、検索でリッチリザルトを表示するページのクリック率が、表示しないページに比べ 82% 高くなっています。

ここまでの差が出るのは驚きました😳
https://developers.google.com/search/docs/appearance/structured-data/search-gallery?hl=ja

また、自分のサイトがリッチリザルトとして表示されているかの確認はリッチリザルトテストから行うことができます。
https://search.google.com/test/rich-results?hl=ja

検索エンジンにおける可視性向上

So, on the one hand we do use structured data to better understand the entities on a page and to find out where that page is more relevant.”

ページ上のエンティティをより深く理解し、そのページの関連性が高い場所を見つけるために構造化データを使用しています。」

John Mueller Answers About Structured Data and Rankings
とあるように、構造化データは、検索エンジン上でのページの可視性(ビジビリティ)向上に影響を与えます。
構造化データによりページ内容が適切に解釈されることで、関連性の高い検索クエリに対してページが表示されやすくなる効果が期待できます。Googleは構造化データを用いてページ上のエンティティ(対象)や属性を理解するとされており、これによってページが本来対象とするトピックにマッチする検索結果により表示されることが期待できます。

一方で、

Structured data isn’t part of a ranking factor. But it does help communicate on-page content factors like the entities that are the subject of the page.

構造化データはランキング要因の一部ではありません。ただし、ページの主題となるエンティティなどのページ上のコンテンツ要因を伝えるのに役立ちます。

John Mueller Answers About Structured Data and Rankings
とあり、ランキングそのものへの直接的な影響については注意が必要だと感じます。 Googleの一般的なランキング要因には構造化データ自体は含まれておらず、構造化データを追加しただけで検索順位が上がるわけではなく、あくまでコンテンツの質や関連性が重要であると考えられます。

しかし、構造化データによってリッチスニペットが表示され結果が目立つようになると、ユーザーのクリック率向上を通じて間接的にSEO効果をもたらす可能性があると感じます。

参考
パンくずリスト(BreadcrumbList)の構造化データ

Google 検索がサポートする構造化データ マークアップ

Google’s Preferred Structured Data: JSON-LD vs. Microdata

Google 検索における構造化データのマークアップの概要

構造化データに関する一般的なガイドライン

hallブログ

Schema Markup: Why Structured Data Is Important to Google

John Mueller Answers About Structured Data and Rankings

Discussion