Virginia Web Designers

With the arrival of Google Analytics, even the most hands-off Web site owner can readily track how visitors interact with the site—where they come from, what search terms they most favor, where they navigate to within the site, what they click on and so forth.

But, how do you figure out what visitors do on your site between mouse clicks? For example, what do they look at on your Home or About page? What parts capture their attention, what do they miss, what do they ignore altogether?

What Eye-Tracking Heat Maps Reveal
In 2006, Jakob Nielsen released an eye-tracking study that reported how 232 users viewed more than 1000 Web pages. Results of this study showed a decidedly F-shaped pattern to users’ viewing habits, as the following heat map presents. The red/orange areas reveal where users gazed most on the page, followed next by the yellow areas then the blue; the gray areas indicate no eye fixation.
 

Nielsen found that users' reading behavior was fairly consistent across many different sites and tasks and exhibited three key characteristics:

1. First, users read in a horizontal movement across the upper part of the content area, forming the top bar of the F.
2. Second, users move down the page then read across in a second horizontal movement, typically over a shorter distance than the previous movement. This action forms the lower bar of the F.
3. Third, users scan the left side of the content in a vertical movement. Sometimes this scan is slow and systematic (a solid vertical stripe on an eye-tracking heat map); other times users move faster, creating a spottier heat map. In either case, this final scan forms the stem of the F.

Since 2006, Nielsen and other eye-tracking researchers have further studied how visitors scan your Web pages. Their findings indicate that sometimes the scan flow is not as simple and straightforward as that of a text-based Web page.

For example, Enquiro, an independent research company and search marketing vendor out of British Columbia, has determined that a large image, a video or other rich media often can get in the way or act as a barrier to how visitors progress through a Web page.
 

As you can see on this Web page, the heat map clearly shows how visitors scan around the video, following the text on the page instead of homing in on the feature itself. This type of information is important to know, for example, if you had included a call-to-action within the video. Chances are, visitors would miss it entirely.

Takeaways for Your Web Site
Awareness of the results from eye-tracking and other usability studies can help you and your Web designer plan more visitor-focused pages that effectively channel visitors to your call-to-action and enable them to easily convert. Here are nine research-based takeaways to get you started:

1. Visitors look for information, and that most often means text vs. decorative or gratuitous graphics.
2. Content in the upper left corner of the page will receive initial—and often the most—eye fixation.
3. Sections most likely to be ignored are those that look like ads; oversized font treatments and special effects trigger visual associations with ads rather than information and cause viewers to skip over them.
4. Headlines attract and hold visitors’ attention.
5. Buttons and menus capture visitors’ eyes …
6. … as do bulleted and numbered lists.
7. Numbers expressed with digits (56) vs. words (fifty-six) attract attention.
8. Short paragraphs vs. large blocks of text capture interest.
9. Navigation tools work best across the top or down the left side of the page.