WEBデザインファクトリーはちょっとでもWEBに興味のある方へ情報を提供します。

WEBサイトでグローバルナビの役割について

2012/03/01

タグ:

bowls

WEB関連の本を読んでも、スクールでも「グローバルナビ」は必ず必要なものとしていますね。本当のところ、役割って何なんでしょうか。ちょっと気になったので調べてみました。

グローバルナビ=「目次」

グローバルナビは目次のように、ユーザーを迷わせないためにあると思います。 グローバルナビがないとユーザーは迷ってしまい離脱率が上がってしまいます。せっかく来てくれたユーザーもすぐに他のWEBサイトに行ってしまうのは避けたいことですよね。

グローバルナビの役割

  • あるページから別のページへのリンク手段を適切に提供する。
  • 現在のページ(現在地)と他のページ(見たいページ)との関係性を明示する。

大きく分けて以上のような役割があると思います。

グローバルナビを作る時の注意点

  • サイトの目的(ゴール)
  • 内容
  • 構造
  • ターゲット
サイトの目的(ゴール)

最終的にどのページに来てほしいかを明確にする必要があると思います。例えば、お 問い合わせページ、予約、決済ページなど。なので、グローバルナビをを作る前に今一度サイトの目的を再確認をしましょう。

内容

すぐにページ内容が連想しやすい文字、アイコンを使用したほうがいいでしょう。さらに、メニュー項目は最大でも7つくらいにとどめたほうがいいと思います。なんでも 人間が把握できる数は7つまでのようです。

構造

必ずグロバールナビを作る前にサイトの構成を作成する必要があります。階層はあまり深くせず、2~3クリックで目的のページにたどりつけるようにしましょう。

ターゲット

WEBサイトのターゲットにあったデザイン、メニュー項目になるようにします。さらに、見やすさなどを考慮して文字の大きさや色を決めましょう。

テキストかイメージか

グローバルナビを作る時にもう一つ考慮することはテキストで作るのかイメージで作るかかと思います。

  • SEO、メンテナンスの観点からならテキスト
  • 見やすさ、ユーザビリティならイメージ

というように決めておくと作る時の目安になるかと思います。

参考になるWEBサイト

WPZOOM

wpzoom
http://www.wpzoom.com/themes/pulse/#

サイトの雰囲気に合ったアイコンを使用していますね。フォントサイズに合わせていてスタイリッシュな印象を受けます。

customtoronto

customtoronto
http://www.customtoronto.ca/

上部のラベルのメニューが今どこのページに来ているかわかりやすいです。ローカルナビも項目ごとにまとめられています。ドロップダウンメユーの場合は矢印などを付けてマウスを乗せるとドロップダウンが出てくることを伝えるのがいいでしょう。

bowls

bowls
http://bowls-cafe.jp/

僕の好きなサイトです。グローバルナビが読みやすいですね。英語表記だけではなく、日本語表記も書いています。

まとめ

今回はグローバルナビの役割や注意点などをまとめてみました。来てくれたユーザーを困らせないためにいいデザインのグローバルナビになるようにしたいですね。

関連記事

最後まで読んでくれた方へ

最後まで読んでいただきありがとうございます。
Facebook等でシェアしていただけたら嬉しいです。今後もよろしくお願いします。


1 / 11