パンくずリスト(ブレッドクラム)は垂直方向ナビゲーション

パンくずリスト(ブレッドクラム)垂直方向ナビゲーション


ホームページ(ウェブサイト)の工夫として、パンくずリスト(ブレッドクラム)というものがあります。

パンくずリストはサイト内のウェブページ間の垂直方向の関係性を示すナビゲーションとしての機能があります。

Home » Web制作・Web関連

パンくずリスト 例

パンくずリスト 例

このような形で、現在のページがホームページから見てどの位置にあるのかを示すものがパンくずリストです。

ホームページ(ウェブサイト)を制作する上で、意識することの一つが、ユーザーの操作性であるユーザビリティです。このパンくずリスト(ブレッドクラム)の設置はユーザービリティを高める工夫の一つとして考えることができます。

リッチスニペット(構造化データ)の設定としてのパンくずリストの設置

リッチスニペット(構造化データ)の設定としてのパンくずリストの設置

そしてもう一つの対検索エンジン、つまりSEOのひと工夫として、ホームページ(ウェブサイト)の構造を示す、リッチスニペット(構造化データ)の設定としてのパンくずリストの設置という側面もあります。パンくずリストは、ページ間の親子関係を示すことつながり、ページの関係性を検索エンジンに伝えるという機能があります。

しかしながら特段リッチスニペットのみを意識することなく、このような工夫はかなり古くからあり、ひとえにユーザーへのナビゲーション機能としての配慮として、より良いホームページ(ウェブサイト)を作るのために施策されてきました。

パンくずリストはホームページ全体の中のページの現在位置を示し、リンクによって他のページへの垂直方向の移動を促したり、検索エンジンに対して親子関係を示してページ間のまとまりや関連性、重要度を示すことに役立ちます。

ナビゲーションの方向 縦と横(垂直と横断)

ホームページのページナビゲーションの方向 縦と横(垂直と横断)

ページナビゲーション「ウェブサイトのユーザビリティ」で少しお伝えしましたが、サイト内のコンテンツ(ウェブページ)同士の関連性、ページ間移動の容易性は、サイトユーザーにとっては非常に重要になります。

ウェブサイトは、ホームページ(トップページ)をトップインデックス(最上位の索引)として、階層の構造になっています。

トップを軸として、様々なカテゴリーがあり、その下部にカテゴリーに属する個別のページ群が設置されている構造が一般的です。

トップページがあり、その下に「Web制作・Web関連」や「お知らせ」というカテゴリーがあり、その下に個別のコンテンツページがあるという階層になっています。

このあるページと下層ページとの親子関係をリンク付きで示すものがパンくずリスト、ブレッドクラムです。

単純にトップページからのページの位置を示すという機能だけでなく、パンくずリストのリンクによって垂直方向としてのナビゲーション機能をもたらすことができます。

旧来からこうした階層はディレクトリ構造を利用して示されてきました。現在でもそのディレクトリによって階層性を示すことはできますが、それ以上にページ間の関係を直接示すのが構造化データとしてのパンくずリストです。

パンくずリストは階層の上位へと縦方向のナビゲーションを示す

パンくずリストは階層の上位へと縦方向のナビゲーションを示す

同一カテゴリー内の移動やカテゴリ一ページから他のカテゴリーページへと移動するパターンを横方向だとすると、パンくずリストは、階層の上位へと縦方向のナビゲーションを示す機能になります。

同一カテゴリー内の前後のページ移動する場合は横方向ですが、例えば、現在のページの親ページにあたる「カテゴリーページ」への移動は縦方向だと言えます。

パンくずリスト・ブレッドクラムは、そのページから見て親にあたるページ群を示します。この親子関係のナビゲーションリンクと共に特殊なマークアップを施すことで、検索エンジンにもページ間の階層の概念を示すことができます。

このことからパンくずリストはSEOの一つの要素であり、ページ間の階層を検索エンジンに示すことによってページ同士のまとまりや優先されるべきページの提示に役立ちます。

垂直方向への移動の進行方向の違い

垂直方向への移動の進行方向の違い

同様にカテゴリー一覧ページからの個別ページヘの移動も縦方向です。

ただ、現在のページから「カテゴリーページ」への移動は上へ、カテゴリー一覧ページからの個別ページヘは下へと移動していることから、同じ垂直方向への移動だとしても、進行方向が異なります。

