SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

おすすめのイベント

  • MarkeZine Day 2020 Autumn Kansai

おすすめの講座

  • [11月12日]Googleアナリティクス実践講座~基本操作編

おすすめのウェビナー

  • MarkeZine Day 2020 Autumn Kansai

マーケティングは“経営ごと” に。業界キーパーソンへの独自取材、注目テーマやトレンドを解説する特集など、オリジナルの最新マーケティング情報を毎月お届け。

定期誌「MarkeZine」

第64号(2021年4月号)
特集「あなたの知らないZ世代」

定期誌購読者なら
誌面がウェブでも読めます

今日から実践!ユーザビリティ向上ノウハウ

ユーザーの視線の“流れ”気にしていますか?【ユーザビリティTips】

 Webサイトは、ユーザーの視線の流れを想定して作ることで、ユーザビリティが大きく向上します。そこで今回は、ページ内の表を例に、視線を意識したサイト設計のヒントをご紹介します。(ユーザビリティ実践メモの中から編集部がチョイスした記事を転載しています)。  

「視線」の流れを意識して、分かりやすい表をつくる

 弊社のユーザー行動観察調査では、アイトラッキング(ユーザーの視線分析)を利用していますが、ある程度ユーザー理解があれば、「認知的ウォークスルー」(ユーザーになりきってそのサイトを検証する)という手法でも、視線の流れを意識したサイト評価・設計ができるようになります。今回はWebページ内の表のつくり方を例に、「視線を意識したサイト設計」のヒントをご紹介しましょう。まず下記の例をご覧ください。

 このニュース一覧は、ぱっと見はきれいなのですが、実際にはユーザーの情報収集を妨げています。その理由が分かりますか?

 この例の場合、ユーザーはまず文頭を見て自分に必要な情報を探すのに対し、文章が中央揃えになっているため、視線を左右に動かす必要があり、情報収集の効率を下げています。

 そこで、文頭を左寄せにすると視線がスムーズに流れ、表が読みやすくなります。

 ただし、左寄せが万能なわけではありません。次の例をご覧ください。

 いかがでしょう?何かちょっと引っかかる感じがしませんか?

 この例では、数値の大小比較というシチュエーションなのに、一目で大小が分からないことが問題です。また、単なる大小ではなく、「どれがどのくらい大きいか」という関心を持っているユーザーの場合、桁数を把握するためのコンマが視線の流れをサポートすることが想定されるため、コンマの位置を合わせる配慮が必要となります(そもそもコンマ自体がない場合だと、桁数を誤解してしまう恐れもあります)。

 以下のように右寄せにすると、数値の大小が分かり、コンマの位置も揃うので、桁数自体も把握しやすくなります。

 みなさんも普段、Webサイトはもちろん、広告や新聞記事などを見る際にも、視線の流れを意識して「ユーザーはどんな風にこの画面を見ているのだろう」と意識してみてください。そこからサイト改善のヒントが見つかるかもしれません。

この記事は参考になりましたか?

  • Facebook
  • Twitter
  • Pocket
  • note
今日から実践!ユーザビリティ向上ノウハウ連載記事一覧

もっと読む

この記事の著者

株式会社ビービット(カブシキカイシャビービット)

仮説検証型の独自方法論「ビービットUCD(User Centered Design)」を用いて、ウェブおよび携帯サイトの戦略立案、サイト設計、構築、効果検証を行うインターネットコンサルティング会社。年間1000人を越えるユーザビリティテスト(ユーザ行動観察)やアイトラッキング調査など各種リサーチを実施し、ウェブユーザの心理と行動パターンを分析。サイトの売上向上、コンバージョン率改善などの具体的成果の創出を行っている。詳細はこちらからご確認ください。【書籍紹介】 絶えず...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

Special Contents

PR

Job Board

PR

おすすめ

イベント

    • MarkeZine Day 2020 Autumn Kansai
    • MarkeZine Day 2020 Autumn Kansai
    • MarkeZine Day 2020 Autumn Kansai

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング