You can create a heatmap for any page on your website. There are broadly five key types, and a good tool will deliver them all. They are, in general order of popularity:
Mouse Click Activity
These heatmaps show you where users click most often (or, on a mobile device, where they’re tapping). They can highlight not only the most popular links on your page, but also unclickable areas that users are trying to click on! This information is really helpful when testing your menus, promotional banners and calls to action (CTAs).
A page-scrolling heatmap shows you exactly how far down the page your users are willing to go. A big conundrum in web design centers around how much content you should show users before they have to start scrolling. For example, a big banner image may look great at the top of the page, but if it’s so big that there’s no other information, or reason to engage, until the user starts scrolling, might the user just navigate away?
This kind of heatmap can give you a greater insight into how a user interacts with your page. It can offer helpful information about the ideal placement of content and calls to action within the overall design. You can see what users look at, what grabs their attention, and where something causes them to stumble.
Understanding attention is an important way to assess the effectiveness of your page design. This type of heatmap combines information about how far users scroll and how long they spend on your page. By taking account of different screen sizes and resolutions, this heatmap will show which parts of the page have been viewed the most, helping you to understand whether your most important messages are getting seen.
Just as broadsheet newspaper editors would always put their top stories ‘above the fold’, you need to know what to put above or below the ‘fold’ on a webpage. This kind of heatmap lets you see whether customers are seeing important information, and enables you to structure your page accordingly. It’s particularly useful for comparing how user behavior varies between devices, and comparing, for example, the difference between scrolling on a mobile device and scrolling on a desktop.
Zonal heatmaps breakdown different content areas within an individual web page so so that you can visually understand the performance of each area based on key metrics such as clicks and conversion.