Fパターンは今も有効か、
視線誘導の元研究を読み直す
「Webページの視線は、アルファベットのF字を描くように動く」というFパターンの話は、UIデザインの定番知識として広く知られています。重要な情報は左上に、という配置ルールの根拠にもなっていますが、これはどんな調査から生まれた話なのでしょうか。
232人・数千ページを対象にした、視線計測調査
Fパターンは、ユーザビリティの専門機関であるニールセン・ノーマン・グループが、2006年に発表した調査が元になっています。232人の被験者に、実際のWebページを見てもらい、視線の動きを計測しました。その結果、多くのページで共通して、次のような動きが確認されました。
- ページ上部を、横方向に読む(F字の上の横棒)
- 少し下がって、短めに横方向を読む(F字の下の横棒)
- 左端を、縦方向にざっと見る(F字の縦棒)
この調査自体は、大規模で、条件も比較的そろっており、元になった実験としては、これまで扱ってきた黄金比や色彩心理の話より、しっかりした調査だと言えます。
ただし、「視線がF字に動く」のではなく「F字に動いてしまっている」
ここで注意したいのは、この調査結果は、「Fの形に読むと理解しやすい」という提案ではなく、「多くのサイトが、Fの形でしか読まれていない」という警告として発表された、という点です。元の記事でニールセン氏が伝えたかったのは、「文章が長すぎたり、重要な情報が右側や下の方にあったりすると、読み飛ばされてしまう」という問題でした。
つまりFパターンは、目指すべき理想の型ではなく、対策すべき読まれ方の癖として報告されたものです。「Fの形になるようにレイアウトしよう」という解釈は、元の調査の意図とはずれています。
Fパターンは、目指す型ではなく、直すべき癖として報告された。
いまも通用する部分、通用しない部分
情報を左上から詰め込みすぎない、重要なことを先に書く、という教訓は、いまも有効です。一方で、スマートフォンの縦長画面や、カード型のレイアウトが主流になった現在では、2006年当時の横長ページを前提にした視線の動きが、そのまま当てはまるとは限りません。近年の視線計測研究でも、レイアウトの種類によって読まれ方のパターンは変わることが報告されています。
結論:型として使うより、警告として覚えておく
Fパターンは、「この形に配置すれば良い」という設計図としてではなく、「気を抜くと、こう読み飛ばされる」という注意喚起として捉えるのが、元の調査に忠実な使い方です。