Create Heatmaps
Last updated
Was this helpful?
Last updated
Was this helpful?
Heatmaps are essential for understanding the performance of your page. Browsee currently covers three kinds of heatmaps that are Click, Scroll, and Attention. The details can be found here. Let us see how you can add a URL or URL pattern for creating a heatmap in Browsee.
Go to 'Heatmaps' from the side panel
Click on the 'Add New Heatmap' button
You will see two options on the screen - Click on the '+ Add Single URL' button
This will give you an option to add a name for the heatmap and a URL Path
Heatmap Title - Can be any identifiable text like "Dashboard heatmap" which helps you and others to identify the heatmap URL easily.
URL Path - In this input field, you need to add the path of the URL i.e. part after the domain. For example:
Path for 'https://browsee.io/#/dashboard" is /#/dashboard
Path for "https://browsee.io/dashboard" is /dashboard
Snapshot or Always On - You can choose between snapshot-based heatmaps or always on heatmaps.
Snapshot Heatmaps - You can choose the number of page views with which you wish to create a Heatmap. This makes more sense if you have a high traffic website and you need a quick heatmap for your page. This way, you will permanently retain your heatmap.
Always on Heatmaps - This makes more sense if you have medium traffic and the frequency of page change is quite high. With always-on heatmaps, you can compare your two heatmaps on two different time ranges.
Once you have added the name and the URL path, just click the save button. Once you save the heatmap, we will start mapping click, scroll, and attention data for all your users against your page.
This page also shows you your top URLs which can easily be added to the heatmap URL directly
This is particularly useful for a set of pages that are similar in patterns like Blog pages or Product pages etc. If you want to analyze how your blogs are studied or how people are interacting with your product pages, you need to cluster them by using our multiple URLs/pattern options.
Go to 'Page Story' from the side panel
Click on the 'Add New Heatmap' button
You will see two options on the screen - Click on the '+ Add Multiple URLs/Pattern' button
Browsee's Multi Page Heatmaps work on the path of the page URLs and does not use URL parameters to distinguish pages.
E.g.; /product/xyz will be considered the same page as /product/xyz?utm_source=a&bc=1.
This will give you an option to add a name for the heatmap and a URL pattern.
Heatmap name - Can be any identifiable text like "Product Pages heatmap" which helps you and others to identify the heatmap URLs easily.
URL Pattern - You will see that there are following options. We will go through each of them -
Contains - You need to give a string that is common in all your URL paths. For example, let's say you have URLs like "https://browsee.io/show/the-game-of-thrones-hbo/1", "https://browsee.io/shows/the-last-of-us-hbo/2", and so on. You could target both of these URLs using a contains "hbo" in URL pattern field.
Starts With - You can use this option if you see that all URL paths you need to add have a common starting text. For example, let's say you have URLs like "https://browsee.io/product/123", "https://browsee.io/product/245", and so on. You just need to write "product" in the URL pattern field.
Ends With - You can use this option if you see that all URL paths you need to add have a common ending text. For example, let's say you have URLs like "https://browsee.io/xyz-2023/?", "https://browsee.io/abc-2023/" and so on. You just need to write "2023" in the URL pattern field.
Regular Expression - This is the most powerful way of adding a URL pattern. Every URL that matches with the given regular expression will be considered a part of the heatmap. The regular expression here follow the pattern of Javascript Regular Expressions (without the enclosing /). Examples:
To match all product URLs which contain blue as a substring, you could use /product/.*blue.*
To match all product URLs which do not contain blue as a substring, you could use /product/((?!badword).)*
To match URLs which start with /product and contains blue, ^(/product/).*blue.*
You can try your regex here to see if they would match the pattern.
Snapshot or Always On - You can choose between snapshot-based heatmaps or always on heatmaps.
Snapshot Heatmaps - You can choose the number of page views with which you wish to create a Heatmap. This makes more sense if you have a high traffic website and you need a quick heatmap for your page. This way, you will permanently retain your heatmap.
Always on Heatmaps - This makes more sense if you have medium traffic and the frequency of page change is quite high. With always-on heatmaps, you can compare your two heatmaps on two different time ranges.
You can choose the number of page views with which you wish to create a Heatmap. This makes more sense if you have a high traffic website and you need a quick heatmap for your page. This way, you will permanently retain your heatmap.
This makes more sense if you have medium traffic and the frequency of page change is quite high. With always-on heatmaps, you can compare your two heatmaps on two different time ranges.
Once you will enter a URL or a URL pattern, we will run a background query to tell you in near-realtime whether your search pattern exists in our databases or not. You will quickly see a number of sessions if the URL/URL pattern exists in our DB or 0 sessions if it does not as shown below.
If you are not able to find any session for your URL/URL Pattern, it could mean:
We do not have enough data around this URL
We do not recognize this URL/URL pattern which means you need to check the query again
It's not you but we? No worries! Mail us at contact@heroteck.com and we will resolve it asap.
In case you want to convert a continuous heatmap to a snapshot and save that, you can go to the heatmap's manu and click on Snapshot Heatmap. This will stop collecting new data for the heatmap and preserve the current image and data as a snapshot that you can explore. Heatmap snapshots do not count in your quota of heatmaps for your plan.
You can also download the complete heatmap data from the top right button. once you will click the button, the snapshots along with the data will be emailed to you on your registered ID.
