Omnitail

The Profit-Driven Online Marketing Agency

Contact Us

Vocab for Marketers: Heatmap

vocab for marketers - what is a heatmap in cro

What is a heatmap in conversion rate optimization (CRO)?

Definition

A heatmap is a data visualization technique that uses color gradients to show where users click, scroll, or otherwise engage with a digital interface.  

Heatmaps visually aggregate user behavior to help identify areas of a webpage that are important (or unimportant) to users. They’re typically rendered as blobs of color that overlay a screenshot of a specific digital interface screen, such as an app screen or webpage. The color gradient scales from a “hot” color (often red) down the spectrum to a “cold” color (often blue). 

heatmap

How Heatmaps Are Generated

User data, such as mouse movement, scroll depth, and mouse clicks or touchpoints, are used to generate heatmaps. Areas with a high amount of data points are considered “hot” and are colored as such. For example, a primary call-to-action button likely gets a lot of clicks, so it would have a “hot” color blob over it to indicate a lot of clicks or taps. 

A heatmap can be generated with data collected from a single page or from multiple pages. Those that contain data from multiple pages are typically used to focus on user interface elements that are consistent across all of the targeted pages, like a navigation bar.

Many tools generate heatmaps—typically as part of a SaaS platform and also include other user behavior research systems like session replay capabilities. Some examples include Microsoft Clarity, Hotjar, Mouseflow, FullStory, Crazy Egg, and LuckyOrange. 

Types of Heatmaps & Why They're Useful

Click map: This is a map of user engagement behavior from element selector data that highlights frequently clicked-on areas. They’re used to analyze engagement patterns to see if user behavior aligns with the business goals of a page, or if users are clicking/tapping on unexpected places or non-interactive elements (dead clicks, rage clicks, etc).
Scroll map: This is a map of scroll depth based on the total distance between the top of the page and the lowest point that a user scrolled to. They illustrate how far a user scrolls down a page and are used to analyze what content is being viewed or missed. They typically show a percentage of total users over page depth and can also include an approximate location of the page fold. Aggregate data can be highly variable, as the total height of a page is dependent on the size of the user’s window/viewport.
Move map: This is a map used to see where users are focusing their attention and time, beyond click/tap engagement. They’re helpful for determining the value of non-interactive elements, and serve as an inexpensive and quick alternative to eye tracking studies. Typically move map data is not collected from touchscreen devices because touch/swipe/tap behavior is intermittent and not always tied to eye focus, unlike mouse/cursor behavior on desktops.

Additional Resources

Did you find this article helpful?

Get more delivered to your inbox just like it!

Search