Hot Tips To Using and Interpreting Website Heatmaps

Our Head of CRO, Emma Adcock, delves into the world of heatmaps to demonstrate how they can achieve solid results as part of your CRO campaign.

Heatmaps, which use eyetracking technology to learn more about how people view and process information online, have been around for a few years and can be extremely useful for optimizing websites as part of a CRO campaign. Indeed, Emma Adcock believes they are the cornerstones of a CRO campaign.

Here’s what she has to say about it.

There is no silver bullet with CRO, to its very core CRO should be based upon facts drawn from your own website rather than opinion. Run from anyone who throws their thoughts about without citing the research behind it. And it should be research that relates specifically to your site, not generalist stats.

Heatmaps come into their own as they show you areas of interest on your pages. Studies have shown that where a site visitor hoovers over or rests on the page, this correlates with eye tracking. Heatmaps represent this as an overlay, so the hot spot (red areas) of the page overlay denote areas of intense interest, blue areas are areas which lack engagement. This helps you to identify high engagement areas on your pages.

You should view heatmaps with reference to click maps (where a visitor clicks on page) and page scroll maps, which show you how far visitors scroll down a page too.

Step One: Heatmap Strategy

One of the keys to heatmap analysis is the strategy that sits behind why you are doing it in the first place. This is fundamental to heatmap interpretation. And this doesn’t mean going straight into the heatmap.

Some things are straight forward, obviously test the high traffic pages, but I would start by identifying the pages you want to test based on results which will help you.

Testing all the site can be a little overwhelming to begin with. So consult Google Analytics to identify conversion path pages through the site, pages with high bounce levels or entry landing pages, helping you to understand your visitors’ behaviours and to focus your initial efforts.

Step Two: Know Your Pages

Once you have your pages, before you initiate the heatmap process review each page and understand its ‘page purpose’. Writing this as a quick summary is really helpful in this process.

So is the purpose of the page to encourage visitors to visit a further page in the conversion path? Is it the final stage before cart? Is it a category level page? Is the page meant to inform or entice?

Once you have this, complete goal mapping on each page, even as a bullet point against each page:

• What do you want a visitor to do on page? Where do you want them to go?
• What are the important elements on this page?
• What messages do you want visitors to read?
• What do you expect them to do?
• Do you think certain customer groups will behave differently i.e. will repeat customers go to a certain place vs new customers? How about visitors buying for other people? Divide your customer groups and define the way in which you expect them to behave on each page.

Step Three:  The Heatmaps

Now you are running your heatmaps, a few pointers there: ensure that you allow a reasonable length of time, at least a few weeks (depending on your site traffic). This ensures the heatmaps capture potential alterations in behaviour of your visitors, such as weekend traffic vs week day traffic. Ideally, if your heatmap software allows it and your site is exposed to changes in behaviour through the week, you could reduce the date range so you can compare and contrast weekend vs weekday traffic. However, please ensure you have enough traffic in order to do this. A few visits don’t make a valid heatmap.

Also, don’t complete site updates on the pages at the same time – as this will skew the results and give you really weird looking heatmaps that don’t tell you much!

So you’ve got your heatmaps, here are a few tips for interpretation:

• Refer back to your page purpose and goal mapping notes. Did the visitors behave as you would expect? Did they engage with the areas on the page you wanted them to? Did they scroll far enough to witness the important messages?
• Open your current web pages as a comparison. Having the page you used for test open at the same time is a really easy way to double check page elements.
• Zoom out. At first, just zoom out on the heatmap, it’s easier to view everything at once than scrolling down, it also gives you a full picture about the behaviours on that page and you can drill further into each element after this first view.
• Anything odd? Looking at the heatmap from your notes and what you expect is a good initial review, but also look out for anything odd as well. One heatmap I looked at had a lot of engagement on an image, on further investigation we realised visitors were trying to click on the image and navigate by it. Heatmap analysis should lead you to further investigation and doesn’t provide definitive answers.

Final Words of Advice:

Heatmaps show you a path and an impression of behaviour on site through volume, but they don’t reveal the intent of the visitor – why is that visitor on your site in the first place? What do they want? Heatmaps give you an insight from which you can base further testing and investigation.

You should complete heatmap testing on your CRO A/B and MVT tests as a comparison too, to determine whether visitor behaviour on each page – your variant vs control – has altered as well.