Crazy Egg Heatmap for Landing Pages: What It Shows
Crazy Egg Heatmap for Landing Pages: What It Shows and How to Act on the Data
A Crazy Egg heatmap turns visitor behavior on your landing page into a visual map of where people click, how far they scroll, and where they lose interest. This tutorial walks through each report type, what to look for, and the specific changes to make when the data tells you something is broken.
Quick answer: A Crazy Egg heatmap shows aggregate click, scroll, movement, and segmentation data overlaid on your landing page. It reveals which elements attract attention, where users abandon the page, and which sections get ignored. Act on the data by fixing false clicks on non-links, cutting content below scroll cliffs, and moving high-interest elements above the fold.
What does a Crazy Egg heatmap actually show?
Crazy Egg gives you five report types. Each answers a different question.
Heatmap (classic): Aggregated click density. Red spots = high click volume. Blue = low. Use this to see if your CTA is getting clicks or if visitors are clicking things that aren't links.
Scrollmap: How far down the page people scroll. Bright red at the top, fading to blue as visitors drop off. The color change point is your scroll cliff.
Confetti: Every click as an individual dot, filterable by source, device, country, referrer, and campaign. This is where you segment paid vs organic, mobile vs desktop.
Overlay: Click counts and percentages on every clickable element. Best for auditing nav links and buttons.
List report: Same data as overlay, but in a sortable table. Faster for pages with 40+ clickable elements.
According to Crazy Egg's own product documentation, the tool has tracked heatmap data for over 300,000 websites since launch in 2005.
How do you set up your first heatmap tracking snapshot?
- Install the tracking script in your site's
<head>(one line of JS). - Create a new Snapshot and enter the exact landing page URL.
- Set a sample size. For a low-traffic page, aim for 2,000-3,000 visits minimum before drawing conclusions. Less than that and single-user quirks distort the map.
- If your landing page has variants (query strings, personalization), decide up front whether to track them together or separately. Merging distorts averages.
- Let it run. Don't touch the page during collection. If you edit the layout mid-snapshot, the overlay coordinates break.
For campaign-specific pages, tag the snapshot with a UTM filter so you can isolate paid traffic later in Confetti.
How do you read a click heatmap without fooling yourself?
Three traps to avoid:
Trap 1: Confusing attention with intent. A red cluster on your hero image doesn't mean people love it. It often means they clicked it expecting a link. If it's not clickable, that's a UX bug, not a win.
Trap 2: Ignoring the denominator. A button with 200 clicks looks great until you see it got 50,000 impressions. Always cross-check clicks against total visits using the Overlay report.
Trap 3: Averaging away real segments. Mobile users behave completely differently from desktop. Always view mobile and desktop heatmaps separately. On mobile, thumbs create false click hotspots at the bottom of the screen just from how people hold their phones.
For a deeper breakdown of common click-map misreads, see our guide on the best heatmap tools for landing page UX analysis.
How do you find your scroll cliff?
Open the Scrollmap. Find where the color shifts from yellow to green (roughly the 50% viewing threshold). That's your first cliff. Then find where it drops to blue (under 20% of visitors). That's your dead zone.
What to do with each:
| Zone | % of visitors seeing it | Action |
|---|---|---|
| Red / orange (top) | 80-100% | Your best CTA and value prop belong here |
| Yellow (mid) | 40-70% | Social proof, secondary CTA, key features |
| Green (fold 2-3) | 20-40% | Detail, FAQ, objections |
| Blue (bottom) | Under 20% | Either cut it or move it up |
If your primary CTA sits in the green zone, most visitors never see it. Move it up. If your pricing table is in the blue zone on a pricing page, that's a five-alarm fire.
More on this problem: above-the-fold mistakes that kill your landing page first impression.
What do you do with Confetti data?
Confetti is where hypotheses get proven or killed. The filter panel is the whole point.
Segment by traffic source. Filter to paid Google traffic only. Then compare to organic. If paid visitors ignore your CTA but organic visitors click it, the ad-to-page message match is off, not the page.
Segment by device. Look at mobile clicks specifically. Are people trying to tap elements too close together? Mobile click clustering usually means your tap targets are under 44px or spaced too tightly.
Segment by referrer. If Product Hunt traffic clicks a specific feature callout, but Twitter traffic clicks the pricing link, you've learned each audience has a different primary question. Tailor future landing pages accordingly.
Segment by time on page. Visitors who stayed 30+ seconds and then clicked your CTA are the pattern to replicate. Where else did they click first? That's your intent path.
How do you act on click data that reveals dead elements?
If Overlay shows 0.1% of visitors clicking an element you thought was important, you have three options:
- Remove it. If it's not converting attention into action, it's page weight.
- Rewrite it. Change the copy, the color, or the position, and re-test.
- Reposition it. Sometimes a great CTA fails because it's stuck between two other CTAs. Isolate it.
The reverse is also true. If an element gets heavy clicks but isn't clickable (a customer logo, a stat, a screenshot), make it clickable. Link the logo to the case study. Link the stat to the methodology. Link the screenshot to a product tour.
When should you pair heatmap data with A/B testing?
Heatmaps tell you what is happening. A/B tests tell you whether a change fixed it. Never skip step two.
Workflow:
- Run a Crazy Egg snapshot for 2 weeks. Collect enough data.
- Identify the single biggest problem (usually: scroll cliff, dead CTA, or false clicks).
- Build one variant that fixes it.
- A/B test the variant against the original. Don't change three things at once.
- After the test declares a winner, run a new snapshot on the winning page to see what new behavior emerges.
For the mechanics of running the test itself without burning traffic, see how to A/B test a landing page without wasting traffic.
What does a Crazy Egg heatmap not tell you?
Heatmaps are aggregate. They don't show:
- Why a specific user clicked (that's session recordings).
- What users said out loud while browsing (surveys, user testing).
- Form field friction past the click (form analytics).
- Post-click funnel behavior (GA4 or product analytics).
Treat the heatmap as one input, not the whole diagnosis. Pair it with recordings for the "why" and with GA4 for the funnel view.
Frequently asked questions
How much traffic do I need before a Crazy Egg heatmap is reliable?
At least 2,000-3,000 visits per snapshot for click data to stabilize. Lower-traffic pages need longer collection windows. If a page gets 100 visits a week, run the snapshot for a full month before acting on anything.
Does Crazy Egg slow down my landing page?
The tracking script is asynchronous, so it loads without blocking rendering. Real-world impact on Core Web Vitals is small but not zero. Test your page speed before and after installing, and remove the script from pages you're not actively analyzing.
Can Crazy Egg track heatmaps on dynamic or single-page apps?
Yes, but you need to configure it correctly. Crazy Egg supports SPA route changes through its API, but you'll need to trigger page view events manually on route change. Otherwise all "pages" get lumped into one snapshot.
How is a Crazy Egg heatmap different from Hotjar's?
Both show clicks, scrolls, and movement, but they price differently and segment differently. Crazy Egg is stronger on Confetti-style filtering; Hotjar leans heavier into session recordings and surveys. See our full breakdown: Crazy Egg vs Hotjar.
Should I run heatmaps on every page or just landing pages?
Just landing pages and high-value conversion pages first. Running heatmaps everywhere burns your snapshot quota and gives you data you won't act on. Prioritize pages with the highest traffic-to-conversion ratio impact.
Can I use a Crazy Egg heatmap to validate a new landing page before launch?
Not directly. Heatmaps need real visitor data. What you can do: launch a soft version to a small paid traffic slice, collect a heatmap snapshot for two weeks, then iterate before scaling ad spend.
What's the fastest way to get value from Crazy Egg in the first week?
Install the script, run a Scrollmap on your highest-traffic landing page, and find the scroll cliff. Move your primary CTA above it. That single change usually beats any other first-week action.
Want to see if your landing page is actually converting before you install a heatmap tool? Run your URL through PagePulse for a free UX audit that flags scroll cliffs, weak CTAs, and above-the-fold problems in under 30 seconds. Then use Crazy Egg to confirm the diagnosis with real visitor data.