プルダウンメニューとは?ユーザビリティを上げるにはどうしたらいい?

プルダウンメニューとは?

この記事を読むための時間:3

WebサイトのUXの向上に役立つプルダウンメニューは、コンテンツなどのメニューの表示方法の一つです。Webサイト内のコンテンツを一覧にすることができるため、サイト画面の整理整頓にもおすすめです。

そんなプルダウンメニューを活用するということは、サイト内の整理整頓以外にどのようなメリットがあるのでしょうか。

さらにプルダウンメニューをよりユーザビリティにする方法も併せて紹介します。

 

プルダウンメニューとは?

プルダウンメニューとは、タイトルにカーソルを合わせ、クリック一つでWebサイト内のメニューやコンテンツの項目を一覧にすることを指しています。

必要な時にだけ一覧で見ることができることから、サイトの画面の整理をすることにも繋がり、また一覧に並ぶそれぞれのページにアクセスすることができます。

コンテンツやメニューの多いサイトの場合に用いることの多いメニュー表示です。

 

プルダウンメニューのメリットって?

Webサイト内のメニューを一覧にするプルダウンメニューを用いるということは、どのようなメリットがあるのでしょうか。プルダウンメニューを取り入れる前に知りたいメリットをご紹介します。

 

ジャンル別に振り分けられる

プルダウンメニューは、それぞれのメニューコンテンツをさらに詳細にジャンル分けしたい時におすすめなメニュー一覧方法です。

例えば、旅サイトを開設した場合にヨーロッパやアジアなど大陸ごとのカテゴリーを作ったとして、さらに国ごとに分けたいとします。その場合、プルダウンメニューを活用すると、大陸ごとのカテゴリーからさらに詳しく国名が表示されるようになります。

またベースとなるカテゴリーを作ることで、サイト内のコンテンツを必要に応じて増やすことができるということになります。

 

検索の手間が省ける

ユーザー側からの視点からのメリットで言うと、プルダウンメニューは、タイトルにカーソルを合わせてクリック一つでコンテンツページに飛ぶことができるため、検索の手間が省けるのも大きなポイントです。パソコンやスマートフォンなどデジタルデバイスに慣れていない方も検索ワードを打ち込まずに求めるページまでアクセスすることができます。

このようにユーザビリティな要素があるのもプルダウンメニューのメリットです。

 

プルダウンメニューをよりユーザビリティにする方法とは?

プルダウンメニューは、メニューを一覧にすることで必要なページやコンテンツにアクセスすることができる優れものではありますが、一手間加えるだけでよりユーザビリティに、そしてアクセス数獲得にもつなげることができます。そんなユーザビリティにする方法を紹介します。

 

間隔を空けてを並べる

プルダウンメニューは、メニューの一覧がたくさんの項目に分かれることがあります。メニュー欄があまりに詰まりすぎていたりすると見づらくなってしまうため、使いづらいコンテンツになってしまいます。左右前後の間隔をあけてメニューを並べることで、一覧が一気に見やすくなり、クリックミスも少なくなるでしょう。

 

色を変えてカーソルの位置を明確にする

カーソルメニュータイトルに合わせる際、どこにカーソルがあるのかを見失うケースもあります。小さなカーソルだけでなく、今どの位置にカーソルが合わせてあるかをわかりやすくするためにカーソルがタイトルの上に来た時に色を変えてみるのもおすすめです。色を変えるだけでなく、マーカーやラインを入れるのもおすすめです。

 

メニューが少ない場合はハンバーガーメニューを導入しよう!

メニューの項目が少ない場合には、3本線ラインのアイコンマークで知られるハンバーガーメニューを活用するのもおすすめです。1つのアイコンにメニュー項目をまとめることができますので、併せてチェックしてみると良いでしょう。

 

まとめ

プルダウンメニューは、ページのジャンルが多いWebサイトにおすすめなメニュー表示方法です。一工夫を加えることで、よりユーザビリティになりますので、サイトのコンセプト等に併せて取り入れてみると良いでしょう。

関連記事Related article