ナビゲーション設計って何？基本を解説します。

ナビゲーション設計とは、サイト内でユーザーが目的とするコンテンツに迷うことなくスムーズにたどり着きやすいようサイト全体を設計することを言います。良いナビゲーション設計ができればユーザビリティも向上しサイトの目的、ユーザーの目的双方の解決に繋がります。サイトとしてのパフォーマンス（ユーザービリティ）を上げる上で重要な要素なのでここで基本を押さえましょう。

ナビゲーション設計の目的と基本

ナビゲーション設計の目的はずばり、サイトに訪れたユーザーがサイト内で迷わず目的とするコンテンツにスムーズにたどり着けるようにすること。つまりユーザビリティを向上させることにあります。ユーザビリティを向上させるためのポイントはいくつかありますが、中でもナビゲーション設計の最適化は特に大きな効果を発揮します。ナビゲーション設計では主に以下の指標を意識することが重要です。

ユーザビリティに関しては下記記事をご参考ください。

ナビゲーション設計で考えたい主な指標

①少ない負担でユーザーがサイト内を移動できるようにする
②ユーザーが今自分がどこにいるのかを把握できるようにする
③ユーザーに目的とするコンテンツまでのルートを直感的に理解させる

つまりユーザーが今どこにいるのかを常に把握させ、目的とするコンテンツまでのルートを直感的に理解できるようにすることと、できるだけ最短ルートで移動できるような工夫が必要です。

ユーザーがサイト内で迷いどこにいるのかも分からず目的としているコンテンツまでのルートも分かりづらい作りになっていてはユーザーも混乱しますし、見て欲しいコンテンツも見落とされ双方の目的も敵わないまま離脱してしまうかもしれません。使い勝手が悪ければ最悪２度とサイトを見てくれないといったことも起きかねないので必ず配慮するようにしましょう。

効果的なナビゲーション例

上記のような指標をクリアするには複数のナビゲーション形式を使用するのが理想です。なおかつユーザーを迷わせないよう、それぞれのナビゲーションの見た目や操作性・機能はサイト全体を通して一貫させるようにしましょう。

以下は7つの代表的なナビゲーションの例になります。一般的に普及しているナビゲーションの形はすでにユーザーの中で経験則が備わっている可能性もあるため、代表的なものを使うだけでもほとんどのユーザーは迷うこともなくなるでしょう。これらのナビゲーションを組み合わせて導入しユーザビリティの向上に生かして下さい。

参照元 TCD（＊参照サイト：EVERY／MASSIVE）

ワードプレステーマTCD

7つの代表的なナビゲーション

グローバルナビゲーション
もっともよく使われるのが、このグローバルナビゲーションです。サイト内における各種主要ページ（大カテゴリに属するページ）へのナビゲーションリンクで一般的に全てのページにおいて同じ箇所に表示されます。

ローカルナビゲーション
主に大カテゴリに属するページ内において表示されるナビゲーションで、同一カテゴリ内の移動もしくは同一カテゴリ内でさらに細分化された下層カテゴリのページに移動するための項目が記載されます。特に階層が深くなるようなサイトで使用され、カテゴリ数（項目数）の追加・削除も起こりうるためデザインが項目数に左右されないようにする事が大切です。

ブレッドクラムナビゲーション（パンくずリスト）
こちらも導入が強く推奨されるナビゲーションでユーザーが今いるページまでの経路・階層を表示します。こちらもグローバルナビゲーション同様、全てのページにおいて同じ箇所に表示されます。これがある事によってユーザーは今いる場所と、そこまでの経路がわかるため自分の現在位置を正確に把握する事ができます。ブレッドクラムナビゲーションがあるのとないとではユーザービリティやサイトの使い勝手が大きく変わるため、理由がない限りはデフォルトで導入するように検討しましょう。

関連ナビゲーション
今いるコンテンツページ内などにおいて「関連コンテンツ」や「関連記事」などに誘導するためのナビゲーションです。今いるページから自然な形で別コンテンツへのページ遷移を誘導できるため、適切に配置する事で負担も少なくサイト内の回遊を促進できます。

コンテンツ内ナビゲーション
テキストなどコンテンツの中にそのまま配置するナビゲーションです。テキストの中に配置されるテキストリンクが一般的で、Webサイト内の別のページもしくはWebサイト外の別のページに飛ぶなどの使い方がありますが、飛んだ先でユーザーが居場所を見失わないように配慮する事が大切です。

サイト内検索窓
ナビゲーションメニューからの遷移ではなく、ユーザーが任意の単語を直接入力し該当ページに遷移するためのナビゲーションです。任意の単語で移動するためその他のナビゲーションではカバーできないようなサポートも可能ですが、検索結果の有無にかかわらず検索結果画面のページを必ず用意するようにしましょう。サイト内検索窓自体は実際にはグローバルナビゲーションやローカルナビゲーション内に取り込まれる形が多いです。

ページネーション
複数のページを並行して行き来する時のために使用されるナビゲーションです。例えばサイト内検索窓からの検索で該当ページが多量に出てきた場合に各検索結果をページをまたいで表示したり、同一ページ内でコンテンツの量が多すぎる場合にページを分割するために使用します。ブログやメディアサイトなどであればPV数を増やすために使用する場合があります。

以上、ナビゲーション設計の基本と代表的なナビゲーション例を解説しました。基本的にはここで紹介したナビゲーションを使うことで、ユーザーが使いやすいサイトを構築していくことが可能です。特に大規模サイトではこれらを組み合わせることで必要箇所に効果的なナビゲーションを漏れなく組み込むことができるはずです。それぞれのナビゲーションの特性を知り活かしていきましょう。