ホームページ(ウェブサイト)の工夫として、パンくずリスト(ブレッドクラム)というものがあります。
パンくずリストはサイト内のウェブページ間の垂直方向の関係性を示すナビゲーションとしての機能があります。
Home » Web制作・Web関連

パンくずリスト 例
このような形で、現在のページがホームページから見てどの位置にあるのかを示すものがパンくずリストです。
ホームページ(ウェブサイト)を制作する上で、意識することの一つが、ユーザーの操作性であるユーザビリティです。このパンくずリスト(ブレッドクラム)の設置はユーザービリティを高める工夫の一つとして考えることができます。
リッチスニペット(構造化データ)の設定としてのパンくずリストの設置
そしてもう一つの対検索エンジン、つまりSEOのひと工夫として、ホームページ(ウェブサイト)の構造を示す、リッチスニペット(構造化データ)の設定としてのパンくずリストの設置という側面もあります。パンくずリストは、ページ間の親子関係を示すことつながり、ページの関係性を検索エンジンに伝えるという機能があります。
しかしながら特段リッチスニペットのみを意識することなく、このような工夫はかなり古くからあり、ひとえにユーザーへのナビゲーション機能としての配慮として、より良いホームページ(ウェブサイト)を作るのために施策されてきました。
パンくずリストはホームページ全体の中のページの現在位置を示し、リンクによって他のページへの垂直方向の移動を促したり、検索エンジンに対して親子関係を示してページ間のまとまりや関連性、重要度を示すことに役立ちます。
ナビゲーションの方向 縦と横(垂直と横断)
ページナビゲーション「ウェブサイトのユーザビリティ」で少しお伝えしましたが、サイト内のコンテンツ(ウェブページ)同士の関連性、ページ間移動の容易性は、サイトユーザーにとっては非常に重要になります。
ウェブサイトは、ホームページ(トップページ)をトップインデックス(最上位の索引)として、階層の構造になっています。
トップを軸として、様々なカテゴリーがあり、その下部にカテゴリーに属する個別のページ群が設置されている構造が一般的です。
トップページがあり、その下に「Web制作・Web関連」や「お知らせ」というカテゴリーがあり、その下に個別のコンテンツページがあるという階層になっています。
このあるページと下層ページとの親子関係をリンク付きで示すものがパンくずリスト、ブレッドクラムです。
単純にトップページからのページの位置を示すという機能だけでなく、パンくずリストのリンクによって垂直方向としてのナビゲーション機能をもたらすことができます。
旧来からこうした階層はディレクトリ構造を利用して示されてきました。現在でもそのディレクトリによって階層性を示すことはできますが、それ以上にページ間の関係を直接示すのが構造化データとしてのパンくずリストです。
パンくずリストは階層の上位へと縦方向のナビゲーションを示す
同一カテゴリー内の移動やカテゴリ一ページから他のカテゴリーページへと移動するパターンを横方向だとすると、パンくずリストは、階層の上位へと縦方向のナビゲーションを示す機能になります。
同一カテゴリー内の前後のページ移動する場合は横方向ですが、例えば、現在のページの親ページにあたる「カテゴリーページ」への移動は縦方向だと言えます。
パンくずリスト・ブレッドクラムは、そのページから見て親にあたるページ群を示します。この親子関係のナビゲーションリンクと共に特殊なマークアップを施すことで、検索エンジンにもページ間の階層の概念を示すことができます。
このことからパンくずリストはSEOの一つの要素であり、ページ間の階層を検索エンジンに示すことによってページ同士のまとまりや優先されるべきページの提示に役立ちます。
垂直方向への移動の進行方向の違い
同様にカテゴリー一覧ページからの個別ページヘの移動も縦方向です。
ただ、現在のページから「カテゴリーページ」への移動は上へ、カテゴリー一覧ページからの個別ページヘは下へと移動していることから、同じ垂直方向への移動だとしても、進行方向が異なります。
ホームページ制作(ウェブサイト制作)の重要なポイントは、様々なページ、とりわけ探しているページヘの移動が用意になることです。リンクをクリックしてページを移動するといったユーザーの使い勝手への配慮はページの回遊率、PV数に影響を及ぼします。
一度トップやカテゴリーページに戻らなくても同一カテゴリの前後ページなどへ移動することのできる横方向のナビゲーションも重要ですが、すぐに上位ページに移動できるようにしておくという垂直方向の移動の容易性も、ユーザビリティに大きく影響します。
そのユーザビリティとしての要素は同時に検索エンジンに対しても影響を与えるため、パンくずリストの設置はSEOにも影響を与え、構造化データをマークアップして正確に内容を伝えることで、より高いSEO効果を期待することができます。
パンくずリストでウェブページの親子関係を示す
「パンくずリスト」は、英語では「ブレッドクラム」と呼ばれ「ブレッドクラム」は「パンくず」という意味を持っていますが、英語圏ではない日本では意味がわかりにくい単語です。
このパンくずリスト(ブレッドクラム)で検索エンジンに対して、ディレクトリ階層以外の方法としてページ間の親子関係を示す事ができます。
ページ間の親子関係をパンくずリストで示すことによって、同じ親ページをもつ子ページ間の関連性やページの重要度を検索エンジンに示すこともできます。
「ブレッドクラム」の由来
サイトの階層を示す道しるべが「パンくず」と言われてもよくわかりませんが、このブレッドクラム(breadcrumb)の名称は、「ヘンゼルとグレーテル」から来ているようです。
森の中で道に迷わないように、通った道にパンの切れ端を落としながら歩いたというストーリーが由来になっているようです。
ページの親子関係
パンくずリストは、ウェブサイトユーザーが、一目見てサイトのどの位置にいるのかがわかるため、検索エンジン経由でランディングページとしてコンテンツページにやってきた場合には、ページの親子関係がわかるため、
一般的には、次のような形でパンくずリストが設置されます。
ホーム > カテゴリページ名 > 詳細コンテンツページ名
カテゴリに子カテゴリがある場合は、
ホーム > 親カテゴリページ名 > 子カテゴリページ名 > 詳細コンテンツページ名
というパターンになります。
ページ回遊率向上にプラスに働く
トップページからの検索流入からのページ回遊のときにもこうしたパンくずリストは役立ちますが、コンテンツマーケティング導入などで、コンテンツページがランディングページ(一番最初に訪問されるページ)であるケースが増えてきた現代では、現在のページの階層位置を示すことに加えてリンク機能による縦方向ナビゲーションがユーザーの満足度向上にプラスに働くでしょう。
ユーザビリティとクローラビリティ SEOとしての役割
パンくずリストは、一般的にはナビゲーション機能をもたらすために、各名称(ページタイトルなど)にリンクが施されます。
各ページにこのようなパンくずリストを単純に記載してもユーザビリティを高めることができますが、さらに構造化データで、検索エンジンに対して、垂直の親子関係を示すことができます。
構造化データとしての「パンくずリスト」
このようなパンくずリストの工夫は、PV数向上のための回遊率を高めることにもプラスに働き、同時にページのまとまりを検索エンジンに示すことにもつながります。
構造化データ パンくずリスト(参考例 Search Console)パンくずリストが設置されていたとしても、「構造化データ」としてのマークアップがきちんと設定されていない場合は、パンくずリストのSEO効果が最大限に発揮されません。パンくずリストの正規構造化データの不存在である場合は、パンくずリストの正規構造化データマークアップを実施しましょう。
パンくずリストの設置、およびパンくずリストの構造化データマークアップは、リッチスニペットの表示だけでなく、各ページヘのリンクによりクローラビリティも向上するため、SEOとしての役割も十分に期待できます。
パンくずリストの3つのタイプ
パンくずリストは、サイトの構造をユーザーにわかりやすく伝えるための重要なナビゲーション要素です。
主に「階層型」「属性型」「履歴型」といった3つのタイプがあり、それぞれ異なる役割を持っています。
階層型はサイト全体における現在地を示し、ユーザーが迷子になるのを防ぎます。属性型は、オンラインストアなどでユーザーが選択した絞り込み条件を可視化し、よりスムーズに買い物ができるように助けます。履歴型は、ユーザーがたどってきた道のりを示し、前のページに簡単に戻れるようにします。
これらのパンくずリストを正しく設置することは、ユーザーの利便性を高めるだけでなく、事業にとっても重要な効果をもたらします。離脱率の低下や、検索エンジンからの評価向上につながることも期待できるかもしれません。パンくずリストは単なる道しるべではなくサイトの使いやすさを高めるための大切な要素です。
階層型パンくずリスト
階層型パンくずリストは、Webサイトの構造をそのまま表現する、最も一般的なタイプです。ユーザーがどの階層にいるのかを明示し、サイトの上位ページに戻ることを容易にします。
たとえば、「ホーム > サービス > Web制作」のような形式です。これは垂直方向のナビゲーションとして機能し、ユーザーがサイト内で迷子になるのを防ぎます。
属性型パンくずリスト
属性型パンくずリストは、オンラインストアでよく見かけるタイプです。ユーザーが絞り込み検索で選んだ条件をパンくずリストとして表示します。
例えば、Tシャツを探しているユーザーが「色:赤」と「サイズ:M」を選んだ場合、「ホーム > Tシャツ > 赤 > M」のように表示されます。これにより、ユーザーは自分の検索条件を簡単に確認し、変更することができます。
履歴型パンくずリスト
履歴型パンくずリストは、ユーザーがサイト内で閲覧してきたページの履歴を表示するものです。
「前のページに戻る」ボタンと似ていますが、複数の階層を一度にさかのぼることが可能です。
「ホーム > Tシャツ > Tシャツ(赤色)> Tシャツ(Mサイズ)」のように、ユーザーがたどってきた道のりを示します。
パンくずリストがもたらすユーザーと事業への大切な効果
パンくずリストを正しく設置することは、ユーザーの利便性を高めるだけでなく、事業にとっても重要な効果をもたらします。
パンくずリストは、サイト内を快適に移動できる道しるべです。これにより、ユーザーは自分が今どのページにいるのかを把握しスムーズに情報を探すことができます。サイトの構造がわかりやすいと、ユーザーはストレスなく閲覧を続けられ満足度が高まります。結果として、サイトの回遊率が上がり、再訪問につながる可能性も高まるでしょう。また、パンくずリストは、単に迷子を防ぐだけでなく、サイトの使いやすさを向上させ、ユーザーとの長期的な関係を築くための大切な要素です。
離脱率の低下
パンくずリストは、ユーザーがサイト内で迷ったときに、上位の階層に戻ることを助けます。これにより、ユーザーは目的の情報を見つけるためにサイト内をスムーズに回遊しやすくなります。結果として、サイトからすぐに離れてしまうことを防ぐかもしれません。
検索結果への影響
パンくずリストを適切に設定すると、検索エンジンのクローラーがサイトの構造を理解しやすくなり、サイト全体の評価が向上する可能性があります。また、検索結果ページにパンくずリストが表示されることもあり、ユーザーがページをクリックしやすくなることにつながります。
(初回投稿日 2016年3月1日)