Using the latest eye-tracking equipment to conduct our Holiday E-commerce Showdown (full story), we uncovered several usability rules. By following the testers line of sight and the length of time spent searching, we determined what shoppers look at first - and what holds their attention when they shop on the Web.
These sample screens, called GazeTraces, show exactly where the testers were looking - and what helped or hindered their online shopping experience.
For more information on eyetracking, visit www.eyetracking.com or send an e-mail to testers@eyetracing.com.)
![]() Time intervals in which testers' eyes scanned the Web site. | ![]() | 0.01 - 4.0 sec |
![]() | 4.01 - 8.0 sec | |
![]() | 8.01 - 12.0 sec | |
![]() | 12.01 - 16.0 sec | |
![]() | 16.01 - 20.0 sec | |
![]() | 20.01 - 24.0 sec | |
![]() | 24.01 - 28.0 sec | |
![]() | 28.01 - 32.0 sec |
Dumb It Down
Simple navigational tools—tabs and hyperlinks—work better than elaborate and detailed tools. Customers won’t stay to figure out your site. The well-labeled tabs at Outpost.com made it easy to navigate the site. This tester found where to go in less than four seconds.
Lose the Lists
Customers don’t like to select items from long lists—they often miss the product they’re trying to find. Long lists and menus at CDW.com were difficult to scan quickly and often resulted in confusion.
Search Engine Tune-Up
When shopping for a specific item, customers would rather use product search engines than click through pages—keep your search engine finely tuned, and always allow for approxiamate spellings. Without immediate visual cues like those at Toysrus.com, testers were compelled to use eToys' search box.
Center Stage
Customers’ eyes land immediately on the center of the page. Treat this as prime real estate and place product graphics here—skip the text. Graphics draw the user's eye more quickly than anything. Toysrus.com directed this tester to the hottest product in less than four seconds.
Lay It Out
Amazon's easy-to-read layout helped this user quickly identify a Braille edition of Harry Potter and the Sorcerer's Stone.
Readability Counts
Thanks to small fonts and a more compact design, the same search for Braille on Barnesandnoble.com took much longer than on Amazon.com.
Too Simple
In a search for an MP3 player, many users were confused by the overly simple category labels. They finally resorted to the search engine.
Search Party
Too many search buttons left users confused at Priceline.com. A simpler search would have helped.
The Great Unknown
Sometimes great features go unnoticed, like Expedia's PriceMatcher. This user scanned it heavily but never selected it.
For the Browser
For a site like PlanetRx.com, easy-to-read menus made it simple for shoppers to browse through many product categories to find what they were looking for.