Scroll Depth & Engagement Tracking
Pageviews don't tell you if anyone actually read anything
A pageview fires on load regardless of whether the visitor reads a single word or bounces in two seconds. Scroll depth tracking closes that gap by recording how far down the page a visitor actually scrolls — typically bucketed into thresholds like 25%, 50%, 75%, and 90/100% of total page height — turning a binary 'did they visit' signal into a graduated 'how much did they actually engage with' signal. GA4's Enhanced Measurement includes a built-in scroll event that fires once per page at the 90% vertical depth threshold by default, but that single threshold is often too coarse for real diagnostic use — most practitioners implement custom scroll tracking via GTM to get the full set of granular thresholds.
// Custom GTM Custom HTML tag: fires a dataLayer push at each scroll
// depth threshold, once per threshold per page, for more granular
// analysis than GA4's single default 90% Enhanced Measurement event.
(function () {
const thresholds = [25, 50, 75, 90, 100];
const fired = new Set<number>();
function checkScrollDepth() {
const scrollTop = window.scrollY;
const docHeight = document.documentElement.scrollHeight - window.innerHeight;
const percentScrolled = Math.round((scrollTop / docHeight) * 100);
thresholds.forEach((threshold) => {
if (percentScrolled >= threshold && !fired.has(threshold)) {
fired.add(threshold);
(window as any).dataLayer.push({
event: "scroll_depth",
scroll_threshold: threshold,
page_path: window.location.pathname,
});
}
});
}
window.addEventListener("scroll", checkScrollDepth, { passive: true });
})();Scroll depth as a content/layout diagnostic
The practical value of scroll depth is diagnosing where content loses attention. If 80% of visitors reach the 25% threshold but only 20% reach 75%, there's a specific drop-off zone between those points worth investigating — a wall of text, a slow-loading embedded video, an ad unit that visually signals 'end of content,' or simply a page that's too long for its actual value to the reader. Cross-referencing scroll depth against where key content lives (e.g. 'does the pricing table sit below the point where 60% of visitors have already left?') turns a generic engagement number into an actionable layout decision.
Scroll depth measures exposure, not comprehension or interest
Engagement signal types and what each actually measures
| Signal | What it actually measures | Common misinterpretation |
|---|---|---|
| Scroll depth | How far down the page the viewport reached | Mistaken for 'read the content there' |
| Time on page | Total session duration on the page, including idle tabs | Mistaken for active reading time |
| Click/tap events | Direct interaction with an element | Most reliable, but only covers interactive elements |
| Mouse movement heatmaps | Cursor position over time (desktop only, weak signal on mobile) | Assumed to equal visual attention, which isn't always true |
Engagement thresholds make good GA4 conversion events, with care
What's Next?
Scroll depth captures passive content engagement; the complementary and often higher-value signal is tracking active engagement with the forms and interactive elements that actually drive conversions, including exactly where visitors abandon them.
I build these systems professionally.
Whether it's a RAG pipeline, analytics migration, or AI workflow — let's talk.