ナビゲーションは、グローバルナビゲーションに限らず、奇をてらわず、ユーザーが迷わず感覚的に使えるように、目につきやすい適切な位置に配置しよう。
ナビゲーションの役割
目的ページに誘導すること。
ナビゲーションの種類
- グローバルナビゲーション
- ローカルナビゲーション より細部のメニュー。通常、サイドに配置する。
- ページナビゲーション 記事の前後へのリンク。
- フッターナビゲーション
グローバルナビゲーションは、ユーザーが迷わず利用できるよう、どのページにも同じ位置に配置された「トップの横並び」がおすすめである。
・サイト全体の統一感を持たせながら、ナビゲーションの存在をアピールしたい場合、上手に配色を用いましょう。
メニュー項目の配色を変えることによって、ページ内がブロック分けされ、一目で目に付きます。
・また、メニュー項目は、7個を限度に4〜5個に絞るのが理想的である。
また、ユーザーが一目で理解できるように、メニュー項目は、日本語の方がよい。
ユーザビリティに優れたサイトにするには。
- ユーザーが選択したメニュー項目に下線もしくは上線を付ける。
- 選択中のメニュー項目に背景色をつける。
- メニュー項目に文字と共にイラスト、アイコンを用いる。
- 「問い合わせ」「検索窓」など目立たせたいものは、一番右に配置するとユーザーの目を引く。
- リスト項目が多量の場合は、優先順位をつけ、メリハリを付ける。
HTMLのul 要素でメニューの作成
Webサイトのナビゲーションメニューは、HTML文書にリスト要素である ul 要素で作成する。
主要なナビゲーションメニューである場合は、nav 要素で囲み、HTMLを作成する。