Best Heatmap Tools for Websites: How to Choose and Read Them

The best heatmap tools for websites give you click and scroll maps drawn over the page as visitors saw it, with segmentation and long enough retention to compare periods. Free options like Microsoft Clarity cover the basics; paid suites add survey tools, longer history and company context. The tool matters less than reading the maps correctly.

What heatmaps show

A heatmap aggregates behaviour across many visits and draws it on a screenshot or DOM snapshot of the page.

Map type	Shows	Good for	Misread as
Click map	Where people click or tap	Finding ignored CTAs, clicks on non-links	Proof the area is valuable
Scroll map	How far people scroll	Placing key content above the drop-off	Proof they read it
Move map	Pointer movement	Rough attention signal on desktop	Eye tracking

The BusinessMCP replay page describes click and scroll heatmaps drawn over a DOM snapshot of the page as the visitor saw it, with period comparison and a top-clicked-elements table. Its “precise mode” maps each click to its element. Those are the capabilities worth asking any vendor about.

Key takeaway: a heatmap tells you where, not why. Pair it with recordings and with a hypothesis you can test.

Features that separate tools

1. Snapshot quality. Pages with pop-ups, personalised content or single-page navigation can render wrongly. Check how each tool captures them.
2. Segmentation. Device type matters a lot: mobile and desktop maps differ.
3. Period comparison. Before and after a redesign is the main use case.
4. Element-level data. A ranked list of clicked elements is easier to act on than a colour blob.
5. Retention. Raw heatmap events expire on BusinessMCP after 30 days on every plan; Clarity keeps heatmap click data for 9 months, per the comparison page. Check yours; see data retention.
6. Link to recordings. Clicking on a hot spot to see sessions saves hours.
7. Performance. The tracker should not block rendering.

Tool snapshot

Tool	Heatmaps?	Price stated	Notes
Microsoft Clarity	Yes	Free	9-month heatmap click data; cookies
Hotjar (Contentsquare)	Yes	Free tier; Growth from $49/month annual	See pricing
BusinessMCP	Yes, on Growth and up	From $79/month	Starter at $19 has no recordings or heatmaps, and the free plan has no recordings, per the replay page
Mouseflow, Lucky Orange	Per vendors	From $25 and $32/month	Check each site

BusinessMCP’s session replay page lists heatmaps as part of the Growth plan and above. The vendor also describes its Hotjar alternative comparison in more detail; use it as a vendor-authored reference.

How to read a heatmap well

1. Start with a question. “Do people see the pricing table?” is testable. “What does the map say?” is not.
2. Segment first. Look at mobile and desktop separately, and new versus returning if possible.
3. Look for clicks on non-clickable things. Dead clicks suggest elements that look interactive but are not. See what rage clicks are.
4. Check scroll depth against content order. If 70% never reach the offer, move it or shorten the page above it.
5. Compare periods. Change one thing, then compare the maps before and after.
6. Confirm with recordings. Open five sessions at a hot spot to see what visitors were doing.

Common mistakes

• Reading too little traffic. A map built from a few dozen visits is noisy.
• Ignoring layout shifts. If the page changed during the period, the map may be misleading.
• Treating colour as value. A hot button might be hot because it is confusing.
• Optimising the map instead of the goal. Link everything back to conversion or task completion.

Turning findings into changes

Write a one-line hypothesis, change one thing and measure. Some tools connect that loop: BusinessMCP’s Scale plan, at $199 a month, can propose a split test from detected friction and the AI can open a GitHub pull request for the variant, according to its page, and a winner is not declared before minimum sample size and 14 days. Whether or not you use that, read turning session replays into A/B tests for the method.

Verdict

Start with a free tool, answer one specific question per page, and keep heatmap findings tied to a test. If you want the broader picture, see our list of session replay tools; most of them include heatmaps in the same product.

A worked example of a heatmap review

Imagine a pricing page where the click map shows a cluster of clicks on a plan comparison table header, and almost none on the “Start trial” button below it. Several readings are possible. Visitors may believe the headers are sortable or expandable. The button may sit below the point where the scroll map shows most people stop. Or the table may answer their question so well that they have no reason to click anything.

You would test each reading in turn. First, check the scroll map: if fewer than half of visitors reach the button, move it up or add a second one next to the table. Second, open ten recordings and watch what people do at the table. If they click headers and nothing happens, you have found a dead click and a false affordance, and you can fix it with a small interaction change. Third, compare the two periods either side of the change, using the same device segment.

The BusinessMCP team documents the web analytics product that sits next to its heatmaps; the point for any tool is that a heatmap is most useful when it is a step in a workflow that ends with a measured change, not a report you look at once and file.

Checklist before you trust a map

1. The page did not change during the date range.
2. The device segment is separated.
3. The sample is large enough that the pattern holds when you split the period in half.
4. You have watched at least a handful of recordings that match the pattern.
5. You can state what you would change if the pattern is real.

If you cannot answer the fifth point, the map is trivia, however colourful.