グローバルナビゲーション:ユーザーにとって使いやすく理解しやすいサイトとは 第2回

グローバルナビゲーション:ユーザーにとって使いやすく理解しやすいサイトとは 第2回

アタラ 広告代理店運用強化トレーニング

この記事でお伝えしたいこと

色々なウェブサイトを見ていると、サイト制作側の都合の情報が詰め込まれたサイトや、デザインを重視して使いにくいと感じるサイトが多々見受けられます。せっかく広告を使ってサイトに流入させたとしても、このようなサイトではコンバージョンを獲得できる可能性が低くなります。使いやすさや理解しやすいサイトは狙っているターゲットによっても違いがあると思いますが、どんなターゲットにとっても使いにくい仕様があると思います。

 

この連載では、どういう箇所が理解しにくく使いにくいのかを部分的に説明していく予定です。ウェブサイト製作の際の参考にしていただけたら幸いです。

 

第1回は使いにくいカルーセルパネルについてご紹介しました。

使いにくいグローバルナビについて考える

第2回は、使いにくいグローバルナビの例をご紹介します。
グローバルナビとは、全てのWEBページに共通して設置されていて、違う階層のページに移動しやすくするためのボタンです。

 

グローバルナビに必要なことは、迷わず直感的に操作でき、目的の情報へすぐに辿り着けることです。そのためには統一感のあるルールで設置し、わかりやすいテキストやビジュアルで見せることが重要です。

 

では、どんなグローバルナビがユーザーにとってわかりにくいのか例を挙げてご説明します。

 

1. 内容が想像できないグローバルナビ

下記の画像は、一般的なグローバルナビの例です。ただ、サイトに何度も訪れているリピーターならば分かることも新規ユーザーにはボタンのテキストからでは目的の情報がどのメニューにあるのか直感的に判断するのは難しいです。結果、必要な情報を得るためページ全体を探し回らなくはいけなくなり、グローバルナビの本来の役割を果たしてないといえます。

 

下記のように、グローバルナビの下に関連する情報が常に見える方が、目的の情報へ辿り着くまでのクリック数が減ります。リピーターはもちろん、新規のユーザーにも直感的に使えるグローバルナビになり使いやすさを感じてもらえるのではないでしょうか。

 

 

2. コンテンツを詰め込みすぎなメニュー

下記の画像はグローバルナビにマウスポインターを置くと画面のスペースを広く使用してメニューを見せる仕様で、メガメニューやメガドロップメニューと呼ばれています。画像は、テキストのみになっており直感的にわかりにくいといえます。また、コンテンツを詰め込み過ぎなため、探すのを面倒に感じユーザーが離脱する可能性も考えられます。

 

下記のように、テキストはシンプルなタイトルと簡単な説明をつけ、その近くに画像やアイコンを配置するとユーザーに直感的にコンテンツを理解してもらえます。また、情報を精査してメニューを絞って記載することでコンテンツが埋もれることがなくなります。

 

 

3. 不自然な視線移動のグローバルナビ

下記の画像はテキストやアイコンのビジュアルはわかりやすいのですが、メニューを開くとコンテンツが左に展開されているので人の上から下にいく視線の流れを無視した作りになっており、直感的に操作できるとは言い難いです。

 

下記のように、メニューが展開された時にコンテンツが上から下に順番に記載されている方が自然な視線移動になるので、ユーザーの負担を軽減できるのではないでしょうか。

 

 

まとめ

今回は使いにくいグローバルナビをご紹介いたしました。グローバルナビはユーザーが直感的に操作でき、目的の情報へすぐに移動できるような仕様にすることが重要です。わかりやすいテキストや画像を配置することを心がけるとともに、たくさんの情報を伝えたいからと制作者サイドの都合でメニューにコンテンツを多く詰め込みすぎないように注意したいところです。

 

今回ご紹介したグローバルナビの他にも使いにくいと感じるものがあると思います。ぜひ色々なサイトを見て、狙いたいターゲットユーザーの視点で使いやすい・使いにくいグローバルナビを見つけてください。

 

次回も「ユーザーにとって使いやすく理解しやすいサイトとは?」をお届けします。

【運用型広告のトレーニング、スキルアップ、リスキリング、必要ですか?】

✓社内の知識を醸成するため、Google 広告などの運用型広告のトレーニングをしてほしい
✓Cookieレス、ファーストパーティデータ、リテールメディアなど最新のトレンドについて知りたい
✓広告代理店のマネージャーとして知っておくべきことを吸収したい
✓ハウツーに止まらない本質的な考え方から身につけたい
という方は、まずはライトな相談から
支援内容とお問い合わせはこちらをクリック

Related posts

Top