January 22, 2007

How to optimize your webpage according to F-shape reading pattern

In an experiment conducted on 232 users to record the pattern of users look at thousands of webpages, the result shows that users' main reading behavior was fairly consistent across many different sites and tasks.

Here are the patterns :

  1. Users first read in a horizontal movement, usually across the upper part of the content area. This initial element forms the F's top bar.
  2. Next, users move down the page a bit and then read across in a second horizontal movement that typically covers a shorter area than the previous movement. This additional element forms the F's lower bar.
  3. Finally, users scan the content's left side in a vertical movement. Sometimes this is a fairly slow and systematic scan that appears as a solid stripe on an eyetracking heatmap. Other times users move faster, creating a spottier heatmap. This last element forms the F's stem.
So what is the implication related to these reading patterns :

  • Users won't read your text thoroughly
  • The first two paragraphs must state the most important information
  • Start subheads, paragraphs, and bullet points with information-carrying words

via [F-Shaped Pattern For Reading Web Content]

tags :