Heatmaps 101 – Scroll Heatmaps
Scroll heatmaps give you an idea about how much of your page is visible to visitors.
Each section provides statistics about visibility and time spent – either viewing or interacting with different parts of the page.
A great example of an insight from the Scroll Heatmap is when key page content is located in a low-visibility area.
Let’s face it: you don’t know how visitors will browse. But, a scroll heatmap shows you, in aggregate, whether people are able to see/interact with content as you expect.
For example, a call to action button is almost always best suited in the top fold of your page. But, not all layouts look this way.
A typical checkout screen will have a “Submit” or “Pay Now” button in the lower-right corner. This, unfortunately, results in cart abandonment as users don’t see how to proceed and leave the site in frustration.
Another common problem is that websites will have a large footer (at the bottom of each page) with links that go unseen for most visitors.
If these links are important (like pricing/contact), they may be more effective in the menu bar or on a side panel which receives more attention.
We recommend you look at your scroll heatmaps and see if they make sense.
Here are some questions to ask:
- Is key content (that supports the goal of each page) visible above-the-fold?
- Is there sufficient time spent either viewing or interacting with parts of each page that are important? If, for example, you have a form and there is no red around it, consider relocating it.