Chapter 06

How to measure page scrolling

By Anna Tomalik

So far, you’ve learned how to track a click on a button, menu with logo, and footer items. Now is a good moment to shed some light on how much coSo far, you’ve learned how to track a click on a button, menu with logo, and footer items. Now is a good moment to shed some light on how much content visitors consume. Scroll depth is one of the metrics that will help you with that.

Piwik PRO tracks page scrolls automatically and saves scroll data as custom events. (Only in versions below 16.17.0, you need to set up such tracking manually.) To see how far visitors scroll on a given page, you need to set up a custom report. Let’s do it right away.

Set up reporting for page scrolls

To set up reporting for page scrolls, follow these steps:

  1. Go to Menu > Analytics.
  2. Navigate to Custom reports.
  3. Click Add a report.
  4. Choose the following report type: Explorer.
  5. Name the report. Example: Page scrolls.
  6. Choose the Visibility option: Author or All users. The All users option lets you share this report with other teammates.
  7. In Nested dimensions, set the following dimensions:
    • Page URL
    • Custom event action
    Page scroll report in Piwik PRO
  8. Add the following metrics:
    • Custom events
    • Unique custom events
    Page scroll report in Piwik PRO
  9. Optionally, set Default sorting options.

    Tip: You can choose to sort by dimensions or metrics. The default setting will always show this type of sorting in your custom report.

  10. In Filter dimension, set the following filter: Custom event category is built-in page scroll.
  11. Click Create a report.
  12. All done! Now click on a page URL in your report to see how far visitors scroll on that page.
    Page scroll report in Piwik PRO

How to analyze scroll data

It’s best to analyze scroll data for each page, not for all pages. It’s because each page has different content and a different goal. For example, on the Clear Bank’s website we could look at scroll depth for blog posts to understand how far down people are reading. Additionally, we could analyze scroll depth for the home page and pages with our offer to learn which information is the most visible to visitors.

Page scroll example in Piwik PRO

At this point, we need to explain how to read the data. As you can see in our report, there were:We should also calculate a few things to make our analysis more clear. Our report will show the number of events for each scroll point. For example:

  • 50 events of 25% scroll
  • 20 events of 50% scroll
  • 10 events of 75% scroll 
  • 5 events of 100% scroll

But that doesn’t mean that 50 people scrolled to 25% and another 5 people scrolled to 100%. It means that:

  • 30 people scrolled to 25%
  • 10 people scrolled to 50%
  • 5 people scrolled to 75%
  • 5 people scrolled to 100%

Why? Because a person who scrolls to 100% is registered with four events: one for 25% mark, one for 50% mark, one for 75% mark, and one for 100% mark. Here’s how to count it:

Scroll point Events Visitors
25% scroll A A-B
50% scroll B B-C
75% scroll C C-D
100% scroll D D

Now let’s see this calculation for our example:

Scroll point Events Visitors
25% scroll 50 50-20=30
50% scroll 20 20-10=10
75% scroll 10 10-5
100% scroll 5 5

When we have scroll depth data ready, we can compare it to a few metrics calculated for the page we’re tracking: average time on page and bounce rate under Menu > Analytics > Reports > Pages. These two are the best indicators of how our content is performing. When beefed up with the scroll depth metric they work even better.