What is Heatmap?

A heatmap is a visual representation of data where colors indicate the intensity of user interactions — clicks, scrolls, or cursor movement — on a web page.

Heatmap explained

Heatmaps aggregate behavior from many visitors into a single visual overlay on your page. Warm colors (red, orange) show areas with high activity, while cool colors (blue, green) show low activity. There are three common types: click heatmaps show where people click, scroll heatmaps show how far down the page visitors scroll, and move heatmaps track cursor movement.

Heatmaps are useful for answering questions like: are visitors seeing the CTA button? How far do they scroll on the pricing page? Are people clicking on elements that aren't actually links? They're a quick way to validate layout decisions without watching individual session replays.

The main limitation of heatmaps is that they show what happened but not why. A cold area might mean the content is bad, or it might mean visitors already found what they needed higher up. Heatmaps work best when combined with other analytics data to build the full picture.

Examples

  • A click heatmap showing that 60% of clicks on a landing page go to a non-clickable image, suggesting it should be made into a link.
  • A scroll heatmap revealing that only 20% of visitors reach the pricing section at the bottom of a long page.
  • Comparing heatmaps of the same page before and after a redesign to see if the new layout directs attention better.

See heatmap in action

Trfyx tracks this and more — set up in minutes.

20-day free trial · No card requiredEU-hosted cloud