Heatmap — Where people click and scroll

A visual map showing where visitors click, move and scroll on a web page.

What it means

A heatmap is a colour-coded picture of a web page that shows where visitors click, move their mouse and how far they scroll. Warm colours like red and orange show areas with lots of activity, while cool colours like blue show areas people mostly ignore.

How it works

You add a small tracking code to your website, either directly or through Google Tag Manager. The tool then builds different maps:

Click maps show where people tap or click, including things that are not actually links.
Scroll maps show what share of visitors reach each part of the page.
Move maps show where the mouse hovers on desktop.

Most heatmap tools also offer session recordings, which are video-like replays of individual visits. Microsoft Clarity is free, and Hotjar has a free plan with paid upgrades. Good tools let you mask personal data such as names, phone numbers and card details so they are never recorded. Mention these tools in your privacy policy too.

A simple example

A Surat saree shop sells online. Its product page has a "Buy on WhatsApp" button near the bottom. The scroll map shows most mobile visitors leave before reaching it. The click map shows many people tapping photos, expecting them to zoom. The shop moves the button higher and adds a zoom feature. The following month, more visitors start chats.

Why it matters

GA4 tells you what happened, such as how many people left a page. Heatmaps help explain why. They reveal confusing layouts, hidden CTAs and content nobody sees, so you can improve landing pages without guessing.

Beginner tips

Look at mobile and desktop heatmaps separately, as behaviour can differ a lot.
Wait for a reasonable number of visits before drawing conclusions from a map.
Use findings to create ideas, then confirm them with an A/B test.
Common mistake: forgetting to mask form fields, which can record private customer details.