8 takeaways from eye tracking studies

Position of key elements on the page, the use of white space, images of people—all help direct visitors’ attention where you want it. Oh, and ditch the banner ads; they aren’t worth the bother.

When it comes to data, you can’t have enough. Crunching numbers, running tests, poring over metrics, analyzing trends-these all help to build great businesses and terrific websites.

One fascinating field of study of consumer behavior is eye tracking. The information gleaned from eye tracking can help you become a more proficient Web designer, content writer, conversion optimization expert, or online marketer.

I’ve summarized the results of some eye tracking tests so you can start seeing better results in your businesses.

Eye tracking basically measures where people look on a Web page and for how long. Eye tracking data are presented visually, overlaid on the screen that the subjects were looking at, similarly to the image above.

With eye tracking, you can discover where a person looked first, second, third, and so on. You can find out what the user considers to be the most interesting part of the screen and how long he or she looked at certain areas.

Like any powerful data research, eye tracking studies aren’t cheap. The least expensive eye tracking devices cost around $5,000. By analyzing public eye tracking studies, I came up with eight takeaways that can help your online business.

Takeaway No. 1: Put your most valuable content above the fold.

You have only eight seconds to grab your visitors’ attention, so make sure you are placing enticing information above your fold. When doing this, be careful: Don’t clutter your space above the fold by cramming in tons of calls to action.

Even though it’s the most important real estate on your page, this doesn’t mean you should neglect the rest of your space. Cramming everything above the fold can completely destroy the usability of an otherwise functional website.

Work on making your messaging and copy appealing. That’s what will encourage people to read more and potentially purchase from you.

For example, I just ran an A/B test on my new design of NeilPatel.com and found that placing a call to action above the fold decreased conversions by 21 percent.

Takeaway No. 2: Put calls to action at the bottom of the page.

Although the top of the page is the most-viewed portion of the page, the bottom is the second-most viewed portion of the page. People do scroll down. When they do, they go straight to the bottom of the page, where the scrolling stops. That’s where you want to hit them with your call to action.

I use calls to action at several points on my site. I recommend you do the same.

If you look at the Crazy Egg heatmap, you’ll notice that the call to action that’s located toward the bottom of my Quick Sprout membership page gets a large portion of clicks. It actually gets 39 percent more clicks than the call to action button in the middle of the membership page.

Takeaway No. 3: People read big, bold headlines.

The bigger and more obtrusive your headlines are, the more people are likely to read them. Various studies, including the popular F-shaped pattern study, demonstrated that headline size is important.

A significant study on this subject from The Poynter Institute concluded, “Dominant headlines most often draw the eye first upon entering the page.”

I’ve previously discussed theimportance of headlines and how to write them. In addition to the readable sizzle, a headline should also have dominant design elements-big and bold.

I sometimes use some sweet visual panache for my headlines:

More often than not, I just use a big typeface:

Takeaway No. 4: Chunks of information are best.

You’ve probably heard that you should break up your content into short paragraphs, provide headings, use bullets, and create numbered lists.

The reason for this is intuitive: We don’t easily absorb massive blocks of text.

An eye tracking heatmap shows the gaze duration on a page, pointing out the need for digestible chunks of information.

Evidently, people look at chunks. This page isn’t necessarily a great example of a successful layout design. It does, however, illustrate the idea that people look at the headings with strong visual elements-central positioning, strong colors, and well-thought-out spatial organization.

Takeaway No. 5: You need a lot of white space.

White space, otherwise known as negative space, is an important part of Web design. The evidence from eye tracking studies confirms this:

In the examples above, you can see that the more expansive layout with negative space encourages clean movement and better intake of the data.

Negative space seems wasted. Why not put something there, right? In reality, negative space is valuable because it facilitates movement through the rest of the page. The human eye wants a place to “rest,” as it were, from the various components of the page. The eye also needs to know where to go next.

Negative space provides a way for this to happen.

Takeaway No. 6: The left side of your page is important.

Eye tracking studies indicate that users spend most of their time with their eyes on the left half of the page.

Many written languages use a left-to-right reading pattern. In Web design conventions and reading habits, this viewing pattern has become ingrained. We tend to look left.

When designing pages or positioning content, maximize the left side of the page by placing important elements there.

Takeaway No. 7: Get rid of banners.

People ignore Web banners. This decline in attention to banners began right around the time when banner ads were in their heyday.

Banner ads started out being fairly innocuous; they were just ads. Then they started vibrating to get your attention. Or they looked like a system error. Or they told you that you were the millionth visitor to a website and would therefore receive your own gold Ferrari….

Click on the ad!? Yeah, right.

Dubbed “banner blindness,” this was one of the first and most talked about usability phenomena in the early days of eye tracking studies. Jakob Nielsen started uncovering this data in 1997.

Banner blindness is now accepted Internet wisdom and usability common sense. It’s such an important feature that it has its own Wikipedia article. If you don’t believe me when I say people ignore banners, just look at the eye tracking study below.

Unless you have no other way to monetize your site, you shouldn’t use banners.

Takeaway No. 8: Pictures of people are good.

From LinkedIn studies to other usability studies, the experts agree: Pictures of people are beneficial. Looking at someone else, even in a photo, prompts-usually-a positive physiological reaction of attraction, understanding, or identification.

A page that has pictures of a person’s face encourages interaction and viewing and decreases a bounce rate.

There are at least four takeaways from the eye tracking studies on this subject:

1. Use pictures of people as design elements. You may wish to use images of people on your home page. People look at other people and, as a result, stay longer on the page.

2. Use a picture on your About page. People are more likely to believe you, trust you, and do business with you if they see what you look like.

3. Use your picture on your LinkedIn profile. It engenders trust.

4. Work on Google authorship. People click more often on SERP entries that have authorship images.


You can improve your website, your conversions, your business, and your product simply by paying attention to eye tracking studies.

Where people look is incredibly important because it affects what they learn, what they do, and what they buy. A look precedes a click.

What other powerful takeaways have you gained from eye tracking studies?

A version of this article first appeared on QuickSprout.


Ragan.com Daily Headlines

Sign up to receive the latest articles from Ragan.com directly in your inbox.