Skip to content

Scroll Depth

Scroll Depth measures how far visitors scroll down a page before leaving or moving on. It surfaces content consumption patterns and shows which sections hold attention.

What Scroll Depth Measures

Scroll depth tracks the percentage of a page users view by scrolling. It answers:

  • How much of your content do users actually see?
  • Where do most visitors stop reading?
  • Which sections drive the most engagement?
  • Are key CTAs positioned where users will see them?

The metric is reported two ways:

  1. Percentage-based: Tracks 25%, 50%, 75%, or 100% of page length.
  2. Pixel-based: Measures the exact pixel depth users scroll to.

Implementation Methods

Basic Tracking Setup

Many tools fire an event each time a visitor crosses a preset threshold, typically a quarter, half and three quarters of the page.

Statable has no thresholds and nothing to configure. The script keeps the furthest point reached and sends a single percentage when the visitor leaves the page, riding along with the engagement event. Look for the Scroll Depth column in Top Pages Details, averaged across views of that page.

To act on one particular depth, make it a goal: Site settings → Goals, type Scroll Depth, then set the percentage that counts as a conversion on the slider.

Advanced Tracking Considerations

  • Viewport size variation: Devices show different amounts above the fold.
  • Dynamic content: Lazy loading and infinite scroll need special handling.
  • Time-based tracking: Scroll depth plus time on page gives richer insight.
  • Interaction tracking: Correlate scrolls with clicks, video plays, form submissions.

Technical Implementation

Throttle or debounce scroll tracking to avoid flooding analytics servers. Most setups fire events on scroll pauses or threshold hits.

Analyzing Scroll Depth Data

Key Metrics and Benchmarks

Scroll depth patterns guide content placement and structure:

Page TypeTypical 50% Scroll RateTypical 100% Scroll Rate
Blog Articles60-70%15-25%
Landing Pages45-55%10-20%
Product Pages70-80%30-40%
Homepage35-45%5-15%

Interpretation Guidelines

High scroll depth (>70% reaching halfway) indicates:

  • Engaging, relevant content
  • Good content structure and flow
  • Effective visual hierarchy
  • Compelling headlines and introductions

Low scroll depth (<30% reaching halfway) suggests:

  • Content fails user expectations
  • Poor page loading performance
  • Overwhelming or confusing layout
  • Mismatched traffic sources

Context Matters

Low scroll depth isn't always negative. Users finding answers fast at the top of FAQ pages is success, not failure. Always weigh page purpose.

Practical Applications

Content Optimization

Scroll depth data drives concrete improvements:

  1. Reposition key elements: Move important CTAs above common drop-off points.
  2. Break up long content: Add visuals, subheadings, or summaries at strategic intervals.
  3. Progressive disclosure: Place critical info where most users will see it.
  4. A/B testing: Compare layouts to maximize engagement.

Common Use Cases

  • Editorial Planning: Find optimal article lengths and content types.
  • Landing Page Design: Place conversion elements before typical exit points.
  • Product Descriptions: Order info by viewing patterns.
  • Form Optimization: Position fields where users engage most.

Quick Win

If 80% of users never scroll past 50%, put all critical info and primary CTAs in the first half.

Relationship with Other Metrics

Scroll depth gains meaning alongside complementary metrics:

Time on Page + Scroll Depth = Content consumption quality

  • High time, low scroll: users carefully reading top content
  • Low time, high scroll: users scanning for specific information
  • High time, high scroll: deeply engaged users consuming all content

Bounce Rate + Scroll Depth = Landing page effectiveness

  • High bounce, low scroll: immediate relevance issues
  • High bounce, high scroll: content consumed but doesn't drive further action
  • Low bounce, any scroll: successful continued engagement

Exit Rate + Scroll Depth = Content satisfaction indicators

  • High exit at 25% scroll: early content fails expectations
  • High exit at 75% scroll: users found what they needed
  • High exit at 100% scroll: completed content consumption

Technical Considerations

Performance Impact

Scroll tracking can hurt performance if done badly:

  • Use passive event listeners when possible.
  • Throttle (typically 100-250ms intervals).
  • Skip pages where the metric adds no value.
  • Sample for high-traffic sites.

Privacy and Compliance

Scroll tracking is non-invasive, but consider:

  • Disclosure in privacy policies
  • Respect for Do Not Track preferences
  • GDPR compliance for EU visitors
  • Minimal data collection principles

Cross-Device Challenges

Mobile and desktop scroll patterns differ:

  • Mobile users scroll more readily and deeply.
  • Desktop users rely more on navigation menus.
  • Tablet behavior sits between mobile and desktop.
  • Responsive design shifts content visibility across devices.

Best Practices for Improvement

To optimize scroll depth across your site:

  1. Create compelling introductions that promise value and pull readers down.
  2. Use visual cues like arrows or progress bars to signal more content below.
  3. Implement sticky navigation to keep orientation during long scrolls.
  4. Add quick navigation elements for jumping to specific sections.
  5. Test different content formats to find what resonates.
  6. Monitor seasonal variations as behavior shifts over time.
  7. Segment by traffic source since channels bring users with different intent.

In Statable the Scroll depth module is on by default. It rides on engagement tracking and cannot run without it, so switching engagement off takes scroll depth with it. Both sit under Site settings → General → Tracking Code.

Ready to take control of your web analytics? Try Statable free for 30 days. No credit card required, full feature access, built for GDPR. Start your free trial or view a live demo.