Glossary · Web Design

Heatmap

HEET-mapnoun

A heatmap is a color-coded visualization of where users click, move, and scroll on a web page.

Part of speech
noun
Pronunciation
HEET-map
Origin
The term dates to color-coded data displays used for matrix visualizations in the 1990s. In web analytics it shows where users click, move, and scroll.

What is Heatmap?

A heatmap is a color-coded visualization of where users click, move, and scroll on a web page. It overlays a page with colors that represent intensity, typically warm hues like red and orange for areas of high activity and cooler blues and greens for areas that receive little attention. Instead of reading rows of numbers, a person can glance at a heatmap and immediately see which parts of a page draw the eye and the cursor, and which parts go ignored. It turns aggregated behavior from many visitors into a single, intuitive picture.

Several kinds of heatmaps capture different behaviors. Click maps show where people click or tap, revealing which buttons and links attract action and, tellingly, which non-clickable elements people mistakenly try to click. Move maps track cursor movement, which loosely correlates with where people look on desktop screens. Scroll maps show how far down the page visitors travel, exposing the point where most people stop reading, sometimes called the average fold. The data is gathered by a small script on the page that records interactions anonymously, then aggregated across many sessions so patterns emerge that no single visit could reveal. The color overlay is simply a way of rendering that density of activity so it can be read at a glance.

The term dates to color-coded data displays used for matrix visualizations, which grew common in the 1990s as a way to represent magnitude with color across a grid of values. Analysts in fields from finance to biology used the technique to spot patterns quickly. Web analytics borrowed the idea and applied it to the page itself, mapping the intensity of user behavior onto the layout so that clicks, movement, and scrolling could be seen spatially rather than counted in a table.

For a business, heatmaps matter because they show what people actually do rather than what a team assumes they do. They can reveal that a prominent call to action sits below where most visitors scroll, that a key link is being overlooked, or that people are clicking an image expecting it to be interactive. These insights guide practical changes that lift conversion rates, such as moving an important button higher, clarifying what is clickable, or removing distractions. Because heatmaps are visual and easy to understand, they also help persuade stakeholders, turning abstract analytics into evidence anyone can see.

The common mistakes usually involve reading too much into limited data. A heatmap built from too few visitors can mislead, showing noise as if it were a pattern, so a reasonable sample matters. Treating cursor movement as a precise proxy for eye gaze overstates what move maps can prove, since the relationship is loose. Looking at a heatmap without a question in mind tends to produce vague impressions rather than decisions, so it helps to pair the visualization with a hypothesis. Heatmaps complement other tools that describe the broader user experience and user flow, and they are most powerful when used to generate specific ideas that are then confirmed through testing on real visitors and landing pages.

Why it matters

Heatmaps reveal how visitors actually use a page, exposing ignored calls to action and drop-off points. They replace guesswork with evidence for design decisions.