WebAIM - Web Accessibility In Mind

E-mail List Archives

Advice Sought for Continuous Scrolling on Retail Websites

for

From: Reckless Player
Date: Jan 25, 2015 8:11AM

Hello,

I hope this is the right place to ask my questions.
I want to encourage the local online retailers in my country to have
more accessible websites.
Consequently, I would send them specific tutorials and guides for the
needed changes to be implemented.
However, there is one point on continuous scrolling I'm not sure about.
After applying specific filters, in case of a large number of items
left in the result, different websites handle the final display
differently.
Local Amazon and eBay sites, following the global model, break up the
result into multiple pages.
However, other local online retailers put the result in a single
webpage and new items are loaded when one reaches the end of n number
of items.
This almost always causes a conflict with screen readers regardless of
the underlying JavaScript code. This includes the focus jumping back
to the top of the webpage, focus remaining at the bottom of the
webpage, and other scenarios except the scenario when the screen
reader stays at the top of the newly loaded items enabling seamless
scrolling.
The reason that these retailers load the display in a single webpage
is likely because people don't wish to click through to multiple
webpages. This is my theory of course because even as a screen reader
user, I would prefer to quickly navigate a single webpage using html
elements, rather than changing webpages.

I'm not sure how clear I was in my explanation, but here are the
questions that it all boils down to.
1. Is there a way of loading a large number of newer items (> 100) on
a webpage without losing focus by a screen reader user?
2. If so, can anyone direct me to information related to this topic?
3. If not, then is the Amazon/ eBay way of breaking into multiple
webpages the only way?

Thanks

--
Peace
RP