In part 1 of our heatmap blog series, you learned about the different types of heatmaps and a few other benefits of using platforms like Crazy Egg and Hotjar. In the second part of this series, we’re going to show you a few user experience insights that you can apply when analyzing heatmaps.
1. How effective is your website navigation?
Suggested Maps: Click Map
Using a click map, you can study where visitors are frequently interacting with your website navigation. This is a great tactic to use both before and after a website redesign. Combining this click map and the Users Flow report in Google Analytics can give you a sense of which pages are the most important on your site. If users are only clicking on a small portion of the navigation, consider making changes to the order or wording to make it easier for website visitors to find what they’re looking for.
- Use this insight to identify the optimal number of items in a navigation
- For most sites, we would recommend no more than 7 items in the navigation, but for other sites this number should be much less
- To avoid information overload, remove low-trafficked sections of the website from the navigation and find other areas on the website to link to this section instead
- Keep your two most important links on either side of your navigation, as cognitive studies show that these two links will receive more attention than other links
- A/B test the wording used in the navigation by renaming some links to see if this increases the click through rates
2. Are important ‘Call to Actions’ (CTAs) in the right spot?
Suggested Maps: Scroll Map, Click Map
If your most important CTAs are placed at the bottom of your web page, utilizing the scroll map is extremely important to see what percentage of users are even seeing them. If you are using Crazy Egg, you can see when users are stopping to view a certain section of the website. This may indicate a great place for a CTA or an anchor link that advances the user to sections further down the page.
The click map will indicate where website users are interacting with your website. Having too many CTAs on the page may distract the user from completing a form or clicking on a specific CTA. If your goal of that page is to just get users to navigate somewhere else on your website and digest content, multiple CTAs are fine. Just keep in mind what your end goal is when determining where to place a CTA and how many you should have on each page.
- Move important CTAs closer to the top of the page
- Add anchor links to advance visitors to additional content further down the page
- Avoid adding CTAs on the right panel of your web page, as eye tracking studies indicate that users read in a F-shaped pattern and they may look past these sections
3. Are your headlines and images engaging enough?
Suggested Maps: Scroll Map
When you see visitors dropping off at a certain headline or image on your page, this may indicate that the reader was under the impression that the rest of the article is no longer relevant to them. If you’re spending time writing blog posts and crafting important landing pages, you’ll want to ensure that the most important parts of the page are being noticed!
- Adjust the layout of your page to move important sections of the site further up (where it still makes sense) to get more eyes on it
- Include a table of content section for long blog posts, so users can see what they will get out of the blog post and click to the section they are most interested in
- Ensure images are engaging and relevant to the information provided on the page
4. Are ‘clickable’ and ‘non-clickable’ elements easily understood?
Suggested Maps: Click Map, List Report
Everybody loves an artistically designed webpage, but what happens when some of those visually appealing elements trick the reader into thinking there is a link somewhere where there isn’t? The user may become distracted and confused, navigating away from the page because it’s not functioning the way they think it should. The opposite can also occur, where a user doesn’t understand an element is clickable, so the functionality that the front-end developer spent weeks creating is never used.
- Take a look at a click map or list report to understand what elements users are clicking on (or not clicking on), so you can update the design to encourage clicks in the right place
- Use caution when styling a page with text underlines, as users tend to think this is a clickable element
- Run a color blindness test on your website to make sure all visitors can see the links and on-page elements, especially if you use a color to differentiate a link from standard text
5. Does your hero image create a “false bottom”?
Suggested Maps: Scroll Map
In the era of large hero images, many websites experience a problem where website visitors believe they landed on a webpage that is not scrollable, causing them to lose website visitors. This is very valuable information that your analytics platform alone is not able to show you.
In the example above, the average fold line is below where the second content section starts, which gives the reader the idea that this page can be scrolled - yay! If the average fold was a tad higher (before the second section started), website visitors may not have understood that there was anything further down on the page, creating a “false bottom”. You would notice a steep drop-off of visitors leaving at this point.
- Shorten the length of the hero image so the average page fold is below the first headline on desktop and mobile
- Add an arrow or some type of element to indicate to website visitors that they can scroll further down the page
Trying to understand user behavior using quantitative metrics alone is like trying to put a puzzle together without seeing the picture. It’s extremely difficult, and you’ll end up making assumptions that are inaccurate.
By observing both quantitative and qualitative metrics, you’ll be able to make better, more informed decisions to improve your website’s user experience.
Think your e-commerce or lead-generation website could benefit from analytics reporting? (Trick question, of course it could!) Our analytics team can provide you with actionable insights to improve your website conversion rate, click through rate, and overall user experience. Let’s chat!
About Melanie Novak
Melanie Novak is a Web Analyst at Liquid Interactive. She specializes in transforming data into actionable insights for Liquid’s clients.