街を歩けば見かける事が多い案内ボード。
伝えたいことがたくさんありすぎて、あれもこれもと文字の情報でいっぱいになっていて結局、素通りする事も多いと思います。
瞬時に情報の概要が伝わらないとユーザーは見向きもしません。
webデザインもこれと同じ事がよくあります。
画像と文字の伝わる情報の違い
画像の特徴
感情的な表現を一瞬で伝える
例えば下の写真の様な写真を見て「おいしそう」「食べてみたい」と一瞬で画像だと表現できますが、文字だと、まずどんな食べ物なのか理解するだけでも時間がかかります。
それだけでなく画像は「おいしそう」「食べてみたい」と人の感情を動かすことができます。文字はここが苦手な所です。メールの文章など怒っているのかなど感情的な所がわからないといった経験に出会ったことが誰しもあると思います。
情報を整理して表現できる
情報が持つ構造をわかりやすく表現できます。webでいうと例えばツリー構造のサイトマップなど目にしたことがあると思いますが、情報の構造が画像の場合わかりやすくなります。
概要は一瞬で伝えられるが詳細は文字より伝わりづらい
例えば料理の写真は一瞬でどんな食べ物なのかはわかりますが、どんな材料がどれだけ含まれているのかは画像では表現しづらくなります。
文字の特徴
伝えたい情報を「伝える側」が時間をかけずに相手に伝えられる
文字にするだけで、人にお願いをしたり情報を伝えることが時間をかけずにできます。
ただ、前述にある様に人の心を動かすなど感情的な所まで伝えるとなると情報を得る側は画像よりも時間がかかります。
情報を正確に伝えられる
例えばwebデザインでよく見かけるアイコンの付近に文字が添えられてたりする事が多いと思いますが、それはやはり文字が正確に伝えやすいからです。
スマートフォンのwebデザインでよくあるメニューアイコンも3本線の下にMENUと書かれてたりする事は多いと思います。
詳細は伝えやすいが概要を伝えるのに画像より時間がかかる
定食屋さんやカフェにいった時に文字だけのメニュー表を見たことはありませんか？具体的なメニューは書いてあるけども、どんなものかイメージがつかないなど一度はあると思います。
親しみづらい
文字の量にもよりますが、あまりに多くなりすぎるとパッと見で圧迫感を覚え、情報を取得するのをやめてしまう事が多くなります。保険の約款をイメージするとわかりやすいと思います。ほとんどの方が全てに目は通さないと思います。
これまでのこの文章を画像で表現すると
どうでしょう？
文章より情報を理解するのに時間がかからないと思います。しかし、詳細まではこれでは伝わらないです。
どんな時にどんな情報の提供をすればいいのか
webを使用する機会はテレビを見るときなどとは異なって能動的です。
つまり、探したい情報がある事がほとんどです。
探したい情報があるという事は当然、自分が必要としている情報を早く見つけたい欲求があります。
では、その状態で情報の提供のあり方はどうすればよいか。
画像と文字の特性を考えれば画像で情報を伝えないとユーザーはクリックもしないしサイトからすぐに離脱するでしょう。
また、単純に画像を入れるのではなくてユーザーはどんな情報を必要としているのか、文字で表現している部分は、もっと簡単に図で表現できないかを考えましょう。
ファーストビューで見える範囲の所に画像やキャッチコピーが添えられているのはこういった理由があります。