A heatmap is a visual summary of how visitors behave on a page, using color to show where many sessions overlap: where people clicked, how far they scrolled, where their cursor lingered. Warm colors mark heavy activity, cool colors mark little. It turns thousands of individual sessions into one picture you can read in a few seconds.
Heatmaps are genuinely useful and routinely over-trusted. They are very good at showing you what happened on a page and completely silent on why. Treated as a source of hypotheses they are one of the best diagnostic tools available. Treated as evidence for a decision, they lead teams to redesign things that were never the problem.
The types, and what each is actually good for
Click maps show where people click or tap. Their most valuable output is usually the clicks on things that are not links: a heading people expect to expand, an image they think is a gallery, a price they expect to open a detail view. Those misdirected clicks are unmet expectations, and they are the clearest signal a heatmap produces.
Scroll maps show how far down the page people get, usually with a line marking where half the visitors have left. This tells you whether the content you care about is ever seen. A brilliant argument at 80 percent depth on a page most people abandon at 35 percent is not underperforming, it is unread.
Move or hover maps show cursor movement. These are the ones to treat most sceptically, for reasons below.
Attention or engagement maps combine time and viewport position to estimate which parts of the page were actually on screen and for how long. Usually more informative than move maps.
Rage clicks and dead clicks, offered by several tools, flag repeated rapid clicking or clicks that do nothing. These point straight at broken or misleading interface elements, and they are the fastest route from a heatmap to a fixable bug.
The mouse is not the eye
The most persistent misconception about heatmaps is that cursor position reveals where people are looking. Early research suggested a relationship, but it is far weaker and more variable than the marketing around these tools implies. Plenty of people read without moving the mouse at all, park the cursor off to one side, or use a trackpad, a touchscreen, or a keyboard. On mobile, where much of your traffic is, there is no cursor to track.
Move maps are a rough proxy for attention at best. If you want to know what people looked at, a move map will not tell you, and no amount of color intensity changes that. Click maps and scroll maps measure actual behavior and deserve much more of your confidence.
Where heatmaps mislead
Too little data. A heatmap built on 40 sessions is a picture of 40 people, several of whom were probably you. Wait for a meaningful sample before drawing conclusions.
Mixed screen sizes. A page laid out in three columns on desktop and stacked on mobile produces a meaningless composite if the tool blends them. Always segment desktop and mobile, which also makes responsive design problems visible.
Dynamic and personalized content. If a section changes between visitors, or content loads on interaction, the overlay may not correspond to what anyone actually saw.
Averaging different intents. Visitors arriving from a branded search, a cold ad, and an email all behave differently. Aggregated together they produce a muddle. Segment by source.
Confirmation bias. Heatmaps are visually persuasive, which makes it easy to find the pattern you went looking for. Decide what would change your mind before you open the tool.
Popularity is not value. The most-clicked element is often the navigation, which tells you people are leaving.
Pairing them with session recordings
Heatmaps tell you something is happening in aggregate; recordings show you one person doing it. The productive workflow runs in that order. Spot an anomaly in the heatmap, then watch ten recordings of sessions that hit it. Ten recordings usually explain a pattern that a month of aggregate data only describes.
The same applies to metrics. A high bounce rate on a landing page plus a scroll map showing most visitors never reach the form is a much more actionable pair than either alone.
The tools
Microsoft Clarity is free, includes heatmaps and recordings, and has no traffic ceiling, which makes it the obvious starting point for most small and mid-sized sites.
Hotjar is the best-known option and adds surveys and feedback widgets, which pair well with behavioral data because they capture intent.
PostHog, FullStory and similar product-analytics platforms go further into funnels and event tracking, at more cost and setup.
For a typical business site, the free option answers the questions you actually have. Paying for more data collection rarely helps a team that is not yet acting on the data it has.
Two things to weigh before installing one
Privacy. These tools record what visitors do, and recordings can capture what people type. Mask form fields by default, exclude anything handling personal, health, or payment information, check that your privacy policy describes the tracking, and make sure your consent mechanism actually gates it where that applies to you. This is not optional housekeeping; it is the part most implementations get wrong.
Performance. Behavior-tracking scripts are third-party JavaScript, and they are not free. They add weight, execution time, and another connection, which works against Core Web Vitals and page speed. That is a reasonable trade while you are actively investigating something. Leaving a recorder running permanently on a site nobody is analyzing is a pure cost, and worth removing.
Turning a heatmap into a change
1. Start with a question. “Why do so few people on this service page reach the form?” beats installing a tool and browsing.
2. Collect enough data, segmented by device and source.
3. Look for the specific signals: clicks on non-interactive elements, scroll depth falling off before key content, rage clicks, CTAs nobody touches.
4. Watch recordings of the sessions that show the pattern.
5. Write a hypothesis. “Visitors are clicking the pricing heading expecting it to expand, so the detail is not being found.”
6. Change one thing and measure it. The heatmap suggested the change; only a test or a clear before-and-after in conversions confirms it worked.
That last step is where most heatmap work stops short. The picture is interesting, someone redesigns a section on the strength of it, and nobody measures whether anything improved.
Where this fits
Heatmaps and session recordings are standard diagnostics in our conversion rate optimization services, used to generate hypotheses that then get tested rather than as evidence in themselves. If visitors are arriving on your key pages and not converting, and you are not sure where they are getting stuck, book a discovery call.
