Web制作勉強中のみなさんや、他業種にお勤めのみなさんは、こんな疑問をもっていませんか？

「パンくずリスト」って、一体なんだろう？
それってWebサイトに必要なもの？

こちらの記事にその答えがあります！パンくずリストの基本構造と役割を、丁寧にわかりやすく解説させていただきます。

今更聞けない！パンくずリストって何？

パンくずリストとは、Webサイトへの訪問者が、現在見ているページがサイトのどの階層に位置しているかを、示したリストです。通常、ページの上部に表示させています。

なぜ「パンくずリスト」と呼ぶのでしょう？英語での表記も「breadcrumbs （list）」と書きます。

童話「ヘンゼルとグレーテル」はご存じでしょうか？森の奥深くへ連れてこられた兄妹は、帰る道がわからなくならないように、パンくずを落として道しるべとしました。

パンくずリストの語源はこのストーリーに由来しています。迷子にならないためのアイディアの象徴として「パンくず」という言葉がこのリスト名になりました。

パンくずリストを置く２つのメリット

ユーザービリティの向上

パンくずリストを設置することは、Webサイトを見ている人にとって、視覚的に「今、サイトの中のどのページを見ているのか」を伝えることができます。Webサイトにおいて、ユーザビリティ（使いやすさ）は非常に重要なポイントです。

普段、何気なく見ているサイトにもパンくずリストを置いてあるものがほとんどです。ページ数の多いサイトになると、サイトの構造が複雑になってしまう傾向があります。サイトのホームから訪れた人は、メニューを自分で選択してページを進んでいきますが、検索エンジンからサイトのホーム以外のページに着地する場合もあります。そんな時、パンくずリストが役に立ちます。

自分がサイトのどの位置にいるのか
サイト全体の構造はどうなっているのか

これらを認識する手がかりとなることで、ユーザービリティの高いサイトになり、サイト内の巡回もしやすくなります。さりげない存在ですが、パンくずリストの必要性がわかってきましたね！

SEO（検索エンジン最適化）

検索エンジンにサイトをヒットさせるには「クローラー」と呼ばれる情報収集ロボットにクロール（サイトの情報を収集）される必要があります。

パンくずリストがSEOにおいて効果を発揮する理由は、サイト内リンクです。内部リンクはWebサイト内のページをつなぐリンクのことで、内部リンクを最適化することで、クロールされやすくなります。そうすることで、Googleからの評価が高いサイトとなり検索順位の上昇を見込める一因となります。

つまり、ページごとにわかりやすいカテゴリ構造にし、正しいパンくずリストを設置しておくことで、クローラーも効率的にカテゴリをたどることができることができ、良質なサイトとしてGoogleに評価されやすくなるのです。

3種類のパンくずリスト

実は、パンくずリストは3種類あります。

最近は、ほとんどのWebサイトで適用されているのは位置型のパンくずリストです。その理由も踏まえて、それぞれの特徴を説明していきます。

位置型パンくずリスト

いわゆる、一般的なパンくずリストです。自分がどの階層のどの位置にいるのかを一目でわかるように、表示してあるもので、深い階層の大型サイトには特に好まれます。自分が見ているページより上の階層へ、すぐにアクセスすることができるのが特徴です。矢印やフローチャート風など、サイトによって様々なデザインのパンくずリストがあります。

属性型パンくずリスト

カテゴリーによって分類しているパンくずリストです。ECサイトで商品をカテゴリごとに分類する際や、カスタマイズ可能なオプションを提供しているサイトなどで、検索フィルタのような役割を果たします。位置型パンくずリストと組み合わせて使用されていることもあります。

パス型パンくずリスト

こちらは、近年使われているサイトは稀と言えます。履歴型のパンくずリストとも呼ばれ、ユーザーがすでにクリックした検索結果から商品ページにアクセスするなどの動作をします。人気の無い理由としては、ブラウザの「戻る」ボタンと同じ機能しか果たさないため、あまり役に立つとは言えないためです。

正しいパンくずリストの実装

わかりやすいパンくずリストを設置するには、根本的にサイト構成をわかりやすく設計しておく必要があります。サイト内の構造が整理されていれば、おのずとパンくずリストも適切なものとなり、Webサイトを訪問するユーザーにとってユーザビリティの高いものとなるでしょう。

コンテンツの数が多くなるほど、パンくずリストを最適に保つことも難しくなりますが、正しく関連性を持たせたものを作成しましょう。

上段のリストはサイト内の構造もわかりやすく、ユーザーにもクローラーにも優しいリストですが、下段のものは最後のT-SHIRTだけが関連しておらず、適切ではありません。きちんとページをカテゴライズしてサイトを構成し、関連性を保ったパンくずリストを置きましょう。

また、パンくずリストはすべてのサイトやページに、絶対に必要なわけではありません。例えばサイトのホーム（トップページ）やランディングページなどは階層を伝える必要がないため、パンくずリストもいりません。

まとめ

パンくずリストの構造や、役割などを説明してきました。さりげなく設置されていますが、重要な存在を担っているということを、おわかりいただけたかと思います！

SEO最適化への貢献も大きいパンくずリストでしたが、その他SEOに関する関連する記事はこちらで紹介しております。

【SEO関連の記事】
あなたのサイトは大丈夫？【SEOの基礎知識】