A scroll event is an event fired by the browser (and captured by your tracking) whenever a user moves the page vertically or horizontally. In web analytics, you typically don’t care about every pixel—what you want is scroll depth milestones (e.g., 25%, 50%, 75%, 100%) that describe content engagement far better than a raw pageview.
Why it matters
- Engagement quality: Reaching 50% of an article often correlates with actual reading, not just tab focus.
- Content performance: Identify sections where users drop off; combine with session data to segment by traffic source or device.
- UX signals: Sudden dips at the same depth may indicate layout or performance issues.
How it’s usually implemented
Track threshold-based events, not continuous scroll. Emit one event per threshold per page to avoid noise. Debounce or throttle at ~100–250 ms to protect performance. Send a payload via your data layer or tracker with fields like:
| Field | Example | Notes |
|---|---|---|
event_name | scroll_depth | Consistent naming matters |
percent_scrolled | 25/50/75/100 | Fire once per threshold |
direction | down | Optional, useful for UX |
content_id | post-123 | Normalize across pages |
viewport_h | 900 | For troubleshooting |
Mini formula (scroll depth %)
scroll_depth=max_scroll_topdocument_height−viewport_height×100\text{scroll\_depth} = \frac{\text{max\_scroll\_top}}{\text{document\_height} – \text{viewport\_height}} \times 100scroll_depth=document_height−viewport_heightmax_scroll_top×100
Example: document = 5000 px, viewport = 900 px, max_scroll_top = 3100 px
→ 3100/(5000−900)≈75.6%3100 / (5000 – 900) \approx 75.6\%3100/(5000−900)≈75.6% → bucket as 75%.
Practical tips
- Define a single taxonomy for names and params across products and teams.
- Track 100% only on real bottom reach (account for sticky footers).
- Consider horizontal scroll for carousels.
- Combine with time on page and active time to avoid rewarding idle scrolling.
- Don’t double-count when content expands (accordions, comments); use max depth per page.
Internal links: Pair scroll signals with scroll depth, engagement rate, and bounce rate to get a cleaner read on attention.