Accessibility Problems with Infinite Scrolling

Endless scrolling (also known as infinite scrolling) is a web design and usability concept in which content is automatically reloaded when the user scrolls down – without having to manually click to a new page. It is sometimes used on news websites, but especially in social media. It can be found on both websites and native apps; for example, LinkedIn scrolls endlessly on the web but offers a button in the app to load new content

.

Challenges for Screen Reader Users

For blind people, infinite scrolling can cause significant accessibility problems, especially if they use screen readers or keyboard navigation. Here is an overview of the most important problems:

  • When new content is dynamically reloaded, the screen reader often doesn't know that the page has changed. The new content isn't automatically read aloud because it isn't focused or not correctly marked (e.g., missing ARIA live regions) or the focus shifts.
  • Without a visible end, there is no natural "stop point." This makes orientation difficult.
  • Many blind users structure information through headings or page sections – with endless scrolling, this structure becomes blurred.
  • Content that is visually located behind the endless scrolling area cannot be easily reached. This includes, for example, a right sidebar or a footer.
  • Using a screen reader does not automatically scroll the page. This problem occurs, for example, with NVDA: If you have the entire web page read aloud, the screen reader does not scroll the page, meaning it reads content that is outside the viewport. Regardless of this, it can happen that the page does not scroll according to the screen reader's behavior, meaning no new content is loaded because the screen reader moves through the page, but the page itself remains stationary. This happens, for example, on Facebook when you scroll through the post headings using the H key.

Keyboard Problems

Many blind users navigate using the tab key. When new content is constantly loading, the focus path becomes uncontrollably longer.

Returning to previous content becomes difficult – there is no clear "back" structure like on traditional pages.

If the page is refreshed or accidentally left, the position is lost – and the user has to start over from the beginning, without any visual cues.

How can infinite scrolling be made accessible?

When using infinite scrolling, the following should be considered:

  • Use ARIA Live Regions so that screen readers recognize new content.
  • Offer load-more buttons as an alternative (e.g., "Load More" button).
  • Set focus sensibly when new content appears.
  • Provide an alternative option for "page-by-page scrolling."
  • Structure content clearly (e.g., with headings, landmarks).
  • Offer the option to skip the section, for example, using jump marks or headings.

More on Components