サイトの構造などをわかりやすくガイドしてくれる「パンくずリスト」は、ほとんどのWebサイトに取り入れられています。しかし、「パンくずリストはどうやって作成すればいい?」「パンくずリストはSEOに影響がある?」と疑問に思っている方も多いでしょう。そこで本記事では、パンくずリストの種類やSEO効果、パンくずリストの作り方などをわかりやすく解説します。
目次
Webサイトにアクセスしてカテゴリーやページを選択したときに、ページの上部に「TOP>インテリア>リビングルーム>テーブル」といったようにこれまで辿った項目が表示されているケースがあります。このように、サイトを訪問したユーザーの現在地が一目でわかるようにナビゲーションしてくれるのが「パンくずリスト」です。
名前の由来はグリム童話の「ヘンゼルとグレーテル」の1シーンといわれており、森に迷い込んだヘンゼルとグレーテル兄弟が迷子にならないよう、自分たちが通ってきた道にパンくずを落としたことから、サイト内の位置表示を担うリストを「パンくずリスト」と呼ぶようになりました。
検索エンジンもサイトの構造を把握するためにパンくずリストを参照するといわれており、利便性だけでなくSEOにおいても大切な役割を果たしています。
パンくずリストはおもに3種類に分かれており、それぞれに特徴があります。種類によって目的や利便性に差があるので、自サイトの構造にあわせて導入する種類を検討してみてください。
位置型パンくずリストは、もっとも一般的なパンくずリストといわれており、「トップページ>大カテゴリー>小カテゴリー>記事」といったように、ユーザーが階層内のどこにいるのかを示します。位置型パンくずリストはサイトの構造をもとに表示されるため、各ページに同じものが表示されます。ピラミッドのように階層構造に広がりのあるサイトに設置するのに効果的です。
属性型パンくずリストは、アクセスしたWebページがどのカテゴリーに属しているのかを表示します。位置型パンくずリストとは違い、属性型パンくずリストはユーザーがそのページにたどり着くまでの経路が表示されるため、同じページでもユーザーの動線によって違うパンくずリストが表示されるのが特徴です。たとえば、物件検索サイトにおいて、ユーザーAとBが同じ物件ページにたどり着いたとしても、絞り込み条件などによってパンくずリストには次のような違いが生まれます。
属性型パンくずリストは、多数のページが存在するときにフィルタのような役割を果たしてくれます。
パス型パンくずリストは、階層とは関係なく、ユーザーが閲覧したページの履歴を表示します。たとえば「カテゴリー“デスクチェア”>カテゴリー”ゲーミングチェア”>〇〇チェア」といったように、階層に関係なくユーザーのアクションをそのまま履歴として表示するため、現在地が把握しにくいというデメリットがあります。構造をわかりやすくすることを目的としていないので、パンくずリストとしての役割を果たさない可能性があります。
パンくずリストは単純に現在地を把握できるだけでなく、SEO上でも効果を発揮するといわれています。パンくずリストを設置する効果はおもに次の3つです。
パンくずリストを表示してサイト内の階層をわかりやすくすることによって、検索エンジンのクローラーがサイト全体をクロールするスピードが速くなります。クローラーが効率的に巡回すれば、追加したコンテンツがインデックスされやすくなるといわれています。より多くのコンテンツがインデックスされることで、キーワードの網羅性や専門性が評価され、検索順位に好影響を与える可能性が高くなります。
ユーザーにとって、パンくずリストがあることによってサイト内の経路を辿ったり、一つ前の階層に戻ったりなどをしやすくなり、ユーザビリティの向上が見込めます。サイトの信頼性などを数値化したドメインパワーの判断基準は検索エンジンごとにアルゴリズムに違いありますが、根本的にユーザビリティの高さが大きな影響を与えています。そのため、ユーザビリティを向上させることでサイトの評価アップが見込めるでしょう。
サイト構造のわかりやすさは検索エンジンからの評価に直結するといわれているため、パンくずリストを設置してサイト構造や階層をわかりやすくすることによってサイト評価が上がる可能性があります。実際にGoogleが公式に出している「検索エンジン最適化(SEO)スターターガイド」でも、パンくずリストの使用を推奨しています。
パンくずリストを設置する方法はおもに次の2つです。
WordPressをはじめとするCMSにプラグインをインストールする方法は、簡単で正確に設置できるのでおすすめです。「Breadcrumb NavXT」や「Really Simple Breadcrumb」などのプラグインをWordPressの画面上から追加するだけで、パンくずリストを追加できます。
htmlでパンくずリストを書く場合は、4つのタグをhtml(body)内に記載する必要があります。手順は次のとおりです。
navタグはページ内の指定部分や、ほかのページへの誘導を定義するためのタグです。リスト全体をnavの入れ子にするためにnavタグを記入します。navタグを使用しなくてもパンくずリストを作成することは可能ですが、navタグを使用することによって記述部分がナビゲーションセクションであることが明確になるため、クローラーが巡回しやすくなります。
olタグは番号付きのリストを表示するときにliタグを囲うためのタグです。navタグの中に子要素としてolタグを配置しておきましょう。このとき、CSSを適用する際に識別しやすくなるよう、class名を指定しておくのがおすすめです。
liタグはリストの項目を表示するために使用するタグです。olタグの中に記述する際は、パンくずリストを設置するページより上の階層数のliタグを記述しておきましょう。
aタグはほかのページへのリンクを貼るとき、テキストを定義するためのタグです。aタグはliタグの中に配置し、リンクテキストを記述します。リンクテキストはそのままWebページに表示されるため、できるだけ簡潔にして一目でわかるテキストを心がけましょう。意識的にキーワードを含めるのも一つの方法です。
パンくずリストを設置することによってSEO上の効果を得たい場合、次の3つのポイントに注意してみてください。
いくらパンくずリストを設置して現在地を表示しても、サイト内の構造が複雑だと、検索エンジンのクローラーがサイトを巡回しにくいほか、実際にサイトを閲覧するユーザーからしても利便性が高いとはいえません。たとえば、複数あるカテゴリーのうち特定のカテゴリーのみページが多く、コンテンツの重複が見られたり、階層が深すぎてどの地点にいるのかわからなくなったりすると、検索エンジンからの評価もユーザーからの評価も下がってしまいます。サイトを運営しながら構造を考えて増築するのではなく、運営を始める前にサイト設計を綿密に行うのがおすすめです。
サイトマップのメリットとは?Webサイト構造の理解から最適化まで解説
パンくずリストは検索エンジンが巡回しやすいよう、テキストで構造をわかりやすく伝えてあげるのも重要なポイントです。現在の位置やカテゴリーを示すためのアンカーテキストにターゲットキーワードを含めるようにすると、検索エンジンのクローラーがサイトの構造を理解しやすくなるでしょう。上位階層のページはパンくずリストから内部リンクが集まるので、アンカーテキストにキーワードを設定しておくことで上位表示が狙いやすくなります。
パンくずリストは、ユーザーやクローラーが迷子にならないよう、ほとんどすべてのページに設置するのが一般的です。ただし、コンバージョンを狙いたいページに関しては離脱を防ぐため、あえてパンくずリストを設置しないケースもあります。パンくずリストを含め、目的とする出口にユーザーが自然にたどり着くことができるよう、うまく同線を引くのがおすすめです。
コンバージョンとは何か?基礎知識や種類、ビジネスで活用し成功に導く方法を解説
パンくずリストはサイトに訪れたユーザーに回遊してもらったり、検索エンジンのクローラーにサイトを効率的に認識してもらったりするために有効といわれています。パンくずリストには種類があるため、求める効果やサイトの構造によって使い分けましょう。パンくずリストを含め、サイトの評価を着実に高めていくためには、適切なSEO対策を講じるのがおすすめです。正しいSEO対策がわからない方は、SEOの専門家に相談し、効率的なサイト運営を目指してみてください。さまざまな企業へSEOコンサルティングサービスを支援している弊社へぜひお問い合わせください。
SEO最新情報やセミナー開催のお知らせなど、お役立ち情報を無料でお届けします。