【誰でもわかる】パンくずリストとは？メリットや注意点、作り方までSEOのプロが解説！

ウェブサイトの上部に表示される「ホーム > カテゴリ > 記事名」のような小さなナビゲーション。これが「パンくずリスト」です。

パンくずリストには、サイトを訪れたユーザーを迷子にさせないユーザビリティ向上の役割と、検索エンジン（Googleなど）のクローラーにサイト構造を正確に伝えるという、極めて重要なSEOの役割を担っています。

本記事では、このパンくずリストがSEOにもたらす具体的なメリットから、効果的な設置方法までをプロの視点で徹底解説します。

パンくずリストとは？

パンくずリスト（Breadcrumb List）とは、ユーザーがサイト内のどの階層にいるかを視覚的に示すナビゲーション要素です。

通常、「トップページ > カテゴリ名 > 記事タイトル」のように表示され、ユーザーはクリック一つで上位階層へ簡単に戻ることが可能です。

これはサイト内での迷子を防ぐ重要な機能であり、SEOにおいてはサイト構造をクローラーに伝える役割も担っています。

特徴
※右に行くほど具体的になっています。
<例>
トップページ (最も広い) > 家電 (カテゴリ) > 冷蔵庫 (サブカテゴリ) > A社製モデル名 (最も具体的)

パンくずリストを設定するメリット

ユーザーエクスペリエンス（UX）の向上

パンくずリストは、サイト訪問者が「今、どこにいるか」を瞬時に把握できる道しるべ。

ユーザーがサイト内で迷子になるのを防ぎ、上位カテゴリや関連ページへ簡単に戻れるというメリットもあります。

ユーザーが目的の情報をすぐに見つけられることは、サイトの利便性（ユーザビリティ）が高まり、Googleが重視する質の高いユーザー体験を提供することになります。

サイトの構造を明確にし、クローラーの読み込みを助ける

パンくずリストは、Googleなどの検索エンジンのクローラーに対して、ウェブサイトの階層構造を正確に伝達する役割を担っています。

クローラーとは
Webサイト上の情報を自動的に収集・巡回するプログラムのことです。

特に構造化データ（Schema.orgのBreadcrumbList）でマークアップすることで、クローラーは「このページがどのカテゴリの配下にあるか」を明確に認識できます。

これにより、検索エンジンはサイト全体のトピックの関連性を理解しやすくなり、結果として正確な評価やインデックスに繋がります。

内部リンクの最適化

パンくずリストは、サイトの上位階層にあるページへの内部リンクを自動的に生成します。

パンくずリストのおかげで、サイト内の重要なページやカテゴリページへ常にリンクが集まる状態を作り出しています。

リッチスニペットによるクリック率の改善

適切な構造化データを用いてパンくずリストを実装することで、Googleの検索結果ページにその情報が表示される可能性があります。

これは「リッチスニペット」と呼ばれています。

通常のURL表示ではなく、サイト名 > カテゴリ名といった階層情報付きのURLとして表示されます。

この表示は、ユーザーに対して検索結果上でもページの信頼性や内容の具体性を伝えやすくなり、クリック率（CTR）の向上に貢献します。

(間接的なメリット)無駄なユーザー離脱の防止

ユーザーがサイト内で迷子になった際、「どこに戻ればよいか分からない」「情報を見つけにくい」と感じると、すぐにブラウザの「戻る」ボタンを押すか、サイト自体を離脱する傾向があります。

パンくずリストは、ユーザーに現在地を示すだけでなく、一目で上位階層への戻り口を提供します。

これにより、ユーザーはサイトを離れることなく、一つ上のカテゴリやトップページへ簡単に移動して探索を続けることが可能です。

この安心感と容易なナビゲーションが、結果的に無駄な離脱を防止し、滞在時間の延長やコンバージョン機会の保持に貢献します。

パンくずリストの3つの種類

階層型【ウェブメディアやブログのほとんどがこれ】

現在見ているページが、サイト全体の階層構造のどこに位置しているかを示す最も一般的なタイプです。

例： ホーム > カテゴリ名 > サブカテゴリ名 > 記事タイトル

これは、静的なサイト構造を持つブログやECサイトなどで多く採用され、ユーザーがサイト構造を理解するのに最も役立ちます。SEOの観点からも、このディレクトリ構造を示すタイプが最も推奨されます。

属性型【主にECサイトなど】

特にECサイトなどで使用されることが多く、閲覧している商品が持つ属性（タグやスペック）によって分類されたパスを示すタイプです。

例： ホーム > スニーカー > 男性用 > 白

このタイプは、同じ商品でも複数の属性を持ち、多様な絞り込み検索が可能なサイトで有効です。ユーザーが何を基準にそのページに辿り着いたかを理解するのに役立ちます。

パス型【見ることは稀】

ユーザーが実際に閲覧したページ履歴に基づいて表示されるタイプです。ブラウザの「戻る」ボタンと似た機能を提供しますが、サイト内での動きに限定されます。

例： トップページ > A商品ページ > B商品ページ > 現在のページ

