Heatmap FAQs

Screenshots are taken from the last recording found in the date range you've selected for your heatmap. You can refresh this screenshot or choose to load your site and manually take a new screenshot of the relevant page. For help with this, see our How to Update a Heatmap Screenshot article.

If you notice that your Recording/Heatmap doesn't show any user scrolling, or shows an unusual scroll cut-off, this may be the result of a known issue with Javascript and a specific CSS property.

JavaScript has a limitation where it is unable to detect scrolling when both the HTML and body elements of a page have overflow-x: hidden set in the CSS. This limitation is not Hotjar-specific, so it's not something that Hotjar Support can resolve. For more information about this limitation, see this relevant Stackoverflow post. 

Solution: Removing overflow-x: hidden from either the body or HTML in your CSS should resolve this issue.

Heatmaps are based on sessions, which means you need to have captured Recordings on pages that you want to view a Heatmap.

Here are some things you can check if you do not see a Heatmap:

• If using Single page with "Exact Match", make sure you enter the URL exactly as it appears in the browser, which may include a trailing backslash, or protocol (HTTPS or HTTP).
• If you’re not seeing any results on desktop, check the tablet and mobile tab.
• If no data is being returned for your Heatmap, check to see if you have any Recordings for the URL you want to view. If you have no Recordings, this means that there is no Heatmap data for this URL.

For Heatmap data retention periods, see our article on How long does Hotjar keep my data?

Since Heatmaps are session-based, the "Showing x sessions" count will include all tracked sessions where the user visited the Heatmap target page, even if that user did not interact with elements on the page itself. (ie. if they landed on the page, but left without scrolling or clicking on anything)

This means that a Heatmap may display "Showing 1000 sessions", even if only 800 sessions contributed click/move/scroll data to the page you're viewing in your Heatmap screenshot.

Heatmaps are only able to record a tap or scroll action on mobile devices. Other touch-screen related actions not identified. Below are the actions that will trigger a tap or scroll:

Tap

• Tapping and releasing without scrolling

Scroll

• Swiping vertically to scroll down the page
• Pressing and dragging to vertically scroll down the page
• Pinch to zoom or expand (this changes the page height)

Not Tracked

• Swiping horizontally (example: through a carousel or image gallery)

If you encounter a large percentage of your Heatmap's total clicks happening in one random area of the page, this could be due to bot traffic or automated sessions.

While Hotjar has measures in place to prevent bot traffic from being picked up in your Heatmaps, they do sometimes slip through. Automated sessions are more difficult to prevent because they often look like a legitimate user. Automated sessions are usually caused by monitoring tools. These tools are designed to "visit" your pages throughout the day, to ensure they are still online and responsive.

Solution: If you suspect this might be the cause of the behavior, check with your IT or network team, to see if any monitoring services are running on your site. Examples of these services are Amazon CloudWatch Synthetics and Dynatrace Synthetic Monitoring.

If these services use specific IP ranges, you can block their IPs from your collected data.

How to download a heatmap as an image

While viewing your heatmap, click on the download icon and select Download JPG. This will download a JPG image file of your heatmap.

How to download heatmap data as a CSV file

While viewing your heatmap, click on the download icon and select Download CSV. This will enable you to export a CSV file of your heatmap's data that includes: the Element CSS selector, Total # of clicks, Visible in image, and percentage of total.

If you delete a Recording, then any associated Heatmap data will be deleted.

Heatmaps are based on sessions (Recordings). During a single session, a user may have visited multiple pages across the site. For example, you may see a Recording where the user visited one page, five pages or ten pages during the same session.

If a user visited five pages during a session and the Recording for those visits is deleted, then the Heatmap data associated with those page visits will also be deleted.

The Custom Date Range feature allows you to view Heatmap data for a date range that you specify. This is useful if you want to compare Heatmap data before and after a design change, a product update, or a marketing campaign.

Hotjar will show you a cached screenshot from within the date range you select. If there isn't a cached screenshot from that date range, Hotjar will generate one from the latest date that has an available Recording.

You can also manually update your screenshot.

The point a user reaches, by scrolling on a page, is recorded as a Percentage using this formula:

[total number of users]/[maximum depth scrolled to on your page]

This means it's not an exact distance in pixels or otherwise, but an average of depth. On a shorter page, users will hit a higher percentage with less actual scrolling, and potentially a lower average in longer pages. If a user clicks a link that takes them to a lower point on the page, they are still included in the scroll data because this will be based on the furthest point reached by the user.

When Hotjar generates the Scroll Heatmap and processes all the maximum depths scrolled, we end up with an average that will be applied to the Heatmap. The Heatmap should be a good proportional representation, even in pages of varying lengths. 

Because Heatmaps look at both the starting URL and any applied session filters, you can use the same starting URL and add a "Visited Page" session filter.

For example, if you had several variations for https://www.example.com/blog/, you could create multiple Heatmaps by using the URL filter "URL is" and these session filters:

• "Viewed page" contains https://www.example.com/blog/
• "Viewed page" contains www.example.com/blog/
• "Viewed page" contains example.com/blog/

This has the advantage of keeping things clearer at a glance so you can save different versions of the Heatmap for the same page.

From there, you can manually update the Heatmap screenshot.

If you see the mobile version of your page when viewing a desktop heatmap, it may be because our screenshot browser captures your site at the smaller viewport width than your site uses.

When taking Heatmap screenshots, these are the widths we use:

• Desktop: 1280px
• Tablet: 800px
• Mobile: 380px

Tracking will be correct no matter what resolution a visitor loads the site with, as our Heatmaps report data based on the elements themselves, and not their relative position on the page.

The clicks and percentages on a heatmap only represent elements that are visible in the screenshot:

For example, a hover menu element might not be visible in the screenshot, so it wouldn't be included in the total clicks shown in the side panel on the right. However, these clicks would still be tracked in the CSV export.

The percentage of total clicks on the same element can also vary between what's shown in the screenshot and the CSV export. This is because the heatmap screenshot is only including the total clicks of visible elements in the screenshot, while the CSV export is including the total clicks of all elements.

• Screenshot: 100/6,000 = 1.66%
• CSV Export: 100/9,000 = 1.11%

You can learn more about exporting heatmap data here: How Can I Download My Heatmap?