今日は、Webページのデザイン、特にページを開いたときにまず見える「ファーストビュー」とスクロールの関係について、ユーザーテストの調査データから考え方やちょっとしたノウハウを。
“ファーストビューで重要なメッセージが全部見えるように
こういうデザイン指示をすることはありませんか? ユーザーはなかなかスクロールしてくれないのだからと、とにかく最初にページを開いた状態で表示される領域に情報を詰め込むデザインになっていませんか?
スクロールヒートマップ
アクセス解析ツールユーザーインサイトで取得した、ユーザーのスクロール状況ヒートマップ
こうしたファーストビュー至上主義は、英国のユーザビリティ会社cxパートナーズの調査によると、どうやら都市伝説のようです。それどころか、ファーストビューに要素を詰め込んでいるデザインよりも、ファーストビューのコンテンツが少ないほうが、ユーザーはスクロールして他のコンテンツを探す行動に出る場合もあるとのこと。
そう、訪問者はコンテンツがあることがわかっていたら、ちゃんとスクロールしてくれるし、その証拠にアイトラッキング(視線調査)でも、スクロールバーに視線が行ってページの長さを確認する行動が、多くのサイトで確認されているとのこと。つまり、スクロールはユーザビリティ上の大きな問題ではないということなのです。
ただし、スクロールを妨げる典型的な要因もあります。
・画面の途中で横幅いっぱいの横線で区切りを付けている場合(見出しが背景色つきのブロックになっているなど)は、それ以上スクロールしない人が増える傾向がある。
・ページ内の一部分だけがスクロールする(iframeなど)ようになっていると、そちらはスクロールしてもらえない傾向がある。
もちろん、訪問者はどんな長いページでも無限にスクロールしてくれるわけではありません。別の調査では、比較的ページの長いAmazonの商品ページなどでは、ページ全体の2/3より下はほとんど視線が行かなかったという結果も出ています。また、そのページを見る価値があると思わなければ、そもそもユーザーはスクロールしないでしょう。
重要なのは、
・訪問者の気持ちをつかまえる要素がファーストビューに入っている。
・さらにその下にコンテンツがあることがユーザーにわかる。
・横に区切るデザインをするときは、ページが終わったと勘違いしないようにする。
ですね。
根拠もなくページの上部600ピクセルの高さに大量のコンテンツを詰め込むのはやめましょう。Web担も、横幅いっぱいの区切りに見える見出しが一部あるので、ちょっと見せ方を工夫してみます。
ちなみに別の記事では、「縦に伸びるボックス上のデザインをしていると続きがあることをユーザーは理解しやすい」といったヒントもありましたので、ご参考に。
続きは会員限定です。無料の読者会員に登録すると続きをお読みいただけます。
- 会員登録 (無料)
- ログインはこちら
関連記事
2008.09.26
2010.04.20
安田 英久
株式会社インプレスビジネスメディア Web担当者Forum編集長
企業のウェブサイト活用やウェブマーケティングに関するメディア「Web担当者Forum」(http://web-tan.forum.impressrd.jp/)を運営しています。