ユーザーに有用な12種類の効果的なナビゲーション
Post on:2009年7月23日
ユーザーに有用なウェブサイトをナビゲートする12種類のナビゲーションをOnextrapixelから紹介します。

12 Navigation Options That Help Users Navigate Through Your Website Effectively
下記に、12種類のナビゲーションとそのポイントをピックアップしました。
- 1. Classification Path Navigation
- 2. Core Navigation
- 3. Document Navigation
- 4. Drop-down Navigation
- 5. E-commerce/Shopping-cart Navigation
- 6. Feature Navigation
- 7. Global Navigation
- 8. Homepage Navigation
- 9. Language and Geographic Navigation
- 10. Personalized Navigation
- 11. Progress Chart Navigation
- 12. Related Navigation
1. Classification Path Navigation

階層を明示したナビゲーション、いわゆるパンくず
通常ページの上部に配置され、そのページの階層上の現在位置をあらわすと共に上位階層の移動ができます。
2. Core Navigation

コア ナビゲーション
大量のコンテンツを保持したサイトに適しており、通常アルファベット順に並べます。
3. Document Navigation

ドキュメント ナビゲーション
テキスト内に埋め込むリンクで、あまりにも多くの設置には適しません。
4. Drop-down Navigation

ドロップダウン型 ナビゲーション
通常多くのリンクを省スペースに表示する目的で使用されます。表示される項目は一つのみのため、グローバルや重要なものをドロップダウン内に設置するのは避けてください。
5. E-commerce/Shopping-cart Navigation

Eコマース用 ナビゲーション
Eコマースやショッピングサイトで購入プロセスに通じるものです。全てのページで目立つ位置に配置し、一般的にはページの上部に配置します。
6. Feature Navigation

フィーチャー ナビゲーション
打ち出したいコンテンツやニューリリースなどを一時的に配置し、トップページなどの主要ページから即座にアクセスできるようにするものです。
7. Global Navigation

グローバル ナビゲーション
サイトの最も重要なセクションへのリンクが配置され、全てのページに使用されるナビゲーションです。ページの最上部やフッタ(テキストで)に設置されています。
8. Homepage Navigation
トップページ
トップページの重要な役割は、ユーザーにコンテクストを与えることです。ページに訪れた時に、どこであるか、と正確に知る必要があります。
グローバルやコアなどのナビゲーションや検索機能はすぐに分かる位置に配置する必要があります。また、フィーチャーナビゲーションで重要なコンテンツの要約を提供するとよいでしょう。
9. Language and Geographic Navigation

言語や地域用のナビゲーション
複数の地域を対象としたサイトでは、異なる言語や地域別のナビゲーションを用意します。配下ページに設置する際には、グローバルナビゲーションに配置します。
10. Personalized Navigation

パーソナライズ ナビゲーション
利用するユーザーごとにカスタマイズされたナビゲーションです。
11. Progress Chart Navigation

プログレス チャート ナビゲーション
ショッピングや問い合わせなど、進捗が確認できるナビゲーションです。全てのステップ、現在のステップを明示します。2つ以上のステップは常に表示するようにします。
12. Related Navigation

関連 ナビゲーション
主題に関する情報を表示し、その主題の下に配置します。関連した他のセクションや他のウェブサイトへのリンクを提供します。
sponsors