Understanding Your Online Shoppers Using Data Part 2: Heat maps

0 min read

Alicia Doiron

In our first blog post of this 3 part series we discussed the use of web analytics and how they play a role in understanding customers and visitors to your eCommerce business. Today we’ll discuss the importance and reasons to utilize different types of heat maps.

In addition, which pages of your online store will benefit the most from using heat maps, as well as some proven tools to get you started. The insights you’ll collect from the various mapping softwares will help improve your site and enable you to make data-backed business decisions.

What many people don't realize is that "heat map" is a bit of a blanket term that actually includes a few different data visualization maps including hover maps, click maps, attention maps, and scroll maps.

Hover maps

Hover maps are typically what people mean when they say heat map. It’s the basic map that tracks a user’s mouse movement. It shows where visitors to your eCommerce site have hovered their mouse cursor.

The idea behind hover maps is that people look where they hover, which means those are the most important areas of your online store. Typically the heat map will be defined by a color system. For example, if the map is bright red in one area, that signifies where your users are hovering the most.

Click maps

Click maps are quite helpful, especially when paired with other analytics tools such as Google Analytics. Click maps provide you with aggregated click data which allows you to understand the user's intent.

For example, if visitors are consecutively clicking on product images, it could mean they want a closer look at your products. Or if visitors are clicking on something that looks to be a link but isn’t, you’ll probably want to change that to a link, or make it appear less like a button.

Likewise, click maps also reveal elements of your online store that aren’t getting clicked on. Vital information that you want your online visitors to read or see could be missed, click maps provide you with the data to fix that problem.

Click maps are wonderful for gathering intel on user experience issues as well as what your store is getting right, which helps improve eCommerce optimization.

Attention heat maps

Attention heat maps are probably the most helpful of the bunch for collecting usable data. These maps reveal the amount of time visitors spend on your eCommerce store. They tell you which areas of your page were given the most attention, how much a user scrolled a page (horizontally or vertically), and how much time they’ve spent on any given page. This type of eCommerce heat map also takes into account various screen sizes and resolutions.

So what are these attention heat maps good for? If you hadn’t already guessed, they’re perfect for improve your site’s conversion rate and user experience. Attention maps can tell you which of your pages are the most engaging by looking at clicks, scrolls and time on page. They can help you to determine where to place your most important pieces of information, whether that be images, text, or links.

Scroll maps

Scroll maps work exactly as how you think they would. They tell you how far your visitors are scrolling down your pages and reveal where users tend to bounce. Scroll maps are perfect for eCommerce stores that have pages that are quite long and especially helpful for long checkout forms.

Like attention maps, scroll maps reveal where users are dropping off on a page. This helps you prioritize which text or images should be placed near the top of the page. Once you’ve got this data, you’ll be able to build more effective eCommerce pages.

Heat map image via Conversion XL

Which eCommerce Pages to Optimize first?

We’ve now established that heat maps are great for making data backed decisions when it comes to optimizing your eCommerce store. But what pages should you start on?

Well, that depends which of your pages needs the most amount of work. But most of the time you can bet it will be either the homepage, product page, or checkout page where you can uncover anything from where to place valuable to content to whether or not your shipping policies need to more visible. 

Heat map tools

There’s many great tools out there that can help you analyze the behaviour of your visitors through heat maps.

Here’s a whole lot of different tools to get you started: CrazyEgg, SumoMe, HotJar, Fullstory, Inspectlet, Jaco, MouseFlow, Lucky Orange, MouseStats,UsabilityTools, UserTrack, and Zeerat.


Heat maps are essential tools to better understand customer behaviours and the conversion process, especially when a combination of heat maps are utilized. In addition, it’s a great idea to pair this data along with your eCommerce analytics data, such as Google Analytics, for a more holistic picture.