Click Heatmap Analysis
Click heatmaps visualize which page elements users click on. Cold zones (blue) indicate rare clicks, hot zones (red) indicate frequent clicks. They show what attracts attention and drives interaction.
What Click Heatmaps Show
- Whether users click CTA buttons or decorative elements
- Which navigation links are used
- Clicks on non-clickable elements (potential dead clicks)
- How attention distributes across page sections
Tools
Microsoft Clarity — free, automatic. Hotjar, Crazy Egg, VWO — paid, more detailed filters.
Setup and Configuration
// Microsoft Clarity (installed earlier)
// Tag pages for heatmap segmentation
clarity("set", "page_template", "product_page")
clarity("set", "user_segment", "new_visitor")
// Hotjar: track button events
hj('event', 'cta_clicked')
Data Interpretation
Clicks on non-clickable text: users expect the element to be clickable. Add a link or remove false clickability cues (underlines on non-links).
CTA button in cold zone: may be below fold or not visually prominent. Check scroll heatmap if button is visible above the fold.
Clicks on images: especially on mobile, users expect zoom or navigation. Add appropriate functionality.
Navigation patterns: frequently used menu items indicate priority sections.
Heatmap Segmentation
Analysis filters:
- Device: desktop vs mobile vs tablet (behavior differs significantly)
- Source: organic vs paid vs email (different intents)
- New vs returning users
- Converters vs non-converters
Most valuable pattern: compare click heatmap for converters vs non-converters. The difference shows which elements lead to conversion.
Delivery Time
Installing tool, collecting data (minimum 500 visitors), analysis and recommendations — 3–5 business days.