Heat maps for beginners: a comprehensive guide
Article topics
- What is a heat map?
- What are the different types of heat maps?
- What can I learn from a heat map?
- Are there any downsides to using heat maps?
- Are there any privacy issues with using heat map tracking software?
- Will heat map tracking software be affected by the phase-out of third-party cookies?
- Where can I get heat maps for my website?
When you have an eCommerce website, how do you know which parts of your site customers engage with the most?
While analytics tools like Google Analytics can tell you which pages are the most popular, they can’t tell you the whole story. For example, if you have a landing page, how far down are prospective customers scrolling before they get bored and leave?
That’s the beauty of heat maps. Heat maps show how web visitors react on your pages, meaning you can understand how people behave on your site and make changes to enhance the user experience (UX).
If you’re new to website heat mapping, we’ve put together this guide to explain how it works and how you can use it on your online store.
What is a heat map?
A heat map is a visual representation of how people interact with a specific page on your website. So with a heat map, you can see where web users move their mouse, scroll, and click.
This helps you see what elements on your pages grab people’s attention and identify how to help web visitors convert.
To add heat map technology to your website, you need to add a piece of JavaScript code that tracks user interactions to your site. The heat map tracker then places a cookie on each web visitor’s computer that tracks their movements. We’ll talk about the future of third-party cookies and how they affect heat maps later.
You can then use the data you collect to generate heat maps on different pages of your site, as well as track the overall user journey.
Heat mapping is an integral part of conversion rate optimisation (CRO). CRO is the process of making small and frequent changes to a website to increase the number of people who carry out a particular action. For example, making a purchase or signing up to a mailing list.
What are the different types of heat maps?
The great thing about heat mapping is that there are lots of different types, meaning you can choose the heat map that best suits your needs and requirements. The heat maps on offer include:
Click heat maps
Click heat maps show where web visitors are clicking on a webpage. This can show which call-to-actions and links are getting the most interest and which your prospective customers are ignoring.
There is also a particular type of click heat map known as a ‘rage click’ heat map. This can show where users are clicking multiple times and getting frustrated. For example, if there’s an underlined piece of content on your page that users click on, thinking it’s a hyperlink.
Scroll heat maps
Scroll heat maps show how far down the page visitors are getting. These heat maps are ideal for long landing pages or blog posts as you can see if prospective customers are reading the whole page and, if not, where they drop off.
Mouse-tracking heat maps
Mouse-tracking heat maps trace where web visitors move their mouse on a page. This means you can see not just where people click, but what elements they hover over.
Eye-tracking heat maps
Eye tracking heat maps show where users are looking on a web page, monitoring eye movement, blinking, and pupil dilation.
This heat map is more specialist as eye-tracking technology is used to see what elements of a page people are focusing on. While this heat map is the most accurate, it’s also the most expensive.
What can I learn from a heat map?
Heat maps provide useful insight you can use to make changes to your website. Here are some ways you can use them to enhance your eCommerce store:
- To see if customers engage with photos, documents, and videos
- To understand the customer journey and if web visitors know where you want them to go next
- To see if web visitors are losing attention on your pages and, if so, where
- To see where to put call-to-action buttons and other elements to get the most clicks
Here’s a great example of a heat map case study facilitated by usability expert James Breeze.
James conducted a heat map of an advert, tracking people’s eye movement. While people were focused on the baby’s face, they weren’t focused on the ad copy.
The ad was revised, so the baby looked directly at the ad copy instead. As a result, more people read the text!
As well as helping you make changes to your site, heat maps can help you see if the changes you have made are effective. This ensures you get the best conversion rates on your pages.
Are there any downsides to using heat maps?
One of the disadvantages of heat maps is that while they can tell you which actions customers have carried out on your website, they can’t tell you about the intent behind them.
Sometimes, you have to interpret what the different clicks and splodges mean, which can lead to vague or potentially incorrect assumptions!
With this in mind, you should never use heat maps on their own – you get the best results when you combine them with other methods of gathering CRO data.
For example, you can combine heat map analysis with customer interviews. That way, you can get a feel for the reasons why your site visitors carry out specific actions and visit certain areas of your site.
Are there any privacy issues with using heat map tracking software?
Heat map tracking software collects anonymous data about website users, including their browsing history, and potentially their IP address. However, this information is likely to be already collected by other tools you might use on your website, for example, analytics software.
If you use heat map tracking software on your website, it’s essential to update your privacy policy. You need to specify what data you collect, how you use it, and if you share it with other businesses or providers.
It’s also worth informing visitors that they can opt out of tracking in your cookie settings.
Will heat map tracking software be affected by the phase-out of third-party cookies?
Third-party cookies (cookies placed on your website by a third-party provider) are currently in the process of being phased out. Firefox and Safari block them by default, and Chrome will start phasing them out in 2024.
This may affect how heat map tracking software works, but many heat map providers are prepared for this situation. For example, Hotjar only uses first-party cookies and doesn’t collect IP addresses.
If you plan to use a heat map tracking platform, ask what its approach to privacy and third-party cookies is before purchasing.
Where can I get heat maps for my website?
There are lots of platforms that offer heat map tracking. Most of these are paid for, but offer free trials or freemium versions. Some of our favourites include:
If you’re looking for a free and reliable heat map tracker, Microsoft Clarity offers free heat mapping and session recordings. It works with WooCommerce, Shopify, and other platforms, making it easy to install and use.
Alternatively, a good digital marketing agency specialising in CRO will have access to high-quality heat mapping tools they can use on your behalf.
Need help with your heat maps? Xigen is here to help
Heat maps are a fantastic way to identify which parts of your website customers love and which sections they struggle with.
We specialise in conversion rate optimisation at Xigen. Our team of CRO specialists use technology like heat mapping, A/B testing, and live session recordings to improve the user experience and drive sales for your business.
Want to see how heat maps can transform the way you do business? Get in touch with our team today!
Back