検索エンジンへのSEO対策やユーザーの利便性を向上させる方法として、パンくずリストの設置は必須になります。実際に多くのWebサイトで初期設定として実装されていますが、種類や役割についてはあまり理解されておらず、最適な設定になっていないケースがほとんどです。そこで今回は、パンくずリストの種類から設定の注意点まで解説します。
パンくずリストとは？
まずは、基本となるパンくずリストの概要について解説します。
パンくずリストの役割
パンくずリストとはユーザーがサイトのどこにいるかを視覚的にわかりやすくした誘導表示で、ナビゲーションの役割があります。パンくずリストの表示は「ホーム>カテゴリー>商品情報>詳細情報」といった流れが一般的です。
階層構造のナビゲーションを表示しておくことで、例えばユーザーが他の商品も見たいと思ったときに、すぐにカテゴリーへ移動できようになります。このように、閲覧しているページの階層構造が一目で理解できることでユーザーの利便性が向上します。
パンくずリストの由来
パンくずリストは、グリム童話「ヘンゼルとグレーテル」で兄妹が道に迷わないように森の中に残していったパンくずが由来しています。パンくずリストだけ聞くと分かりづらいですが、ユーザー自身が辿ってきたルートと現在の位置を示す役割だと把握すると理解できます。
パンくずリストのメリット
パンくずリストを設置することで、ユーザーと検索エンジンのどちらに対してもメリットがあります。
ユーザー側のメリット
パンくずリストを設置することで、辿ってきた経路とサイト上のどこにいるか分かるようになります。これによりユーザーがサイト内で迷うことがなくなり、利便性の向上と離脱率の低下に繋がります。また、別のカテゴリーや商品情報へ移動しやすいので、サイト回遊率も向上するというメリットがあります。
検索エンジン側のメリット
検索エンジンがパンくずリストを辿ることで、クローラーがサイト内の階層構造を把握しやすく、素早く正確にインデックスされるようになります。さらに、パンくずリストのアンカーテキストは、自動的に内部リンク対策になります。特にカテゴリーページは商品情報などの下層ページから内部リンクが集中するので、SEO効果が期待できます。また、適切なパンくずリストは検索結果に表示されるようになるので、ユーザーはタイトルだけでなくカテゴリーや階層構造でクリックするかの判断ができるようになります。このように判断材料が増えるので、クリック率の向上も見込めます。
パンくずリストの種類
パンくずリストは表示形式で3種類に分けることができます。それぞれの特徴を把握して、目的に合ったパンくずリストを設置しましょう。
位置型パンくずリスト
位置型は、現在閲覧しているページが階層のどこに位置しているかを表示します。サイト構造がわかりやすくユーザーも回遊しやすいので、広く利用されている基本的なパンくずリストです。位置型は表示される階層のリストが同じなので、ユーザーがサイト内の現在位置を把握するのに役立ちます。また、ユーザーは現在のページより上層のページへ1クリックで戻ることが可能なので、カテゴリーや階層が多いサイトに向いています。
属性型パンくずリスト
属性型は、現在の位置ではなく閲覧ページがどのカテゴリーに分類されているのかを表示します。カテゴリー分類やタグをもとにしたリスト表示なので、ユーザーがもっと同じカテゴリーの記事を見たい場合に検索しやすくなっています。ユーザーの操作に応じて表示が変化していくので、メーカー別などで商品分類が多く、カテゴリー検索が必須のECサイトなどに向いています。
小見出し：パス型パンくずリスト
パス型は、ユーザーが移動してきたページの履歴を表示します。同じページを閲覧しているユーザーでも、どのようなルートでそのページにアクセスしたかでパンくずリストの表示が変わるのが特徴です。しかし、ブラウザの「戻る」や履歴機能と同様の役割なので、使用しているサイトが少ないパンくずリストになります。
WordPressでの設定方法
ここからは、WordPressでパンくずリストを設定する方法を解説します。主な方法は、以下の2種類になります。
HTMLで設置する
パンくずリストをHTMLで設置する場合、<body>と</body>の間に記述していきます。
<body>
<a href=”index.html”>ホーム</a> >
<a href=”tent/index.html”>カテゴリー名</a> >
<a href=”tent/index.html”>商品情報など</a> >
詳細情報など
</body>
このように「<a href=」にはリンク先で「</a>」の前にはアンカーテキスト、「</a>」の後には 「> 」を記述します。カテゴリーや階層を増やしたい場合は「<a href=」を追加していきます。
プラグインを利用する
基本的にパンくずリストはテーマに含まれていることが多いので、プラグインで設置するのが主流です。人気のプラグインには「Breadcrumb」と「Breadcrumb NavXT」があります。
「Breadcrumb」はプラグインの管理画面で設定したショートコードを、テーマ編集などで貼り付けることでパンくずリストを追加するプラグインです。細かく設定できて5つデザインテーマから選ぶことも可能なので、簡単にオリジナリティのあるパンくずリストが作成できます。
「Breadcrumb NavXT」はショートコード以外にもウィジェットを使用してパンくずリストを簡単に追加できます。テーマ編集などのコードが分からなくてもパンくずリストの挿入が可能です。設定もシンプルなので初心者におすすめのプラグインになります。
パンくずリストを設定する際の注意点
パンくずリストを設定する場合は、以下の注意点を把握しておく必要があります。
分かりやすい階層構造と関連性のあるカテゴリー分類にする
パンくずリストはユーザーが見てすぐに分かる簡単な構造と、関連性があるカテゴリーの繋がりにしましょう。分かりづらい構造や突拍子もないカテゴリーになっていると、ユーザーは利便性が悪いと感じて離脱したり、回遊率が下がってしまいます。
SEOキーワードを含める
パンくずリストはSEO効果が期待できるので、検索ボリュームの多いキーワードを適宜含めるのがおすすめです。特にカテゴリーは内部リンクも集中するので、できるだけ検索頻度の多いキーワードを含めましょう。しかし、キーワード含める際に詰め込みすぎたり不自然になるのはNGです。
全てのページに設置する
カテゴリー分類ができない特殊なページを除いて、基本的にパンくずリストは全てのページに設置します。設置していないページがあるとパンくずリストが繋がらず、ユーザーの利便性も向上しないので注意してください。
ページ上部（ヘッダー）に設置する
基本的にパンくずリストは、ユーザーに見やすいようにページ上部に設置します。下部に設置しても問題はないですが、検索エンジンはクロールの際にページ上部にあるパンくずリストを活用するので、下部に設置するメリットは特にありません。
現在のページは表示しない方がいい場合がある
ユーザーが現在閲覧しているページをパンくずリストに含めるとタイトルが長くなりすぎてしまう場合は、視認性が悪いので表示しないようにするのがおすすめです。例えば、商品ページで商品名が長いケースなどが当てはまります。
リンク切れを防ぐ
ページやカテゴリーを削除していて、パンくずリストのリンクが切れている場合は注意してください。そのまま表示してしまう、とユーザーが何もないページに飛んでしまい離脱に繋がります。こまめにパンくずリストのリンクを見直すことが大切です。
パンくずリストのよくある質問
最後に、パンくずリストに関する質問に回答していきます。
パンくずリストはスマホサイトにいらない？
スマホサイズのページにパンくずリストを設置すると、画面が圧迫されて表示範囲が小さくなる可能性があります。しかし、それでもメリットの方が圧倒的に多いので、スマホサイトでもパンくずリストは設置するのがおすすめです。
パンくずリストは複数設置してもいい？
パンくずリストは複数設置しても問題はありません。しかし、検索エンジンはHTMLソース上で1番目のパンくずリストをクロールするので、メインのカテゴリーは1番目になるようにしましょう。
パンくずリストが設置できているか確認する方法は？
パンくずリストが正しく設置できているかを確認するには、Googleの「リッチリザルトテストツール」がサーチコンソールの「パンくずリスト」を利用します。特にサーチコンソールは、有効なページとエラーページが一目で分かるのでおすすめです。
まとめ
パンくずリストはユーザーのページ移動に便利なだけではなく検索エンジン側のメリットも多く、より良いサイト設計において大きな役割を果たします。それでいてデメリットは設置する手間ぐらいなので、導入しない理由はありません。ぜひパンくずリストを活用して、ユーザーと検索エンジンの両方にとって見やすいサイトを目指してください。
