Heatmapping

How customers influence website design without knowing it

Frustrated how your favorite websites keep changing their designs? Obviously you can’t be the only one complaining about this, right? There must be a reason for it, but why? Now it turns out you (yes, YOU!) might be the actual reason for these changes!

Even before the beginning of the Internet, marketers used eye tracking to find out what people were watching when viewing an advertisement. A well known example of this it the advertisements below, for Sunsilk. It shows that even the smallest details like the direction of the eyes influences the attention that is paid to the product itself.

Advertisment for Sunsilk. The overlay shows where viewers were watching, red being the most watched areas.

Nowadays, this type of data is of immense value to website designers. Basically, three types of data on visitor’s behavior can be distinguished. Generally, the more informative these are, the harder or more expensive they are to obtain:

Simple visitor statistics (for instance: google.com/analytics).
Click-tracking (for instance: crazyegg.com)
Eye-tracking (for instance: tobii.com)

One way of using this visitor data is so-called A/B testing, where two different designs of the same website are uploaded, and visitors are assigned randomly to one of the two. Visitor data will then not only provide usable data on which of the versions sells the most products, for instance, but also how long visitors stayed at one page, which pages were the most popular, which links were clicked the most and how visitors find their way through the pages. This is useful information, as it can help website designers to put the most important information in the most viewed location on their website. It can be compared to the marketing example mentioned above, which can be considered an offline type of A/B testing

An interesting fact that has been proven with this type of testing is so-called ‘banner blindness’ [1]. A great example for this is shown below, where it can be seen that the banners don’t get any attention from the visitor of the page.

Heatmaps from eye-tracking studies. From [1]. It can be seen that the advertisement banners (the green boxes) don’t attract any attention.

Fun fact: Did you know that banner blindness decided the election for a seat in the US House of Representatives in 2006? [2]

If you are still wondering why Google advertisements on websites are so ‘dull’, it’s not because Google is too lazy to come up with a bright design; it’s because if they were designed as flashy banners, they would get no attention at all.

These heatmapping studies show a different way how companies interact with their customers. Even though the customers are unaware of being tracked, they provide valuable data on their use of the websites. This can then be used by the website designers to make the website more usable: creating value on both sides of the equation.

[1] Nielsen, 2007. Banner Blindness: Old and New Findings. http://www.nngroup.com/articles/banner-blindness-old-and-new-findings/, Accessed May 18, 2014.

[2] Nielsen, 2007. Banner Blindness in Ballot Design. http://www.nngroup.com/articles/banner-blindness-in-ballot-design/, Accessed May 18, 2014.