Heatmap Tools: What They Show and How to Read Them
A heatmap shows you where people clicked, scrolled and paused. It never tells you why — that takes a different kind of tool.
What is a heatmap tool?
A heatmap tool records how visitors behave on a page, then overlays that behaviour on a colour scale — red or orange where activity is dense, blue or green where it thins out.
It's one part of a wider toolkit. If you're new to conversion rate optimization (CRO) as a discipline, start with Conversion Rate Optimization: The Complete Guide — this page zooms in on one piece of it: reading visitor behaviour on a single page.
The important word is aggregated. A heatmap is not one visitor's journey. It's hundreds or thousands of visits layered on top of each other so a pattern emerges. That's its strength — and, as you'll see below, also where it can mislead you if you're not careful.
The three types of heatmap (they are not the same data)
"Heatmap" gets used as one word, but it's really three different measurements stitched into one visual. Confusing them is the single most common reading mistake.
- Click heatmap: records every click (or tap, on mobile) and plots density. It shows what people tried to interact with — including things that aren't clickable, which is itself useful data.
- Scroll heatmap: records how far down the page each visitor scrolled, then shows what percentage of visitors reached each depth. It tells you where attention drops off vertically.
- Move/attention heatmap: tracks cursor movement (desktop) as a rough proxy for eye movement — people often move the mouse near what they're reading, though this is a weaker signal than the other two and shouldn't be read on its own.
| Heatmap type | What it shows | What it's good for |
|---|---|---|
| Click heatmap | Where visitors clicked or tapped, and how often | Finding dead clicks on non-clickable elements; checking if your real CTA gets noticed over decoys |
| Scroll heatmap | What % of visitors reached each depth of the page | Deciding where to put your most important content and CTA before people drop off |
| Move/attention heatmap | Cursor movement patterns, as a rough attention proxy | Spotting which sections visually pull the eye — treat as directional, not conclusive |
How to read a heatmap without over-interpreting it
A hot spot tells you people did something there. It does not tell you whether that was a good thing.
This is the honest caveat most heatmap guides skip, and it's the one that actually protects your conversion rate. Three ways a heatmap misleads you if you read it too fast:
- A hot spot can mean confusion, not engagement. A cluster of clicks on a product image that isn't a link usually means visitors expected it to be clickable and got nothing. That's frustration, sometimes called "rage clicking" when it repeats in a burst — not a sign the image is working.
- Low sample size produces noise, not patterns. A heatmap built from 40 sessions can look just as confident and colourful as one built from 4,000 — the visual doesn't warn you. Most tools recommend at least a few hundred visits to a page before treating the pattern as reliable, and pages with real traffic swings (a campaign spike, a weekend lull) need even more before you trust it.
- An unsegmented heatmap blends two different audiences into one misleading average. Mobile and desktop visitors scroll and click completely differently on the same page. If your tool defaults to showing both combined, you're often looking at a pattern that describes neither device accurately. Always segment by device before you act on what you see.
The safe habit: treat every heatmap as a hypothesis generator, not a verdict. "This looks like a problem" is the right takeaway. "This proves X" rarely is — that's what testing is for. See A/B Testing: The Complete Guide for how to turn a heatmap observation into a properly validated change.
Heatmap vs session recording — different questions, different tools
A heatmap and a session recording are often bundled in the same software, which is exactly why they get confused. They are not the same thing.
A heatmap is an aggregate pattern across many visits — it answers "where, in general, do people click and scroll on this page?" A session recording is a replay of one real visitor's actual journey — mouse movement, clicks, scrolling, form fields, hesitation, all in sequence, for that one person. It answers "what actually happened, in order, for this specific visit?"
That difference decides which one to reach for. A heatmap tells you where a problem cluster sits on a page. A session recording is closer to why — you can watch someone hover over your pricing table, scroll back up, then leave, and start to piece together the hesitation. Neither hands you a certain answer; a recording is still one anecdote until you've watched enough of them to see a repeated pattern. If you need to diagnose a specific point where visitors abandon a multi-step process rather than a single page, that's better handled with funnel data — see Conversion Funnel: Diagnosing Where Visitors Drop Off, which shows you the step-by-step drop, not just the page-level pattern.
Two verified, real examples of tools that offer both in one product: Microsoft Clarity is genuinely free — no paid tier, no session cap that forces an upgrade — and includes click heatmaps, scroll heatmaps and session recordings. Hotjar is the other name you'll hear constantly; as of 2026 its heatmap and recording features operate under its parent company Contentsquare's "Experience Analytics" product, which still offers a free plan, with paid tiers that scale as your traffic grows. If you want a fuller side-by-side of these and other CRO tools — including form analytics, survey tools and testing platforms — that's covered in Best CRO Tools Compared, the full tool roundup. This page stays focused on reading the data, not shopping for software.
When to reach for a heatmap vs something else
Match the tool to the question you're actually asking — not the tool you already have open.
- "Is anyone noticing my CTA?" → Click heatmap. Fast, aggregate, exactly what it's built for.
- "Where does my long page lose people?" → Scroll heatmap, to place your key content and CTA above the drop-off line.
- "Why did this specific visitor leave without converting?" → Session recording. Watch several, not one, before drawing a conclusion.
- "Where in my checkout or signup flow do people actually abandon?" → Funnel analysis, not a heatmap — a heatmap describes one page, not a multi-step sequence.
- "I have a hunch a change will help — will it actually lift conversions?" → An A/B test. A heatmap can suggest what to test; only a test can tell you if it worked.
In practice, most CRO work at Digital Hangover starts with a heatmap and a handful of session recordings to build a hypothesis, then validates that hypothesis with a test before it ships permanently. If you'd rather have that run for you end-to-end, our conversion rate optimisation service covers the full loop — reading the behavioural data, prioritising what to fix, and testing the fix properly.
Frequently asked questions
Can a heatmap tell me why people leave my page?
No. A heatmap shows you where people clicked, scrolled and hovered — it doesn't capture intent, frustration or the reason behind a click. To understand why, pair it with session recordings (to watch the actual journey), on-site surveys, or direct user research. A heatmap is where you start looking, not where you find the answer.
How much traffic do I need before a heatmap is useful?
There's no single official threshold, and it depends on how consistent your traffic is, but most practitioners wait for at least a few hundred visits to a specific page before trusting its heatmap pattern. Below that, you're often looking at noise from a handful of unusual sessions dressed up as a confident-looking colour map. Low-traffic pages need longer collection windows, not fewer visits ignored.
What's the difference between a heatmap and Google Analytics?
Google Analytics (GA4) reports numbers — sessions, bounce rate, conversions, traffic sources — aggregated as statistics, with no visual sense of the page itself. A heatmap shows behaviour spatially, on the actual page layout. They answer different questions: GA4 tells you a page has a high exit rate; a heatmap and a session recording help you see what on that page might be causing it.
Is Microsoft Clarity really free, or is there a hidden paid tier?
As verified on Microsoft's own pricing page in August 2026, Clarity is free with no paid tier — you get heatmaps, session recordings and its analytics dashboard at no cost, on unlimited traffic. It's a genuinely useful starting point precisely because there's no budget conversation needed before you install it.
Reading heatmaps is step one. Fixing what they reveal is the work.
We run heatmap and session-recording analysis as part of a structured CRO process — hypothesis, test, prove it, then scale it.