パンくずリストとは?WEBサイトに必要な理由を解説!

WEB関連

パンくずリストをご存知でしょうか?知らないという方でも、この記事をご覧いただけているのであれば、必ず目にしているものです。

この記事のタイトル上部に次のような表記はありませんか?『トップ > 私たちのIT技術(フォーザウィントピックス) > WEB関連 > パンくずリストとは?WEBサイトに必要な理由を解説!』

これこそが、「パンくずリスト」と呼ばれるものです。

今回は、このパンくずリストについてご紹介します。

もくじ

  1. パンくずリストとは
  2. パンくずリストのメリット
  3. パンくずリストの注意点
  4. まとめ

◆パンくずリストとは

パンくずリストとは、Webサイトのページ階層をリスト化したナビゲーションのことを指します。

設置する位置は基本的にはページ上部のヘッダー下辺りにあるケースが多いです。

ページの階層が多かったり、階層構造複雑な場合、ユーザーは現在自分がどのページ階層にいるのか分からず迷ってしまうケースがあります。その際、ユーザーが今いる位置をリスト化することで視覚的に分かりやすくしたものになります。

名前にある「パンくず」がついた由来は、グリム童話の『ヘンゼルとグレーテル』から来ています。物語において、兄妹は道に迷わないようパンくずを置いていくエピソードがあります。このお話しに由来し「通ったページ・今いるページ」を表す言葉としてWebでは「パンくずリスト」と呼ばれるようになりました。

◆パンくずリストのメリット

パンくずリストを設置するメリットは以下のような例があります。

ユーザーが迷いにくくなる

パンくずリストを設置すれば、ユーザーがWebサイト上で迷いにくくなります。

例えば当記事ですと、ブログ内の「WEB関連」というカテゴリにこの記事へ入っていることが分かります。そして訪問したユーザーがWEB関連のカテゴリから別の内容の記事を見たいとき、一つ前の階層へ行けば、WEB関連の一覧ページへ移動することができます。

ここで覚えておきたいのが、サイトに訪れたユーザーが全員トップページにランディングしているわけではないということです。ユーザーの中には、悩みに関連するワードを検索してブログ記事などに直接ランディングするケースもあります。その際、パンくずリストがあれば、トップページ以外からアクセスしたユーザーに対しても、階層構造を直感的に認識させることに期待できるのです。

検索結果順位の向上を期待できる

パンくずリストを導入すれば、検索エンジンによるクロールが効率的に行われ、重要なページが認識されやすくなり、検索結果のランキング向上につながるメリットが期待できます。

検索エンジンはWebサイトをクロールし、独自のアルゴリズムで検索結果の順位を決定しますが、サイトの複雑な構造やクロール可能なページが制限されてしまうと、検索結果への表示が妨げられることがあります。

そこで、パンくずリストを設置することでサイトの構造が整理され、検索エンジンが構造を理解しやすくなります。それにより検索エンジンから高い評価を得ることにより、検索順位の向上にも期待できるのです。

◆パンくずリストの注意点

パンくずリストを設置する際、以下の内容に注意しましょう。

シンプルな構造

パンくずリストは、構造を深くしすぎるとかえってユーザーの可読性を下げてしまう恐れがあるため、できるだけシンプルな設計を心がけましょう。

基本全てのページに設置する

パンくずリストは基本的には、全てのページに設置するようにしましょう。特に評価対象となるページには、SEO評価の向上に繋げるためにもマストで設置しましょう。

レスポンシブ対応させる

パンくずリストを設置する際は、レスポンシブ対応を意識する必要があります。

パンくずリストは仕様上、横に長くなりがちです。もし、レスポンシブに対応せずに、スマートフォンのような横幅が短いデバイスで見ると文字サイズが大きく複数行で表示されてしまい、かえって見にくいです。

そのため、パンくずリストの文字サイズを変更したり、横スクロールの設定や文字数の制限など、各デバイスに合った仕様になるように調整しましょう。

◆まとめ

今回はパンくずリストについてご紹介しました。

パンくずリストは、ユーザーが今いる階層を迷わないようにする外面的な効果とともに、SEO評価を高める内面的な効果もあります。

自社のWebサイトにパンくずリストは設置されているか、設置されているが構造が複雑になっていないか、今一度確認してみてください。

採用情報を見る >