動的な履歴を示すため、ユーザーの利便性は高いものの、サイト全体の構造とは無関係であり、SEOとしてのクローラーへの情報提供には不向きなため、メインのパンくずリストとしては推奨されません。

パンくずリストの適切な階層数

パンくずリストの階層数に厳密な制限はありませんが、ユーザーの利便性を最優先に考えると、3階層から5階層程度が適切とされます。

階層が少なすぎるとサイト構造の把握が難しくなり、逆に7階層以上など多すぎると、表示領域を占領し、ユーザーにとって煩雑で情報が伝わりにくくなります。

重要なのは、ウェブサイトの構造を正確に反映させることです。不自然に階層を浅くしたり、深くしたりせず、論理的なディレクトリ構造（例：トップ > カテゴリ > サブカテゴリ > 記事）を保つことが、SEOとUXの両面で最も効果的です。

パンくずリストの設定の基本

適切な位置は？

パンくずリストの設置場所は、ユーザーがサイトの現在地を迅速に把握できるように、ページのコンテンツエリアの上部に配置するのが最も適切です。

具体的には、グローバルナビゲーション（メインメニュー）の下や、ページのメインタイトル（
）の直上、または直下に配置することが一般的です。

この位置に置くことで、ユーザーはページ内容を読む前に導線を確認でき、検索エンジンもHTMLの冒頭付近でサイト構造を理解しやすくなるという、ユーザビリティとSEO両面でのメリットがあります。

適切なデザインとフォント

フォントサイズ：メインコンテンツのテキストよりやや小さめ（例：12px〜14px）が一般的です。

配色：グレーや黒がオススメです。

適切な区切り

区切り文字： 階層を示す区切りには、
>（大なり記号）
/（スラッシュ）
»
が一般的です。

パンくずリストの階層を分ける区切り文字（セパレーター）は、ユーザーの視覚的な理解を助ける重要な要素です。

最も一般的に使われるのは、右方向への流れを示す意味合いを持つ>（大なり記号）や/（スラッシュ）です。これらは階層の深まりを直感的に伝えます。

その他に»（二重山括弧）や|（パイプ）が使われることもありますが、いずれの場合も、一貫性を持たせ、ユーザーがリンクと区切り文字を混同しないデザインにすることが大切です。

パンくずリストの設置方法

ワードプレステーマの活用

多くのワードプレステーマには、最初からパンくずリストが機能としてあります。そのため、特段自分でCMSやHTMLで作業する必要はありません。

ただ、階層は自分で考える必要があります。

どのキーワードをカテゴリーに設定するか、リスト名などは自分で考える必要があるので、もし迷ったら無料相談をご利用ください。

プラグインを活用

WordPressなどのCMS（コンテンツ管理システム）では、パンくずリストの実装と構造化データのマークアップをプラグインで自動化するのが最も効率的です。

プラグインは、サイトの階層構造に基づいて正確なパンくずリスト（JSON-LD対応）を迅速に生成し、手動で複雑なコードを書く手間を省けますよ。

手間をかけずにSEO効果を最大化したい場合に非常に有効な手段です。

CMSで実装

WordPressなどのCMS（コンテンツ管理システム）では、パンくずリストの実装と構造化データのマークアップをプラグインで自動化するのが効率的です。

プラグインは、サイトの階層構造に基づいて正確なパンくずリスト（JSON-LD対応）を迅速に生成し、手動で複雑なコードを書く手間を省きます。

HTMLで実装

プラグインを使用しない場合、パンくずリストはHTMLのリスト要素（<ul>や<ol>)とリンク（<a>）を組み合わせて実装します。

最もシンプルで推奨される形式は、順序付きリストである<ol>タグを使用する方法です。

<nav aria-label="breadcrumb">
  <ol>
    <li><a href="/">ホーム</a></li>
    <li><a href="/category/">カテゴリ</a></li>
    <li>現在の記事名</li>
  </ol>
</nav>

このHTML実装に加え、先に解説したJSON-LDによる構造化データのマークアップを必ず行うことが、SEO効果最大化の鍵となります。

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

パンくずリストを単にHTMLで表示するだけでなく、構造化データ（Schema.org）を用いてマークアップすることで、検索エンジンにその階層構造を正確に理解させることができます。

そうすることで、検索結果にリッチスニペットとして表示される可能性が高まり、SEO効果が向上します。

構造化データのマークアップには、主にJSON-LD、Microdata、RDFaの3種類がありますが、Googleが最も推奨しているのが、実装が容易なのがJSON-LD形式です。

<JSON-LDによるマークアップコード例>
以下のコードは、パンくずリストの一般的な3階層（ホーム > カテゴリ > 記事）を示すマークアップ例です。

このコードをページの**<head>内または<body>の任意の場所**に記述します。

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "ホーム",
      "item": "https://www.example.com/"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "製品紹介",
      "item": "https://www.example.com/products/"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "パンくずリストとは？",
      "item": "https://www.example.com/products/breadcrumb-seo.html"
    }
  ]
}
</script>

パンくずリストに関するよくある疑問に回答！