【翻訳】ユーザーは画面を読むのではなく「スキャン」している(Vitaly Friedman, Smashing Magazine)

www.smashingmagazine.com

スクロール、スキャン、スキップ: ユーザーはどのようにオンラインでコンテンツを消費するのでしょうか?ここでは、有害なスキャンパターンを防ぐための読書行動とデザイン戦略について知っておくべきことを説明します。

私たちはウェブでほとんど読みません。私たちはほとんど"スキャンしている"のです。それは、手に負えないほどの情報に直面したときに、必要なものを素早く見つけるための信頼できる戦略です。しかし、スキャンするということは、しばしば重要な詳細を読み飛ばすということでもあります。これは非効率的なだけでなく、ビジネスに大きなダメージを与える可能性があります。

それでは、ユーザーがウェブ上でどのように読み、スキャンしているのか、そして有害なスキャンパターンをどのように防ぐことができるのかを探ってみましょう。

ウェブ上のスキャンパターン

最も一般的なスキャンパターンの一つはF字型パターンです。ユーザーは左上から始めて数行読み、それから縦にスキャンし始めます。しかし、ウェブ上のスキャンパターンはこれだけではありません。さまざまなパターンを意識することは、ユーザーがコンテンツをよりよくナビゲートするための第一歩です。

さまざまなパターンは、ユーザーがウェブ上のコンテンツをスキャンする方法を説明しています。F-shapeパターンはおそらく最もよく知られているものでしょう。ネマニャ・バンジャニンによるもの。(大きなプレビュー)

さまざまなパターンが、ユーザーがウェブ上のコンテンツをスキャンする方法を説明しています。F字パターンはおそらく最もよく知られているものでしょう。

  • Fパターン:ユーザーはまず横方向に読み、次に縦方向にスキャンし始めるまで、だんだん読まなくなります。テキストの最初の行と各行の最初の単語がより注目されます。これはLTRインターフェイスにも当てはまりますが、Fは反転します。
  • レイヤー・ケーキ・パターン:ユーザーは見出しを一貫してスキャンし、その間に本文に意図的にジャンプします。ページをスキャンして重要な内容の詳細を見つけるのに最も効果的な方法。
  • 一目惚れパターン:ユーザーはしばしば「満足主義者」であり、十分に網羅的ではなく、十分なものを探します。検索結果において、彼らはしばしば一つの結果に固執します。
  • 芝刈り機のパターン:表では、ユーザーは左上のセルから始まり、行の終わりまで右に移動し、次の行にドロップダウンし、同じパターンで移動します。
  • 斑点パターン:テキストの大きなかたまりを飛ばして、パターンに注目すること。ユーザーが特定の単語、図形、リンク、日付などを探すときに検索でよく起こります。
  • マーキング・パターン:マウスがスクロールしたり、指がスワイプしたりするときに、視線が一箇所に集中すること。デスクトップよりもモバイルでよく見られます。
  • 迂回パターン:複数の行が同じ単語で始まっている場合、ユーザーが意図的に行の最初の単語をスキップするパターン。
  • コミットメント・パターン:コンテンツ全体を一語一語読むパターン。利用者の意欲や関心が高い場合に発生。高齢者に多い。

F字スキャンとリズムの欠如

ウェブ上では、折り返しについてよく議論されますが、それは確かに存在するものの、本当はどうでもいいのです。クリストファー・バトラーが言ったように、「長さは問題ではない - リズムの欠如が問題なのだ 」と。

折り返しは存在するが、通常は本当に重要ではない。クリストファー・バトラー著。(大きなプレビュー)

デザイナーの主な仕事は、注意を意図的に向けることです。スキャニングは部分的注意です。読むことは集中した注意です。意図的なリズムのない画面は、スキャンされている間に注意を失います。制御されたリズム**を持つものは、注意を保持するだけでなく、注意を深めます。

F字型スキャンは、デザインによってコンテンツが十分に誘導されない場合のユーザーの予備動作だと考えてください。ですから、できる限りそれを防ぎましょう。少なくとも、E字型スキャニングに移行するためのアンカーをユーザーに与え、よくても、レイヤー・ケーキ・スキャニングで関連するセクションに注意を向けさせましょう。

注意を向けさせ、アンカーを与える

優れた書式設定は、スキャンの影響を減らすことができます。スキャンを構造化し、ユーザーのビューを誘導するには、見出しと小見出しを追加します。エンゲージメントのために、サイズ、間隔、パターンを変えましょう。ランディングページでは、興味を引くポイントを交互に配置しましょう。

ユーザーはページの左半分を見るのに80%の時間を費やすと言われています。ですから、コンテンツを構成する際には、水平方向のアテンションが左側に傾くことを念頭に置いてください。また、ナビゲーションを配置することで、道案内を助けることもできます。

上部にフィルターとして機能する多数のドロップダウンがあるユーザーの視線。NN/gによるアイトラッキング調査より。大きなプレビュー

一般的に、関連するコンテンツの小さな塊を視覚的にグループ化するのは良いアイデアです。アンカーを提供するために、キーワードとキーポイントを含むフロントローディング見出しを検討してください - それは、ユーザーが何が彼らを待っているかを素早く理解するのに役立ちます。便利なビジュアルを追加することも、ユーザーにアンカーとなるポイントを与えることができます。

ページを通してユーザーを誘導するもう一つの方法は、少ないけれど目立つアクセントを加えて注意を誘導することです。ページ上の他のコンテンツよりも目立つ、見やすく構造化された見出しや小見出しが必要です。実際、ページ全体に小見出しを加えることは、ユーザーが情報をより早く見つけるための最良の戦略かもしれません。

大きく複雑な表のようなデータの多いコンテンツには、特別な注意と配慮が必要です。ユーザーがテーブルの上を移動しても位置を維持できるように、ヘッダーは浮かせておきましょう。ヘッダーは、ユーザーの視線がどこに集中してもアンカーとなり、見回したりデータを比較したりしやすくなります。

Key Takeaways

  • ユーザーはページの左半分に80%の時間を費やします。
  • 水平に読み、下のコンテンツに飛びます。
  • ユーザーはコンテンツの大部分を見逃し、重要な詳細を読み飛ばすため、スキャンはしばしば非効率的です。
  • 優れたフォーマットは、Fスキャンの影響を軽減します。
  • 構造化されたスキャニングのために見出しと小見出しを追加してください。
  • スキャニングを改善するために、見出しの早い段階でキーワードとキーポイントを示しましょう。
  • エンゲージメントのために、サイズ、間隔、パターンを変えましょう。
  • ランディングページでは、興味のあるポイントを交互に
  • 関連するコンテンツを視覚的にグループ化しましょう。
  • 大きく複雑なデータテーブルでは、ヘッダーを浮かせておきましょう。
  • ユーザーにアンカーとなるポイントを与えるために、有用なビジュアルを追加しましょう。
  • 水平方向の注意は左に傾く:トップ/レフトナビゲーションを優先しましょう。

有用なリソース