「情報密度」(Information Density)という言葉を聞いたことはありますか。
一般的にWebの世界では、ホームページユーザーが到達してからユーザーが出会うコンテンツ内の情報量のことを言います。

もちろん、情報密度が高くなればなるほど、ユーザーは1ページの中でたくさんのコンテンツを目にすることになります。
情報密度とコンテンツ自体の関係を考えると、情報密度の高低によって、ユーザーコンテンツに対する理解度は変化すると言えます。
さらには、ユーザーの理解度や認識度はそのサイトのユーザビリティユーザーエクスペリエンスにも影響を与えるのです。

デザインを行うときには、ユーザーの実際にどれくらいのコンテンツ量を一度に処理できるのかを考える必要があります。
ユーザーが出会うコンテンツが多ければ多くなるほど、そのページで本来達成すべき目標を達成するのに時間もかかってしまいます。
実際、Facebookのフィードを下にスクロールすればするほどたくさんのコンテンツに出会いますが、だんだんと脳に負荷がかかってくるので、クロールが深くなるたびに離脱率が高くなるのです。

今回は、ホームページ内の情報密度をバランス良くするために考えるべき5つのポイントをご紹介します。

ホームページ内の情報密度をバランス良くするために考えるべき5つのポイント

1. 1つのページではテーマや商品を1つに絞る

諸説ありますが、人間が1日に行う「選択」の回数は実に1万〜2万回とも言われています。
実際、そんなに選択をしているので、選択肢が多すぎると正しい判断ができなくなるときがあります。
そうした状態のことを、心理学では「選択麻痺」(Choice Paralysis)と呼びます。

例えばコンビニエンスストアでは、1種類の商品に対しての選択肢を減らして、購買率が上がるように工夫されています
歯磨き粉やティッシュ、シャンプーなどは、1種類、多くても2〜3種類しか置かれていないことのほうがほとんどです。

しかし、選択肢の種類が多いと、判断に困ることがあります。
例えばコーヒー豆の専門店に行ったとき、コーヒーに知識がなく、なんとなくコーヒーを自分で淹れたいと思ってふらっとお店に立ち寄った場合、どれを選べばよいのか迷うのではないでしょうか。
コクや深み、苦味や値段も大きく違います。
店員さんに聞いてオススメを選んでもらわないと、選択肢が多すぎて購買に至らないのです。

これをホームページに置き換えた場合には、できるだけ1つのページではオススメしたいものを1つに選ぶほうがよいでしょう。
いろいろなものをオススメした結果、ユーザーが何を選べばいいかわからなくなり、ホームページを離脱するということが減るからです。

2. 密度が高い場合は「情報の固まり」を作る

Googleトップページのように検索ボックスだけのシンプルなページは、情報密度は圧倒的に低いですが、ユーザーが行うべきことははっきりしているので、離脱する可能性もぐんと下がります。

一方、ブログやニュースサイトのようなテキストでメッセージを伝えることが多いホームページの場合は、どうしても情報密度が高くなる傾向にあります。
特にニュースサイトはブログとは違って中見出し・小見出しを置くことは少ないので、こうした記事を読むのに慣れていないユーザーからすると非常に読みにくく感じてしまいます。

fortune.jpg
▲ Fortune紙のあるニュース記事の一部

情報密度が多い場合は、できるだけ段落を細かく分けたり、適切な見出しをつけるなどして、ユーザーが情報を処理しやすいようにテキストの配置を考える必要があります。
本文の行間や字間を読みやすいように空けたり、重要な情報を太字にするなどして、情報にメリハリをつけることが大切です。

3. デバイスごとに適切な情報量にする

デスクトップデバイスとモバイルデバイスでは、画面の大きさが違うために、デバイスごとに適切な情報量に調整するよう心がけてみましょう。
近年ではモバイルでのインターネット閲覧は4分の3を超えているとも言われているので、モバイル版のホームページでの情報量を適切にコントロールするのは非常に重要です。
必要のないものは省いて、よく使うものだけに絞ることで、モバイルでも心地よいUXを実現することができます。

例えば、下記の図は格安航空券(LCC)のJetstarのホームページです。
このホームページは可変型のレスポンシブデザインになっており、どのデバイスにも合うようにデザインが表示されます。
デスクトップ版とモバイル版のホームページでは、何が違っているか分かりますか?

pc.png

mobile.png

Jetstarのロゴマークの右側に置かれているメニューが、デスクトップ版では7つ表示されていますが、モバイル版では「メニュー」「サポート」の2種類だけしか表示されていません。
それでもこの2つのメニューはよく使うこと、そして「セール」や「ツアー」のようなメニューは他のUIであったり画面をスクロールすることで対応できるので、メニューが少なくなっても問題ないのです。

4. 目の前のユーザーに必要な情報だけに絞る

もしユーザーの素性が分かったり、ユーザーの欲しいものがはっきりと分かっている場合には、できるだけそのユーザーが欲しい情報だけに絞るのも一つの戦略です。

例えば、Amazonのホームページでは、一見すると情報密度が高く、情報が乱雑に並んでいるだけのように見えます。
しかし、過去の購買情報から紐づけられた「あなたへのおすすめ」をはじめ、ユーザーのAmazonサイト上での行動を記録することでユーザーに最適な商品を提案しています。
そのユーザーに関連性の高い情報を提供していれば、情報密度が高くてもユーザーはその情報に興味を持っているので、選択麻痺になる可能性も少なくなります。

今度は、Appleの製品の購入ページを覗いてみましょう。
例えば、Macbook Proが欲しいと思ったときに、Macbook Proのページを訪れると、「購入」というボタンを押します。
「購入」ボタンを押してはじめて、13インチにするのか15インチにするのかを決めたり、ボディカラーやCPUのスペックを決めたりします。

macbook.png

決して「13インチMacbook Proを購入」「15インチMacbook Proを購入」というボタンを配置していません。
これは、ユーザーが購買に興味を持って初めて情報密度を高くすることで、購買率を高めようとしているからです。

5. 情報密度を減らしたほうが伝わる?

逆説的かもしれませんが、情報密度が高ければ高いほど、ユーザーに伝わる量というのは減少する傾向にあります。
というのも、画面に占めるテキストが非常に多くなってしまうと、ユーザーは情報を処理しきれず、結果的に流し読みをしてしまったりして、すべての情報を読まなくなってしまうからです。

最近ではSEOの観点からもテキストの量を増やしたほうがいいとされますが、情報密度が高すぎると、ユーザーはそれほど真剣に読まなくなってしまうかもしれません。
ユーザーが読みやすいように量を調節するのも大切なことです。

それゆえに、イメージ先行型のヒーローヘッダーを置くデザインは、非常にシンプルに伝わってきます。
テキストが多い場合は、画像を適切に配置するなどして、イメージを喚起するような工夫をしたほうがいいでしょう。

まとめ

情報密度が多いホームページには、メリットもあればデメリットも存在します。

昨今のSEOのことを考えれば、確かに情報密度があったほうが検索順位が上がりやすいのも事実です。
しかし、情報密度アップにこだわりすぎてUXが悪化してしまうのであれば、長期的に見てユーザーがリピートせずPVも下がってしまう可能性があります。

ホームページの特性によっても適切な情報密度は変わってきますので、ぜひ最適な情報密度のバランスを見つけてみてください。