ホームページ制作(ウェブサイト制作)の重要なポイントは、様々なページ、とりわけ探しているページヘの移動が用意になることです。リンクをクリックしてページを移動するといったユーザーの使い勝手への配慮はページの回遊率、PV数に影響を及ぼします。

一度トップやカテゴリーページに戻らなくても同一カテゴリの前後ページなどへ移動することのできる横方向のナビゲーションも重要ですが、すぐに上位ページに移動できるようにしておくという垂直方向の移動の容易性も、ユーザビリティに大きく影響します。

そのユーザビリティとしての要素は同時に検索エンジンに対しても影響を与えるため、パンくずリストの設置はSEOにも影響を与え、構造化データをマークアップして正確に内容を伝えることで、より高いSEO効果を期待することができます。

パンくずリストでウェブページの親子関係を示す

パンくずリストでウェブページの親子関係を示す

「パンくずリスト」は、英語では「ブレッドクラム」と呼ばれ「ブレッドクラム」は「パンくず」という意味を持っていますが、英語圏ではない日本では意味がわかりにくい単語です。

このパンくずリスト(ブレッドクラム)で検索エンジンに対して、ディレクトリ階層以外の方法としてページ間の親子関係を示す事ができます

ページ間の親子関係をパンくずリストで示すことによって、同じ親ページをもつ子ページ間の関連性やページの重要度を検索エンジンに示すこともできます。

「ブレッドクラム」の由来

「ブレッドクラム」の由来

サイトの階層を示す道しるべが「パンくず」と言われてもよくわかりませんが、このブレッドクラム(breadcrumb)の名称は、「ヘンゼルとグレーテル」から来ているようです。

森の中で道に迷わないように、通った道にパンの切れ端を落としながら歩いたというストーリーが由来になっているようです。

ページの親子関係

パンくずリスト ページの親子関係

パンくずリストは、ウェブサイトユーザーが、一目見てサイトのどの位置にいるのかがわかるため、検索エンジン経由でランディングページとしてコンテンツページにやってきた場合には、ページの親子関係がわかるため、

一般的には、次のような形でパンくずリストが設置されます。

ホーム > カテゴリページ名 > 詳細コンテンツページ名

カテゴリに子カテゴリがある場合は、

ホーム > 親カテゴリページ名 > 子カテゴリページ名 > 詳細コンテンツページ名

というパターンになります。

ページ回遊率向上にプラスに働く

ページ回遊率向上にプラスに働くパンくずリスト

トップページからの検索流入からのページ回遊のときにもこうしたパンくずリストは役立ちますが、コンテンツマーケティング導入などで、コンテンツページがランディングページ(一番最初に訪問されるページ)であるケースが増えてきた現代では、現在のページの階層位置を示すことに加えてリンク機能による縦方向ナビゲーションがユーザーの満足度向上にプラスに働くでしょう。

ユーザビリティとクローラビリティ SEOとしての役割

パンくずリスト ユーザビリティとクローラビリティ SEOとしての役割

パンくずリストは、一般的にはナビゲーション機能をもたらすために、各名称(ページタイトルなど)にリンクが施されます。

各ページにこのようなパンくずリストを単純に記載してもユーザビリティを高めることができますが、さらに構造化データで、検索エンジンに対して、垂直の親子関係を示すことができます。

構造化データとしての「パンくずリスト」

このようなパンくずリストの工夫は、PV数向上のための回遊率を高めることにもプラスに働き、同時にページのまとまりを検索エンジンに示すことにもつながります。

構造化データ パンくずリスト(参考例 Search Console)

構造化データ パンくずリスト(参考例 Search Console)パンくずリストが設置されていたとしても、「構造化データ」としてのマークアップがきちんと設定されていない場合は、パンくずリストのSEO効果が最大限に発揮されません。パンくずリストの正規構造化データの不存在である場合は、パンくずリストの正規構造化データマークアップを実施しましょう。

パンくずリストの設置、およびパンくずリストの構造化データマークアップは、リッチスニペットの表示だけでなく、各ページヘのリンクによりクローラビリティも向上するため、SEOとしての役割も十分に期待できます。

リッチスニペット(構造化データ)

(初回投稿日 2016年3月1日)

「パンくずリスト(ブレッドクラム)垂直方向ナビゲーション」のカテゴリ Web制作・Web関連
タグ: , , ,


ホームページ制作・カスタマイズ、Webマーケティング・SEOなどのお問い合わせ・ご依頼