Conversion and UX

Heatmap

Also called click map, scroll map

A colour overlay showing where visitors click, move or stop scrolling on a page.

Quick facts: Heatmap

Category
Conversion and UX
Also called
click map, scroll map
Level
Beginner
Affects
Page layout decisions, content placement, form design
Where to see it
Microsoft Clarity, Hotjar, Crazy Egg
In this article4
  1. How a heatmap works
  2. Why heatmaps matter
  3. Common mistakes with heatmaps
  4. How to act on it

How a heatmap works

A small script records where visitors interact with a page and aggregates many visits into a single picture, with warm colours marking the busy areas and cool colours the quiet ones. There are several distinct types, and confusing them is the first mistake: a click map shows where people tapped or clicked, a move map shows where the cursor travelled, a scroll map shows how far down the page people reached before stopping, and an attention map weights areas by how long they stayed visible on screen.

All of them are summaries. A heatmap tells you what happened in aggregate; it cannot tell you why, and it flattens together visitors with completely different intentions unless you filter it first.

Why heatmaps matter

They answer questions analytics cannot. A report can say a page converts poorly. A scroll map can show that almost nobody reached the section carrying the offer, and a click map can show people tapping a heading that is not a link because it looks like one.

They are also the quickest way to settle an internal argument about layout, and they work on sites too small to test. A click map and a handful of recordings on one important page often produce a clearer list of things to fix than a month spent watching a dashboard.

Common mistakes with heatmaps

Reading a blended map is the big one. Mobile and desktop layouts are different pages in practice, and combining them produces a picture that describes neither. The same applies to mixing traffic sources, since branded visitors and cold ad clicks behave differently on identical pages.

The second mistake is concluding from too few sessions, where one enthusiastic visitor creates a warm spot that means nothing. The third is treating heat as approval: a bright cluster can mean interest, or it can mean confusion, because people click repeatedly on things that are not working. A map gathered across a redesign, or on a page whose layout changes with the visitor, is quietly comparing different pages under one image.

How to act on it

Choose pages where a decision is being made — the main service page, the pricing page, the checkout — rather than pointing the tool at the whole site. Segment by device before you look at anything, and let the map gather long enough that the pattern stops shifting.

Use it to generate questions, then answer them elsewhere. If the scroll map shows people stopping before the enquiry form, move the form or shorten what precedes it and watch whether the pattern changes. If clicks land on something that is not clickable, either make it a link or remove the styling that promised one. Pair the map with session recordings for the reason behind the behaviour, check what people actually see above the fold on their own phone, and feed what you learn into ordinary conversion rate optimisation work rather than redesigning on the strength of one colourful image.

Do and do not

Do

  • View mobile and desktop maps separately
  • Let a page collect until the pattern settles
  • Pair maps with recordings to learn why

Do not

  • Read heat as approval — clicks can mean confusion
  • Blend traffic sources into one picture
  • Judge a page from a handful of sessions

Questions people ask about this

How much traffic do I need for a useful heatmap?

Enough that no single visitor shapes the picture, which on a small site usually means letting a page collect for weeks rather than days. Watch whether the pattern stays stable as more sessions arrive. If it is still moving noticeably, keep collecting; if it has settled, more data will not change your conclusion.

Do heatmap scripts slow the site down?

They add a script, so they add some weight. Most established tools load without blocking the page and the effect is modest, but it is real, and stacking several tracking tools together is what causes noticeable damage. Install one, measure the page before and after, and remove the script from pages where nobody is using it.

Is a heatmap better than analytics?

They answer different questions. Analytics tells you how many people did something and where they came from. A heatmap shows how one page was used. Use analytics to decide which page has a problem worth investigating, then a heatmap and a few session recordings to work out what is going wrong on it.

Related terms

Found this useful?

Share it, or ask an AI to summarise it

Back to the glossary

Knowing the term is the easy part

Applying it to your own site and budget is the work. Book a call and I will tell you what actually applies to you.