What are eye-tracking studies and how do they help my website?

10 February 2012

Since the earliest days of e-commerce people have been trying to understand how they can optimize websites to take advantage of the way people view information on a page. We already know a lot about how people read a page or an advertisement, so it isn’t that difficult to transfer this knowledge to a web page.

What Are Eye-Tracking Studies?

Eye tracking studies are studies done using a specialized piece of eyewear that records how the eye responds to stimuli, both active and passive. These studies use sensitive cameras and electrodes to see where the eye naturally rests, given various things to look at. Some of the results are quite surprising:• Peoples’ eyes naturally rest on light greens, blues and purples, and avoid hot colors (in the West at least. Nearly the opposite is true for people in China and Japan)
• An overwhelmingly large percentage of people will look for information in the top right of a page, before looking anywhere else
• The next place they look is the top of the center space, where a headline would be (probably trained to do this by newspapers)
• If they don’t find what they’re looking for there, they go to above that, or to the left (which is where you’d expect to find a menu)
• Lastly, they’ll look to the right hand side of the page and below the main image/article for more information

What does this mean for my website?

It means that you are bound to certain design elements, if you really want to drive the right kind of visitor behaviour. It means the following things:

Put important things where people expect to find them

Creating a ground-breaking design is all well and good, but if nobody can figure out how to log in or navigate your site, you won’t be converting many visitors. A few things have become standard:

• Login/account-related links should go in the top right
• Menus/navigation should always be on the left or the top. Some sites have it on the right, and some sites are very clever in incorporating it into the design, but if you have a site that follows a more or less standard model, you’ll want to keep this stuff here.
• Put your “follow on action” to the right, and possibly slightly below, your main content. People read info on the left, and proceed to “do” something on the right.

Plan your user journey across the page

Imagine your user’s eye as it first encounters your page. Don’t look at the things you want them to see, look at what they’re most likely to be attracted to.

Start at the top, with the headline of your content or the main picture/video. Where do they go from there? Figure out what the natural next step is, or where the attention is naturally drawn, and put something there like a big “BUY NOW” button - something that inspires action.