Scrollmaps
Scrollmaps reveal what percentage of visitors reach each section of a page — the data you need to decide what truly belongs above the fold.
Scrollmaps
A visualisation showing what percentage of visitors scroll to each vertical depth on a page.
A scrollmap is a behavioural-analytics visualisation that overlays a heat gradient on a page screenshot, showing the share of visitors who reach each vertical pixel. Warm colours mark the zones most people see; cool colours mark the depths only a small cohort reaches.
For an online store, scrollmaps answer a deceptively important question: of the people who land on this product page, how many actually see the size guide, the reviews, or the checkout CTA? That data drives decisions about what belongs above the fold, where to place trust badges, and which sections are wasted real estate.
Scrollmaps are one of three core visualisations inside behavioral analytics, alongside clickmaps and movement maps. While clickmaps tell you what people interact with, scrollmaps tell you what people actually see — and you can't click on something you never scrolled to.
The data is collected by a lightweight script that samples scroll position at intervals and reports the deepest pixel reached per session. Aggregated across thousands of sessions, that produces a cumulative curve: 100% of visitors see the hero, perhaps 60% reach the product description, 25% the reviews, 8% the footer.
scroll_depth_pct = (max_pixel_reached / total_page_height) * 100
max_pixel_reached
Deepest pixel reached
The lowest vertical scroll position recorded during the session, in pixels.
total_page_height
Total page height
Full rendered page height in pixels, including content below the fold.
scroll_depth_pct
Scroll depth percentage
The session's scroll depth, expressed as a percentage of the page.
A visitor lands on a Shopify product page for a €69 hoodie. The page is 4,800px tall (hero, gallery, description, size chart, reviews, related products, footer). They scroll down through the reviews and stop at pixel 3,600.
Deepest pixel reached: 3,600px
Total page height: 4,800px
→ 75% scroll depth
This visitor is in the cohort that sees the reviews block but never reaches related products or the footer. If your cross-sell module lives at 90% depth, the scrollmap will show only ~15% of visitors ever see it — a strong argument to move it higher.
The honest read of a scrollmap isn't about the raw numbers — it's about where the curve drops off sharply. A 40-point drop between two adjacent sections usually means a visual 'false bottom': a full-bleed image or whitespace gap that looks like the end of the page. Fixing the visual cue often recovers more scroll than rewriting the content below it.
Typical scroll-depth cohorts by page type (share of sessions reaching each depth)
| Page type | Reach 50% depth | Reach 75% depth | Reach 100% depth |
|---|---|---|---|
| Shopify homepage | 55-65% | 25-35% | 8-12% |
| Product detail page | 60-70% | 30-40% | 10-15% |
| Collection / category | 45-55% | 20-28% | 5-10% |
| Blog article | 40-50% | 20-25% | 10-18% |
| Checkout (single-step) | 85-95% | 70-85% | 60-75% |
| Long-form landing page | 35-45% | 12-20% | 3-7% |
Two pitfalls trip up new scrollmap readers. First, scroll depth is not engagement — someone can scroll to the footer in two seconds without reading anything. Pair scrollmaps with time-on-section or movement data before drawing conclusions. Second, mobile and desktop behave very differently; always segment by device, since the same page can be 3,200px on desktop and 6,400px on mobile.
Frequently asked questions
A scrollmap is a coloured overlay on your page screenshot that shows how far down visitors scroll. Red zones are seen by most people; blue zones are seen by very few. It's a quick way to find content that's effectively invisible.
Heatmap is the umbrella term for visualisations of aggregated user behaviour, which includes clickmaps, movement maps, and scrollmaps. A scrollmap specifically shows vertical reach — what percentage of visitors scroll past each point on the page.
If a scrollmap shows that only 50% of visitors scroll past your hero, then anything below the hero is reaching half your traffic at best. Primary value propositions, your main CTA, and trust signals should live in the zone that 80%+ of visitors actually see.
Aim for at least 1,000-2,000 sessions per page-device combination before treating the data as decision-ready. Below that, a few outlier sessions can shift the curve. High-traffic homepages reach this in days; niche product pages may take weeks.
Always. Mobile pages are typically twice as tall as desktop, and mobile visitors scroll less per second of attention. Looking at a blended scrollmap hides the device that probably needs the most fixing — usually mobile.
A well-built scrollmap script adds 5-15kb and runs asynchronously, so the impact on Largest Contentful Paint is negligible. Tools that bundle scrollmaps, clickmaps, and session recordings into one snippet (like Metricuno) are noticeably lighter than running three separate vendors.
Sharp drops usually indicate a 'false bottom' — a full-width image, banner, or whitespace gap that visually signals 'page ends here'. Add a peek of the next section, a clear continuation cue, or reduce the vertical gap to recover scroll depth.
Scrollmaps sit inside the broader behavioral-analytics toolkit alongside clickmaps, movement maps, session recordings, and funnel reports. Scrollmaps tell you what was seen; the other tools tell you what was done with what was seen.
Yes — that's one of the highest-yield uses. If a scrollmap shows your reviews block lives at 80% depth where only 15% of visitors land, test moving it up to 40% depth. Scrollmaps generate the hypothesis; an A/B test confirms the lift.
A healthy product page sees 60-70% of visitors past 50% depth and 30-40% past 75% depth. Below those ranges, the page is either too long, too visually broken, or the hero isn't earning the next scroll.
Get an AI expert review of your site
Paste your URL — Metricuno's AI runs the same heuristic checks a senior CRO consultant would, scoring your page and prioritising the fixes that'll move conversion fastest.