iMedia Mobile Site

It's easy. Free. On the go.

Be sure to check it out

best practices

Usability Studies 101: Follow the Eye

August 19, 2005

NextStage's Joseph Carrabis talks about how the eye tracks information online, why red is the color of success and where to place information on your site.

A few columns back I wrote about a hungry peasant and how principles of crop rotation can be used to determine where to place things on a page. I'm going to write about these things again because of some eye tracking and related studies recently published in:

[Editor's note: subscriptions are required for all these articles.]

There was some fascinating information there that anyone designing marketing material might like to know.

I'm also going to build on my last column's suggestion that you study the interaction, not simply the results of the interaction, in order to design and plan material to be most effective. By understanding what's driving the interaction -- the "who, what, when, where, why and how", if you will -- you will know how to get the results and responses you want when and where you want them.

Clients rely on us to understand this for them all the time. We often hear comments such as, "how come our search word buys aren't getting us anywhere? These words worked before." Part of our job is to understand why those search buys were profitable before and create the visitor environment that will make them profitable again. In other words, understand the theory and you'll be able to create the application.

So let's explore what causes the eyes to move the way they do, what they're capable of seeing and how they see it. By knowing these things you'll know how to get the responses you want.

The only colors you'll ever need

A recent study determined that regardless of culture, language, education or income level the only colors people really recognize are black, white, red, yellow, green and blue. That's it, just those six. Two people can see something colored red and both will agree that it's red. Two hundred people can see something colored chartreuse and you'll get 600 responses as to what color it really is.

I agree with Harry Chapin that "there are so many colors in the rainbow, so let's use every one." However, design your material so that

  • These six easily recognized and understood colors are around or at least leading to your decision points
  • Important information is highlighted by these colors
  • These colors lead the eye where you want it to go

Be visually stunning, except where doing so stops the visitor's brain from seeing what you really want it to see.

Dress in red for success

Having noted the six colors everyone can recognize, note that there is a cultural bias regarding the color red. Western cultures find red to be a "success" color in many endeavors.

Do you want an image that is paternal and authoritative? Give that elderly gent a tie with red stripes on it. Want to make sure visitors to your website pay attention to momma? Give her a red apron. Want to let people know that your software really is the best around? Put a red ribbon around it. An image of a woman in business dress and a red blazer will be more powerful than the same image without red; an image of a man in business dress with a red tie is more powerful than the same image without.

Red can also be a halo color for decision points on a web page or brochure. In the case of a brochure, though, make sure the decision point is immediately actionable.

Also remember what we stated earlier; red as a "success" color is culturally based. Companies planning promotions into Chinese markets would be advised to remember that red is a wedding color and white a funeral color in this market. Design for other cultures and other colors might apply. That said, and remembering I'm writing for a western cultural bias:

  • Give authority figures a red flair
  • Highlight important and action items with a red halo or arrow
  • Use red subtly to indicate authority, success and power

Put decision points where people can find them

People non-consciously scan material in a clock-wise circle starting at 10 o'clock and return to that position after the scan is completed. Increasing research indicates that if people can't find what they're looking for during that search period they'll stop looking, period.

You can have important information somewhere in your material or on your landing page, but if it's not in that search pattern people will tend to miss it. What's worse, even if they make a conscious effort to look for it they'll tend to miss it. And what they can't find, you don't have. Here are some easy suggestions for putting things where they can be found:

  • Place decision points or other important items in the scan circle
  • Use one of those six colors to highlight the decision point
  • Use the six different colors to highlight different decision points in the scan circle
  • If you're giving someone a brochure, attach your business card to the outside of the brochure at the 10 o'clock position
  • When you give someone a brochure highlight actions you want them to take in red, things you want them to remember in yellow

I wrote in my last column that, by understanding the interaction between people and information, you can plan that interaction's result and response to be what you want, rather than what people have learned to give you. Here I've provided some tips for driving interactions based on research documented in some of the most prestigious scientific journals in the world.

Want people to think you're an authority or your site is authoritative? Use a little red in the border or on your tie or pin.

Want to make sure something is found? Place it in the non-conscious scan circle.

Want to make the eye see something and lock on it before moving on? Use an easily recognized color as a highlight, halo or border to that object.

Remember that design and redesign is like cutting hair -- a little at a time gives you better control of the results.

Now go knock yourselves out.

Joseph Carrabis has been everything from butcher to truck driver to Senior Knowledge Architect to Chief Research Scientist. His 22 books and 225 articles have ranged among cultural anthropology, mathematics, information mechanics, language acquisition, neurolinguistics, psychodynamics and psychosocial modeling -- among other eclectic topics. His knowledge and data designs have been used by Caltech, Citibank, DOD, IBM, NASA, Owens-Corning and Smith-Barney among others.

Carrabis is CRO and Founder of NextStage Evolution and NextStage Global, and founder of KnowledgeNH and NH Business Development Network. He's inventor and developer of Evolution Technology, and will be speaking at the September 2005 MCAN management meeting in Baltimore on "Six Web Techniques that Get New Business." Come on by and introduce yourself. You can download sections of Carrabis' next book, "Reading Virtual Minds," at www.hungrypeasant.com.

ad:tech San Francisco

April 19 - 21, 2010 | San Francisco, California

ad:tech San Francisco

KEYNOTE SPEAKER

David Baker David Baker, VP, CRM-eCRM Solutions
Razorfish


EXHIBITORS

FOX NetworksFOX Networks

PlentyOfFishPlentyOfFish

LyrisLyris

NielsenNielsen

Register More Details

Agency Summit

May 16-19, 2010, 2010 | Austin, Texas

iMedia Brand Summit

KEYNOTE SPEAKER

Lisa Donahue Lisa Donahue, CEO, Starcom USA


 
PAST ATTENDEES INCLUDE

RazorfishMedia Director

StarcomDigital Director, Coca Cola

AKQAGroup Media Director

DeutschVP, Digital Media Director

Invitation

MOST POPULAR
Advertisement