Heatmaps
Visualize where visitors click and how far they scroll on your pages.
Overview
Heatmaps provide a visual representation of user interaction with your pages. They show you what captures attention, what gets clicked, and how far visitors scroll — insights you can’t get from standard analytics reports.
Navigate to Heatmaps in the main menu to access this feature.
Types of Heatmaps
Click Heatmaps
See where visitors click on your pages.
- Red/Orange areas — High click activity (hot spots)
- Yellow/Green areas — Moderate click activity
- Blue/No color — Low or no click activity
Click heatmaps reveal:
- Which elements attract the most clicks
- Whether visitors click on non-clickable elements (indicating confusion)
- If important buttons or links are being ignored
- How click behavior differs across devices
Scroll Heatmaps
See how far visitors scroll down your pages.
- Red/Orange areas — Almost all visitors see this content
- Yellow/Green areas — Some visitors scroll this far
- Blue areas — Few visitors reach this point
Scroll heatmaps reveal:
- How much of your content visitors actually see
- Where visitors lose interest and stop scrolling
- Whether important content is placed too far down
- If your pages are the right length
Viewing Heatmaps
- Navigate to Heatmaps
- Select the page you want to analyze
- Choose your heatmap type (click or scroll)
- Select your date range
- Choose device type (desktop, tablet, or mobile)
The heatmap overlays on top of your actual page, showing interaction patterns.
Setting Up Heatmaps
Heatmaps are automatically captured for your pages once you have the Ghost Metrics tracking code installed. However, you may want to configure which pages to track.
Configuring Tracked Pages
By default, heatmaps may be enabled for all pages or a specific set. To configure:
- Go to Heatmaps settings
- Define which pages to track (by URL pattern)
- Set sample rate if needed (for high-traffic sites)
Sample Rate
For very high-traffic sites, you can set a sample rate to reduce data collection while still getting statistically valid results.
Analyzing Click Heatmaps
Look for Unexpected Patterns
- Clicks on non-links — Visitors may think images or text are clickable
- Ignored CTAs — Important buttons not getting clicks
- Navigation patterns — Which menu items get used
Compare Desktop vs Mobile
Click patterns often differ dramatically:
- Mobile users may miss elements visible on desktop
- Touch targets may be too small on mobile
- Navigation behavior changes on smaller screens
Check Above vs Below the Fold
- Content “above the fold” (visible without scrolling) typically gets more interaction
- Important CTAs should be in high-visibility areas
Analyzing Scroll Heatmaps
Find the Fold Line
The “average fold” shows where the initial viewport ends for most visitors. Content below this line requires scrolling.
Identify Drop-Off Points
Look for sharp color transitions — these indicate where visitors stop scrolling. Ask:
- Is important content below this point?
- Is there a visual cue that makes visitors think the page ended?
- Is the content above this point engaging enough?
Evaluate Page Length
- If most visitors reach the bottom, your page length is appropriate
- If visitors stop halfway, consider shortening the page or improving content
Use Cases
Optimize Landing Pages
- View click heatmap for your landing page
- Check if the main CTA is getting clicks
- Look for distracting elements stealing attention
- Verify scroll depth reaches your conversion elements
Improve Navigation
- View click heatmap for pages with navigation
- See which menu items are used most
- Identify unused navigation elements
- Consider reorganizing based on actual usage
Validate Page Redesigns
- Capture heatmaps before a redesign
- Implement changes
- Capture heatmaps after launch
- Compare interaction patterns
Identify Content Issues
- View scroll heatmap for long content pages
- Find where visitors stop reading
- Improve content at drop-off points
- Consider restructuring or shortening content
Best Practices
Wait for Sufficient Data
Heatmaps need enough visitor interactions to be meaningful:
- Wait for at least 100-200 visits to a page
- More traffic = more reliable patterns
- Don’t draw conclusions from sparse data
Compare Device Types
Always check desktop, tablet, and mobile separately. Each has different:
- Screen sizes and fold positions
- Interaction methods (click vs touch)
- Navigation patterns
Look at Multiple Pages
Don’t just analyze your homepage. Check:
- High-traffic landing pages
- Key conversion pages
- Pages with high bounce rates
- Important content pages
Combine with Other Data
Use heatmaps alongside:
- Session recordings — Watch actual behavior in context
- Analytics reports — Understand traffic and conversion data
- Form analytics — See form interaction details
Regular Review
Visitor behavior changes over time. Review heatmaps periodically, especially after:
- Website changes
- New campaigns
- Seasonal shifts
- Significant traffic changes
Limitations
- Heatmaps show aggregate patterns, not individual behavior
- Dynamic content may not display correctly in heatmap view
- Some interactive elements (pop-ups, modals) may not be captured
- Very low-traffic pages may not have enough data
Next Steps
- Session Recordings — Watch actual visitor sessions
- Form Analytics — Analyze form interactions
- Behavior Reports — See page performance data