04-18-06
Category: Web Usability
Key points:
- Users often read Web pages in an F-shaped pattern, very different and less thorough from how people typically read the printed page.
- The first two paragraphs on a Web page should state the most important information. The first paragraph is what users are most likely to digest.
- When laying out text on a page, one should make sure to start subheads, paragraphs, and bullet points with "information-carrying" words that catch the users eye when they are scanning through the final stem of the F-shaped pattern.
***
Excerpt - For full article, please visit Jakob Nielsen's Alertbox.
Eyetracking visualizations show that users often read Web pages in an F-shaped pattern: two horizontal stripes followed by a vertical stripe.
F for fast. That's how users read your precious content. In a few seconds, their eyes move at amazing speeds across your website’s words in a pattern that's very different from what you learned in school.
In our new eyetracking study, we recorded how 232 users looked at thousands of Web pages. We found that users' main reading behavior was fairly consistent across many different sites and tasks. This dominant reading pattern looks somewhat like an F and has the following three components:
- 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.
- 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.
- 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.
Obviously, users' scan patterns are not always comprised of exactly three parts. Sometimes users will read across a third part of the content, making the pattern look more like an E than an F. Other times they'll only read across once, making the pattern look like a rotated L (with the crossbar at the top). Generally, however, reading patterns roughly resemble an F, though the distance between the top and lower bar varies.
Heatmaps from user eyetracking studies of three websites. The areas where users looked the most are colored red; the yellow areas indicate fewer views, followed by the least-viewed blue areas. Gray areas didn't attract any fixations.
Full Article
