{"id":338,"date":"2019-05-16T09:13:45","date_gmt":"2019-05-16T09:13:45","guid":{"rendered":"https:\/\/capturly.com\/documentation\/?p=338"},"modified":"2023-09-20T12:17:18","modified_gmt":"2023-09-20T12:17:18","slug":"heatmaps","status":"publish","type":"post","link":"https:\/\/capturly.com\/documentation\/heatmaps\/","title":{"rendered":"Heatmaps"},"content":{"rendered":"
\n
Learn how to create, filter and analyze segment, scroll, and click heatmaps in Capturly.<\/div><\/div>\n<\/div>\n

<\/span>What are heatmaps?<\/span><\/h2>\n

Heatmaps are the aggregated views of your visitor’s interactions and behavior on your website. Exploring how visitors interact with your website can give you valuable information to prevent problems, that may occur in the future. Capturly draws a heatmap of your website to help you make important decisions based on real user interactions. You will have an aggregated view of your website\u2019s qualitative data (e.g. where your visitors click, how far they scroll within a given timeframe).<\/span><\/p>\n

<\/span>What kind of heatmaps does Capturly have?<\/span><\/h2>\n

Capturly has three different kinds of heat maps. You can gain access to your heatmaps after Capturly’s tracking code is installed<\/a> on your website.<\/p>\n

Click heatmap: <\/strong>it\u00a0tells you exactly which areas get the most clicks. See with your own eyes what should be clickable and what shouldn\u2019t according to your users.<\/span><\/p>\n

Scroll heatmap: <\/strong>it\u00a0<\/strong>shows you exactly how far your visitors are scrolling down on your page.<\/span><\/p>\n

Segment heatmaps:<\/strong>\u00a0Do you wish to know which traffic comes from a returning visitor? Segment heatmap offers you a way to filter and distinguish certain traffic sources from each other and tells you where your visitors clicked on your website from each source.<\/span><\/p>\n

<\/span>What is a Click heatmap?<\/span><\/h2>\n

Clicking is a very powerful indicator of interest. Capturly draws click heatmaps so you can decide which elements of your website draw the most attention.<\/span><\/p>\n

You can access click heatmaps after <\/span>logging in<\/b> to your Capturly account and clicking on the\u00a0 Heatmaps<\/strong> <\/span><\/span>\u00a0menu on the left.<\/span><\/p>\n

\"Example<\/p>\n

<\/span>What is a Scroll heatmap?<\/span><\/h2>\n

Scroll heatmaps cover your entire webpage showing you how far your visitors scroll down. Capturly reveals the most active parts of your website so you can decide where you should put your main call-to-action elements without unnecessary guesswork.<\/span><\/p>\n

You can access scroll heatmaps after <\/span>logging in<\/b> to your Capturly account and clicking on the  Heatmaps<\/strong> <\/span><\/span>\u00a0menu on the left.<\/span><\/p>\n

\"Example<\/p>\n

<\/span>What is a Segment heatmap?<\/span><\/h2>\n

Every segment in the segment heatmaps has a different color for easy distinction. You can pick different traffic sources (such as operating systems and browsers, devices or webpages) and inspect them in detail.<\/span><\/p>\n

In segment heatmaps, you can compare different segments to see if they are behaving differently.<\/span><\/p>\n

You can access segment heatmaps after <\/span>logging in<\/b> to your Capturly account and clicking on the  Heatmaps<\/strong> <\/span><\/span>\u00a0menu on the left.<\/span><\/p>\n

\"Example<\/p>\n

<\/span>How can I use heatmaps?<\/span><\/h2>\n

After i<\/a>nstalling a small piece of code<\/a> into your site, you will have access to Capturly\u2019s features including heatmaps. <\/span>Heatmaps are generated automatically from your past visitor data, right after the tracking code is installed on your website.<\/span><\/p>\n

After you have installed Capturly\u2019s tracking code to your website, all you have to do is to follow these steps:<\/span><\/p>\nSTEP 1<\/strong><\/span>Log in<\/a> to your Capturly account<\/span><\/p>\n

STEP 2<\/strong><\/span> Select the website you wish to check the heatmaps of<\/span><\/p>\n

STEP 3<\/strong><\/span>Select\u00a0 Heatmaps<\/strong> <\/span>\u00a0<\/span>from the left menu<\/span><\/p>\n

\"Heatmaps<\/p>\n

STEP 4<\/strong><\/span>\u00a0Select a page from the table and click on the corresponding\u00a0 Show<\/strong> <\/span><\/span>\u00a0button on the right<\/span><\/p>\n

Heads up:<\/strong> Select the desired timeframe simply by choosing it from the small calendar and click on the  Update<\/strong> <\/span> button.<\/div><\/div>\n

<\/span>How can I filter heatmaps?<\/span><\/h2>\n

In the top right corner of the heatmaps page, you can find a\u00a0 Filters<\/strong> <\/span>\u00a0button, which opens the Filters panel. This panel, just like the date selector, can be opened and used on the main heatmap URL list page and on an individual heatmap as well.<\/span><\/p>\n

\"Filtering<\/p>\n

On your Filters panel, you can filter your heatmaps by:<\/span><\/p>\n