このページの本文へ

Webディレクション最新キーワード ― 第82回

JWDA

Webサイトの使い勝手を決めるナビゲーション設計

2011年12月21日 11時00分更新

アンティー・ファクトリー

  • この記事をはてなブックマークに追加
本文印刷
web-keyword

 ナビゲーションとは、Webサイト内のコンテンツを移動したり、他のWebサイトへ誘導したりするためのボタンやリンクのことです。Webサイトにアクセスしてきたユーザーが、迷うことなく目的のWebページまでたどり着けるように経路を提供します。

 分かりやすいナビゲーションは、そのWebサイトで何が得られるのか、何を見られるのかを示します。ナビゲーションにより、Webサイトで提供している多くのコンテンツのありかをすばやく伝えられます。

 ナビゲーションの設計が不適切な場合、ユーザーは目的のページにたどり着けず、Webサイト全体の使い勝手を大きく損ねることになります。特にサイトを初めて訪れたユーザーには悪印象を与えてしまうので、ナビゲーション設計はWebサイト全体の設計においてもっとも重要な項目といえます。

基本パターンの組み合わせで検討

 ナビゲーション設計では、ページ内のどの領域に、どんな種類のナビゲーションを設置するかを、目的に合わせて検討します。

 ナビゲーションには、サイト構造に沿った「階層型」や現在地を示す「パンくず」などのいくつかのタイプがあり、基本的にはそれらの中から必要なナビゲーションを組み合わせて設置します。

 設置するナビゲーションの種類や場所によって、Webサイト全体におけるコンテンツの優先順位や機能、性質が決まりますので、設計前にそれぞれのナビゲーションの役割を理解しておく必要があります。

ナビゲーションの設計

共通ルールとしてサイト全体に適用

 ナビゲーションはWebサイト全体を通して共通のルールを適用し、デザインや表示位置は基本的には変更しません。ナビゲーションを統一することで、ユーザーがナビゲーションを操作しながらサイト内でのルールを学習してくれることが期待できます。

 ただし、ナビゲーションをルールに沿って設計・配置しても、ナビゲーション構造は目に見えるものではありません。定期的なユーザーテストなどで、現状に問題点がないか検証しましょう。

 最近では「タグクラウド」や「ブックマークレット」、TwitterのTweetボタンなど、ソーシャルメディアに関連したナビゲーションも増え、AjaxやFlashなどで実装された画面遷移を伴わない表現も多く見られるようになりました。

 こうした新しいナビゲーションは、当初はノウハウが蓄積されておらず、ユーザーも操作に不慣れなことがほとんどです。必要性を十分検討し、検証を重ねた上で導入の可否を決定しましょう。

著者:アンティー・ファクトリー

アンティー・ファクトリーはWeb戦略だけでなく、タッチパネルやスマートフォンなどの各種インターフェイス・アプリケーション開発、次世代広告コミュニケーションの設計や開発を行っています。ワールドワイドなクリエイティブを展開し、発展しつづける会社です。

書影

書籍版は、企画・設計・制作・運用など、Webディレクション業務の大まかな流れに沿って構成。最新情報を盛り込み、書き下ろしのコラムや用語集も収録しました。ずっしり重い1030g、厚さ19.5mmで、苦手分野を穴埋めしたい新米Webディレクターや、これからWebディレクターを目指す方におすすめの1冊です。

Webディレクション標準スキル152

本体 4,280円+税、AB判392ページ(オール4色刷)
ISBN:978-4-04-868746-1

Amazon.co.jpで買う 楽天ブックスで買う

JWSDA:日本Webソリューションデザイン協会からのお知らせ

この連載が本になりました!!

書籍版は、企画・設計・制作・運用など、Webディレクション業務の大まかな流れに沿って構成。最新情報を盛り込み、書き下ろしのコラムや用語集も収録しました。ずっしり重い1030g、厚さ19.5mmで、苦手分野を穴埋めしたい新米Webディレクターや、これからWebディレクターを目指す方におすすめの1冊です。

Amazonで購入

カテゴリートップへ

この連載の記事

一覧へ

この記事の編集者は以下の記事をオススメしています

ASCII.jp会員サービス 週刊Web Professional登録

Webディレクター江口明日香が行く