...
You do not need to set up any specific heatmaps or further settings in Hotjar for the data to come in. You will not need to set these up until it’s time to put together a report and images for the dealer.
Dashboard
When you first log in to a specific account, if it has had enough time to gather data appropriately, there will be several graphs and lists of statistics for you to take a look at. While some of these are more basic data and information that the dealer may have access to via Google Analytics, it is still a good idea to take a look at the various categories of information here, to help inform any conclusions you may draw from the specific heatmap data.
...
We will be summarizing some of this basic information in our heatmap reporting template for the dealer. There are many things that tend to be true of all of our sites – for example, most users are new vs returning, the larger majority of visitors are on mobile, etc., but we should be specific for the dealer in regards to what the percentage is.
Creating Heatmaps
Once the data is ready to be gathered, you will want to create a heatmap for each page that the dealer has requested data on. Typically, most dealers will only want to know about their homepage, but occasionally dealers will request information on their SRP/VDP as well.
In order to arrange the data we have gathered on a visual to report on it, we’ll need to navigate to the Heatmaps section of the account we are reporting on.
Once you’ve arrived at the Heatmaps section, there are a couple different ways you can start creating a new heatmap – either by clicking the + New heatmap on the left, or the New heatmap button in the middle:
...
The New Heatmap page will prompt you to enter the URL of the page you’d like to view. When you click in the box, it will offer some suggestions, the first of which usually being the homepage. We’ll select that to create a heatmap of the homepage.
...
Once you’ve selected a URL, it will prompt you to choose a device. We can change this easily later to view all the different versions, so it doesn’t really matter which one you choose, but I usually do desktop first.
...
Once you’ve selected your device, you’ll click the “Continue” button in the bottom right of the screen.
...
Next, it will prompt you to choose a “type” of heatmap to display. Like the device, we can change this later (and we will, since we want to report on both click and scroll), so it doesn’t matter too much what you choose to start with.
Finally, it will prompt you to choose a screenshot that matches the look of the page. Some of these screenshots may be incorrect or not fully loaded. In this example, the first two have not finished loading, while the third one looks correct. On occasion, none of the screenshots will be correct or fully loaded – in this case, you’ll select the “Take new screenshot” button. This will open a new window and allow you to scroll all the way down to ensure everything is loaded properly before taking the screenshot. We want to ensure everything is loaded correctly on the page to ensure all the click and scroll data accurately matches the location of all the elements of the page. Note that some third party plugins and elements may not load in correctly no matter what, and that the screenshot also automatically censors certain things like phone numbers and other numerical values.
...
Once the appropriate screenshot is selected, Hotjar will overlay the appropriate data on top of the image. We can easily switch between device type with the icons at the bottom left of the screenshot, and map type to the right of the image.
...
You can save this heatmap to look at later by clicking the “Save” button in the top right. Make sure to name it appropriately so it is obvious what it is later.
...
From here, we can start taking a look at some of the more important things that stand out as far as how users interact with the site. By default, the “All clicks” map will show a 1, 2 and 3 on top of the most clicked areas on the site.
...
You can hover over any area that has color on it to determine how many clicks that spot represents.
In addition to where there are clicks, it’s important to pay attention to where there aren’t clicks as well. For example, a very common finding in heatmaps for our sites is that users rarely, if ever, engage with a rotating banner. Noticing this can be useful information for the dealer, and we can recommend alternate ways to advertise what they are trying to use their rotating banner to show off.
Additionally, on both the desktop and mobile maps, it will indicate the average fold for most devices. This can be helpful information for you when creating your report, because it will tell you what users see first and foremost and what they have to scroll to get to.
...
Saving Images
At some point while you are looking through the data for the page you’ve created a heatmap for, it’s important to export the images to send to the dealer along with the report. You can save the image for the version of the heatmap you are currently looking at by using the Download button.
We should always include the following images with our report:
Desktop click map (including top 3 overlay)
Mobile click map (including top 3 overlay)
Desktop scroll map
Mobile scroll map
Tablet tends to have the fewest amount of users, so we don’t typically include results for this in our report. However, if dealer specifically requests this information, we should include the appropriate click and scroll images for tablet as well.
Reporting & Drawing Conclusions
...
Report Template
You should use our standard Heatmap Reporting template to start with. There are several items that are easy to fill out with the data that you can see on the dashboard and the heatmap – for example, the top clicked items, or how far down users typically scrolled on the page.
Additional Observations
There are several placeholders in the reporting template that simply say “Observation”. So, how do we decide what to put here?
We need to use our knowledge of the data from the various versions of the map to come to some reasonable conclusions about things on the site that could be improved. We can combine this with anything we may know that the client is hoping will get attention or clicks, and come up with some things we notice easily.
Examples:
A dealer has a rotating banner advertising their truck accessories. They have a link to their truck accessories in various other spots (the RV Types bar, and the nav) further up on the page that are getting plenty of clicks. They also have a CTA for truck accessories further down on the page, for any users that might make it that far down, that is also getting clicks (despite being so far down the page that only 12% of visitors make it there!). Given that the RV types icon especially is the #3 most clicked item on the site, we can conclude that the rotating banner advertising this is not necessary and taking up valuable page space.
Using the data we are provided, we can determine which elements of the page are not achieving the effect they are intended to, and see which things should be changed/moved or even removed. We should try to make as many of these types of observations as possible for the dealer from the data we can get.
Making Recommendations
Coming soon!