Written by Brian Cray on July 27th, 2009
Eye tracking studies provide unique insight into user behavior. The following 3 eye tracking studies were part of my research for my redesign.
1. Web form design guidelines: an eyetracking study
An in-depth comparison of three form designs—Google mail signup, Hotmail signup, and Yahoo! Mail signup. The selection of forms are ideal because each form is long as well as unique in terms of label positioning, field grouping, and identification of required fields. Here are my major takeaways from the study:
- Make the form fields vertical, not horizontal
- Left-aligned labels are clearer
- People tend to fill out all form fields regardless
2. The Best of Eyetrack III: What We Saw When We Looked Through Their Eyes
This study focused on the layout of regular content and whether users scan or read. Here were my major takeaways from the study:
- Headlines draw eyes before pictures
- People scan the left side of everything
- The first few words of headlines are very important
- Single column designs produce the most eye fixations
- Scrolling is okay
- Introductory paragraphs get read
3. F-Shaped Pattern For Reading Web Content
This is a classic eye-tracking study by a classic guru: Jakob Nielsen. If you don't know who he is and you're in web design, read his books or get out of the biz. Anyway, this particular eye tracking study reveals that users read content in a "F" pattern. Here are my major takeaways from the study:
- People read the headline and the first paragraph before scanning the left side of the content
- Headlines should start with keywords to pull the eyes from the left margin
Using eye tracking studies in my redesign
Common themes arose in all of the eye tracking studies that made it impossible to ignore the strong implications of these rules:
- Single column designs are a win. Left-side scanning played a key role in each eye tracking study. If important information is not on the left side of the page, it's likely to get seen by few. So I made my design one column.
- Keywords are crucial to conversion. The first few words of each headline and paragraph are likely the only things most users will see. Make them count. So I made the headlines large and scannable and in the future I'll front-load keywords.
- Content should be the focus of the design. Many elements play a role in the success of a design, but your content is what people come for and scan. If your content doesn't move their eyes off the left margin, nothing else will. So I made my design secondary to the content.
What are your feelings about eye tracking studies? Are they reliable? What do you feel about the results? Are they valid? Your opinions are welcome!