長さが問題なのではなく、リズムの欠如が問題。
2023年になっても、私はクライアントからスクロールについてよく質問されます。その理由はわかります。
なぜなら、人々が私たちのデザインにアクセスするスペースは、私たちがコントロールできないものだからです。レスポンシブデザインや拡大縮小のテクニックを使っても、私たちが作ったものが、それを見るすべての人の画面にどれだけ表示されるかはわかりません。
しかし、私たちは、人々が少なくともスクロールすることを知っています。
人々がスクロールしないという証拠は...存在しない。
25年以上前、Jakob Nielsenは、ウェブユーザーがすでにスクロールすることに慣れてきていることを指摘し、彼の研究は、「折り返しより下」の情報が見られないという懸念を軽減するはずの、その行動における意味のある変化を示していました。
しかし、2010年と2018年に行われたその記事の更新で、彼の会社のアイトラッキングの研究では、折り返しより下の情報への注目度がかなり低いことが示されていることに注意してください。具体的には、折り返しより上の情報はユーザーの閲覧時間の57％を占め、それ以外のすべて、つまり折り返しより下の「画面いっぱいのコンテンツ」は17％以下でした。これは大幅な減少です。この調査では、ウェブページの縦のサイズはデバイスによって異なることを考慮し、ページを20%に分割して測定しました。ここでも、閲覧時間の大半はページの上位20%に費やされています。
しかし、ここでの結論には注意が必要です。ニールセンの調査は、ユーザーがスクロールしないことを示しているわけではありません。彼らが示しているのは、画面を見ている時間から推測されるユーザーの注意力は、すぐに損なわれるということです。
一方、TIMEに寄稿したChartbeatのTony Haile氏は、アテンションの66%はファーストビューより下で起きていると書いています。これは興味深いことです。ここで何が起こっているのでしょうか？
ここで起こっていることは、スクロールとはあまり関係がなく、アテンションに関係しています。
優れたインタラクションデザインとは、アテンションを管理することに他ならない。
人が手で何をするかは、頭で何をするかよりも重要ではありません。
人々がスクリーン上であなたのデザインにどのように関わるかを理解することに関しては、スクロールではなくアテンションについて尋ねるべきです。(クリックはまた別の問題であり、この記事で取り上げることではありませんが、「ヒートマッピング」や「怒涛のクリック」でググってみてください。そうではありません)。
スクロールは注意を必要としない行為です。それに対してスキャンは部分的注意。読むことは集中的な注意です。
問題は、「スクロールするかどうか 」ではありません。見た情報を処理するのに十分な速度でスクロールするかどうかです。あなたのデザインが情報アーキテクチャとビジュアル言語を使い、ほぼ無意識のレベルで、彼らにもっと注意を向けるよう説得するものであれば、彼らはそうするでしょう。
画面を見てから最初の1、2秒の間に、人々は3つの重要な質問をし、それに答えていることを覚えておいてください：
- この情報は何か？
- 私に関係があるか？
- 次に何をすべきか？
画面のコンテンツがどのように配置されているかを評価し、その断片を処理するのです。これはすべて、あなたが静止するようにデザインした要素が動いている間に起こっていることに留意してください。視聴者はほとんどの場合、スクロールしながらスキャンと処理を行っています。
人が画面上の情報の性質を識別し、その関連性を評価できるようになると、実際に読み始めるかどうかを決めることができるようになります。
情報アーキテクチャの重要性
画面上のどこに情報を配置するかは、おそらく最も重要なデザイン上の決定事項です。大きさはその次です。
Chartbeatの調査に戻りましょう。ニールセンが現在行っている、折り返しより下へのアテンションが減少していると結論付けた調査と合わせると、一見すると、相反する情報があるように見えます。しかし、ニールセンの研究は、人がページをスクロールするにつれて、見る時間の減少を測定したことを思い出してください。彼らは、スクロールのスピード、一時停止の有無、一時停止の長さについては言及していませんし、おそらく測定もしていません。私は、ページを最初にスクロールする大半の時間は、ほとんど途切れることがないと思います。繰り返しますが、ページのコンテンツの大部分は動き続けているのです。
一方、Chartbeatの調査では、ウェブページのコンテンツに費やされた総注目量を測定し、その大部分（それがどんなに長いスクロールの注目セグメントのテールであっても）は、ファーストビューの下に費やされているとしています。これは私にとって非常に理にかなっています。
私の観察では、スクロールはすぐに、つまり画面のすべての要素が完全に読み込まれる前に始まります。人々は、ファーストビューより上のアテンションを獲得するために行われる、不潔で上部に密集したデザインの選択と、そこから生じる混乱に慣れています。Chartbeatの結論によると、人々は最初の「画面一杯」をすぐにスクロールして通り過ぎ、よりスペースがあり、情報が少なく、明快な下の方に落ち着くことが多いのです。
これが、私が優れた情報アーキテクチャをテキストのアウトラインのシンプルさに例える理由です。情報の生産的なスキャンは、それがどのように配置されているかに基づいて、情報が何であるか、何が重要であるかについての結論を導きます。
そこで、いくつかの簡単なヒントを：
- まず、 スキャンは反応であり、読むことは選択であることを覚えておいて ください。画面を見る人の大半は、その内容を読むことはありません。
- 最も重要な情報は、一貫性のある場所に配置しましょう。たとえば、ほとんどのテキストは左揃えなので、テキストを左揃えにし（画像は右寄せにする）、スキャンを一本軸に保つことで、ユーザーがその情報をより素早く処理できるようにすることを考えましょう。
- 繰り返しは情報。小さな構造や配置の繰り返しは、画面のコンテンツの大きな構造をスキャナが理解するのに役立ちます。たとえば、リストを即座に識別できることは、あるコンテンツが他のコンテンツをどのようにサポートしているかをスキャナが理解し、潜在的な選択肢や利用可能なアクションを認識するのに役立ちます。
- 何もないスペースは中立ではありません。スペースを意図的に使うことで、スキャナは関連する情報の集まりをすばやく識別できるようになり、また、スキャナが見た情報を処理する能力も得られます。画面に何もないスペースが少ないほど、その情報密度は高くなります。スクリーンの情報密度が高ければ高いほど、注意や理解に対する多孔性は低くなります。
これらのヒントには、それぞれ2つの重要な共通点があります。
1つ目は、どれも構造に関係しているということです。これらの考え方は、情報をどこに置くかを選択することで、その情報への関わりやすさを高めることにつながります。2つ目の共通点は、これらを組み合わせることで、画面のリズムが生まれるということです。
長さが問題なのではなく、リズムの欠如こそが問題である。
画面は必要なだけ「長く」することができます。その時に問題となるのは、長さではなく、リズムの欠如なのです。構造を確立すれば、その構造にリズムを吹き込むことができます。構造のリズムは、配置の繰り返しとその間のスペースによって定義されます。
意図的なリズムのない画面は、スキャンされるときに注意を奪います。コントロールされたリズムを持つものは、注意を保持するだけでなく、それを深めます。
*1:訳注：この画像は、「ファーストビュー（the fold）」という概念を示しています。特に、ユーザーがウェブページを開いたときに最初に見える部分を指します。この図では、「the fold（折り目）」の上、つまり画面の見える範囲内に重要な情報を配置すべきであることを強調しています。上部の「Not here」と示された部分は、重要ではない情報を配置すべき場所ではなく、対して「The majority of your audience's attention is spent here（ほとんどのユーザーが注目するのはここ）」と記された場所が、コンテンツの注目を集めやすい場所であることを意味しています。
