Where Oh Where Did My Eyeballs Go?

We all know that human behavior is not always predictable. Take “eye-tracking” — the way your eyes move as you search for information. You pick up a newspaper — your eyes go for the pictures first. So it should follow that the same thing will happen when you sit in front of a computer screen, right?

Well, the Stanford-Poynter Project discovered that when folks read news online, their eyes go for text first, particularly captions and summaries, and graphics only later. Sometimes much later. Sometimes not at all! This has made a lot of commercial copywriters happy. It has also heralded a new field of inquiry: How folks scan Web sites for information.

Why is this information critical for you? If you know how people gather information visually from their browser windows, you’ve got a powerful design tool you can use right now to support your mission of persuading your visitors to take the action you want. So, how do they do it?

When a user lands on your Web page, she gives the window a quick scan that starts at the top left, moves quickly across the center to the right, then returns leftward, again crossing center, as she works her way down. (Note that this is the pattern for Western cultures.) All this happens in seconds, without the user necessarily fixing her gaze until she reaches the center of the display as she’s coming back. It also usually happens without her being aware of it.

What’s she doing? She’s on a preliminary scouting mission, an effort to quickly orient herself within the context of a page, before she makes the conscious effort to engage with the information. She’s also trying to get at least a general sense of whether there’s any information there that’s worth engaging.

Your logo should be one of the first elements the user encounters at the top of the page (so make sure it’s one of the first things that loads). This is your identity. Along with the URL, it lets your users know they’ve landed in the right place.

Global navigation schemes work well here; they provide the preliminary assurance of general organization and can serve as backup.

Make sure your unique selling proposition (USP) is clear and prominent.

Jared Spool’s User Interface Engineering group has discovered that a user’s gaze ultimately fixes in the center of the screen, then moves left, then right, a pattern of visual fixation true of both new and experienced users. A user fixes on areas other than the center only when she is looking for additional information. The team also found that users pretty much ignore the bottom of the screen and seem to interact peripherally with the right area (folks use their vertical scroll bar without obviously looking at it!).

Clearly, the center area of the screen is prime real estate, the “active window” where you will either succeed or fail in persuading your visitor. This is the first place your visitor makes a conscious effort to engage with you. When her gaze returns across the screen from its preliminary scan, you want to make sure you present content that will capture her interest and motivate her through the conversion process. If anything on the page distracts her or requires her to disconnect from the center area, she is that much less likely to stay, rapt by your powers of persuasion. And if you’ve learned the Stanford-Poynter lesson, you’ll understand that your copy is much more important than your images.

The left side of the screen can function as a “stabilizing window,” a place where people look for particular points of reference that can help them locate the items that suit their needs. Comprehensive navigation works well here.

Even when they remain engaged in the central area, users peripherally attend to the right area. This becomes a valuable space to convey confidence through your assurances, guarantees, and testimonials. Calls to action do well here, too. A “subscribe to our newsletter” is a good example. For another, notice how Amazon.com has its “Add to Shopping Cart” and “1-Click” action block in the top right, and below this is its “Add to Wish List” button. Because the user is peripherally aware of it, she knows it is there if and when she is ready to take that action.

Using your knowledge of eye-tracking, your general order of business is, first, to orient your visitor, then use your active window to keep her attention and persuade her to become a buyer (or subscriber or whatever your goal is). The other screen real estate on your Web site is no less important to the overall effort, but your users are simply never going to give it the same visual priority. For an example of integrating the full range of Web site composition elements in a way that acknowledges how folks scan, pay a visit to HiQhq.com.

If you know how folks scan, you have a template for placing things on your Web pages so your visitors will find what they are looking for where they expect to find it and in the way that engages them best. Don’t think of it as limiting your artistic freedom; think of it as knowledge you can use to meet your customers’ needs and thereby increase your conversion rate!

PS: On September 3, my good friend Roy William’s “Magical Worlds of the Wizard of Ads: Tools and Techniques for Profitable Persuasion” is being released. I just finished my preview copy, and I recommend it highly (it’s a wonderful preview to the Wizard Academy). Get yours today and enjoy some of the Wizard’s magic.

Related reading

Flat business devices communication with cloud services isolated on the light blue background.
Vector illustration with a magnifying glass focusing on a pie chart, a graph line trending upwards, and other metrics symbols.