2011年2月18日金曜日

ドロップダウンメニューの難点

スポンサーリンク

ページ数の多いサイトに有効なナビゲーションが、ドロップダウンメニューです。

スペースを有効に活用出来ますし、トップページから直接詳細ページへと移動できる優れたナビゲーションだといえます。
しかし良い面ばかりではなく、難点も存在します。



ドロップダウンメニューとは


ドロップダウンメニューとは、ナビゲーションラベルにマウスオーバーする事で下層ラベルを表示するメニューです。

具体的には、以下の様な動作をします。


※たまにはgifアニメーションで作成。

ページを推移する事無しに下層ページの把握が可能です。

デザインや実装

cssのみやjavascriptを用いるなど、デザインも実装方法もいろいろあります。

気になる方はgoogleなどで調べてみてください。
たくさん出てきますので。

ドロップダウンメユーの難点


便利で使えるドロップダウンメニューですが、難点もあります。

ほとんどは微々たるものかもしれません。
しかし何度も利用されるナビゲーションの性質上、繰り返し体験することで問題は大きくなります。

予測しにくい

動的に現れるので、大きさや位置が事前に把握しづらい状態です。

アニメーションさせる事で徐々に表示させれば多少は把握しやすくなります。
アニメーション無しでいきなり表示される場合は、扱いにくさを感じるでしょう。

しかし、どちらにせよ操作ミスをしやすい表示方法です。
表示されたナビゲーションからカーソルがずれると消えてしまいますし。

ワンテンポ待つ必要がある

多くのドロップダウンメニューは、ワンテンポ待って操作する感覚があります。

このワンテンポは思った以上に邪魔に感じる可能性があります。
アニメーションで滑らかに動かす事で対応できますが、何度もメニューを利用するとアニメーションでもテンポが悪く感じます。

一覧性が無い

深い階層が見えるのはカーソルを合わせた時だけです。
表現上、常に画面に表示出来る代物ではありません。

何も操作していない状態での一覧性が無く、全体の把握が劇的に改善されるわけではありません。
この意味では過度の期待は禁物です。

必要性を考える


Webサイトに動きをつけることには大きな意味があります。

ユーザーの視線を惹き付け、興味を持たせ、サイトの虜にする事ができます。
特に静的なデザインの一部に動きのあるパーツがあれば、メリハリがついてより効果的になります。
メリットを考えると、メニューにドロップダウンする動きを付けたくなります。

しかし、本当に必要でしょうか?

変化の対象で考える

マウスオーバーで色が変わったりする表現は非常に良いと思います。
表示内容が変化しないため、急ぐユーザーは表現を無視できますし。

一方内容が動的に変わる場合はそうそう無視ができません。
ユーザーに動きを許容する事を押し付ける事になります。

動的と言う意味では同じであっても、変化する対象が違えば与える効果も違います。

画面推移を除外しない

ドロップダウンメニューのメリットである、画面推移無しの下層ページの表示。
一見便利ですが、常に有効ではありません。

確かに無駄な画面推移は抑えるべきではあります。
しかし、画面推移した先の1ページで下層ページのリストを表示することが有効なら、話は別です。
ドロップダウンで表示されるよりも明示的な形で、ユーザーに下層ページの存在を見せる事ができるのですから。

画面推移の数を気にするあまり、必要なページを削る結果になってはいないでしょうか。

最終的には必要性を見極める


ドロップダウンメニューに限った事ではありませんが、必要性を見極めた上で導入するべきです。

大手のサイトが導入したからといって、常に良い表現であるとは限りません。
例え良い表現であっても自分のサイトに活かせるとは限りません。

逆に、不要だと考え削ろうとしている部分が大事な要素である事もありえます。

必要かどうかの判断は非常に重要です。

結び


記事の内容としては、必要に応じてドロップダウンメニューを使うべきだという結論です。

しかし、全くの個人的意見としてはドロップダウンメニューはあまり好きではりません。
記事に書いた通り、画面推移を加えて内容の一覧性を高める方法を好みます。

とはいえ巨大なECサイトなどで、大分類から中分類に至るナビゲーションとして用いるのはとても有効です。
適切な分類とラベルの設定に基づいていれば、大きな効果をもたらすでしょう。

スポンサーリンク

0 件のコメント :

コメントを投稿