Skip to Content
FeaturesHeatmaps

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

  1. Navigate to Heatmaps
  2. Select the page you want to analyze
  3. Choose your heatmap type (click or scroll)
  4. Select your date range
  5. 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:

  1. Go to Heatmaps settings
  2. Define which pages to track (by URL pattern)
  3. 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

  1. View click heatmap for your landing page
  2. Check if the main CTA is getting clicks
  3. Look for distracting elements stealing attention
  4. Verify scroll depth reaches your conversion elements

Improve Navigation

  1. View click heatmap for pages with navigation
  2. See which menu items are used most
  3. Identify unused navigation elements
  4. Consider reorganizing based on actual usage

Validate Page Redesigns

  1. Capture heatmaps before a redesign
  2. Implement changes
  3. Capture heatmaps after launch
  4. Compare interaction patterns

Identify Content Issues

  1. View scroll heatmap for long content pages
  2. Find where visitors stop reading
  3. Improve content at drop-off points
  4. 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

Last updated on