WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: accessibility issue in infinite scrolling

for

Number of posts in this thread: 8 (In chronological order)

From: Musthafa KP
Date: Wed, May 28 2014 8:30AM
Subject: accessibility issue in infinite scrolling
No previous message | Next message →

Hi all
I'm working on a web app which uses infinite scroll for pagination. How can
I enable this interaction to screen reader? What approach should I follow
to make it available to popular screen readers like nvda/jaws. Any help is
highly appreciated.

Thanks
mkp

From: deborah.kaplan@suberic.net
Date: Wed, May 28 2014 8:33AM
Subject: Re: accessibility issue in infinite scrolling
← Previous message | Next message →

Are your designers open to the idea of infinite scroll being an option? For example, in the search engine Duck Duck Go, infinite scroll is the default users can turn it off and replace it with standard pagination. As long as this option is easy to find, this might provide the best compromise for usability. (Infinite scroll is not just an accessibility issue; a lot of usability folks find failures in infinite scroll in user testing, depending on the application.)

-Deborah Kaplan

On Wed, 28 May 2014, Musthafa KP wrote:

> Hi all
> I'm working on a web app which uses infinite scroll for pagination. How can
> I enable this interaction to screen reader? What approach should I follow
> to make it available to popular screen readers like nvda/jaws. Any help is
> highly appreciated.
>
> Thanks
> mkp
> > > >
>

--

From: Jesse Hausler
Date: Wed, May 28 2014 3:53PM
Subject: Re: accessibility issue in infinite scrolling
← Previous message | Next message →

On a PC with a standard browser, we do infinite scrolling. In general if
you navigate near the end of the page the scroll will occur. It doesn'
matter how you get there, whether its by tabbing there, dom traversal,
jumping by heading and so on.

On iOS, you wan to avoid divs with overflow hidden. That will make iOS
VoiceOver see a single page.. and scrolling will only work if you flick
through the dom.

On Android with its spiffy 2 finger scrolling, pretty much anything goes.
Scroll to the bottom and more will load. The location indicators will even
update. So "Showing 1 to 10 of 20" will change to "Showing 10 to 20 of 30"
as appropriate.

Jesse


On Wed, May 28, 2014 at 7:33 AM, < = EMAIL ADDRESS REMOVED = > wrote:

> Are your designers open to the idea of infinite scroll being an option?
> For example, in the search engine Duck Duck Go, infinite scroll is the
> default users can turn it off and replace it with standard pagination. As
> long as this option is easy to find, this might provide the best compromise
> for usability. (Infinite scroll is not just an accessibility issue; a lot
> of usability folks find failures in infinite scroll in user testing,
> depending on the application.)
>
> -Deborah Kaplan
>
>
> On Wed, 28 May 2014, Musthafa KP wrote:
>
> Hi all
>> I'm working on a web app which uses infinite scroll for pagination. How
>> can
>> I enable this interaction to screen reader? What approach should I follow
>> to make it available to popular screen readers like nvda/jaws. Any help is
>> highly appreciated.
>>
>> Thanks
>> mkp
>> >> >> >>
>>
>>
> --
> > > >

From: Musthafa KP
Date: Wed, May 28 2014 10:12PM
Subject: Re: accessibility issue in infinite scrolling
← Previous message | Next message →

Thanks for your quick response.

Will it be a good experience if I put page indicator "Showing 1 to 10 of 20"
into a *aria-live *region? So the screen reader will announce as you scroll
down.


On Thu, May 29, 2014 at 3:23 AM, Jesse Hausler < = EMAIL ADDRESS REMOVED = >wrote:

> On a PC with a standard browser, we do infinite scrolling. In general if
> you navigate near the end of the page the scroll will occur. It doesn'
> matter how you get there, whether its by tabbing there, dom traversal,
> jumping by heading and so on.
>
> On iOS, you wan to avoid divs with overflow hidden. That will make iOS
> VoiceOver see a single page.. and scrolling will only work if you flick
> through the dom.
>
> On Android with its spiffy 2 finger scrolling, pretty much anything goes.
> Scroll to the bottom and more will load. The location indicators will even
> update. So "Showing 1 to 10 of 20" will change to "Showing 10 to 20 of 30"
> as appropriate.
>
> Jesse
>
>
> On Wed, May 28, 2014 at 7:33 AM, < = EMAIL ADDRESS REMOVED = > wrote:
>
> > Are your designers open to the idea of infinite scroll being an option?
> > For example, in the search engine Duck Duck Go, infinite scroll is the
> > default users can turn it off and replace it with standard pagination. As
> > long as this option is easy to find, this might provide the best
> compromise
> > for usability. (Infinite scroll is not just an accessibility issue; a lot
> > of usability folks find failures in infinite scroll in user testing,
> > depending on the application.)
> >
> > -Deborah Kaplan
> >
> >
> > On Wed, 28 May 2014, Musthafa KP wrote:
> >
> > Hi all
> >> I'm working on a web app which uses infinite scroll for pagination. How
> >> can
> >> I enable this interaction to screen reader? What approach should I
> follow
> >> to make it available to popular screen readers like nvda/jaws. Any help
> is
> >> highly appreciated.
> >>
> >> Thanks
> >> mkp
> >> > >> > >> > >>
> >>
> >>
> > --
> > > > > > > >
> > > >

From: Olaf Drümmer
Date: Thu, May 29 2014 1:57AM
Subject: Re: accessibility issue in infinite scrolling
← Previous message | Next message →

I can't tell you whether that is a good idea in principle, but in case you decide to go for it - don't hide it away via aria, make it some plain text based info somewhere anyone can see and read. Not all people with a disability are blind or screen reader users. Do not disable non-blind people…

Olaf


On 29 May 2014, at 06:12, Musthafa KP < = EMAIL ADDRESS REMOVED = > wrote:

> Will it be a good experience if I put page indicator "Showing 1 to 10 of 20"
> into a *aria-live *region? So the screen reader will announce as you scroll
> down.

From: deborah.kaplan@suberic.net
Date: Thu, May 29 2014 8:09AM
Subject: Re: accessibility issue in infinite scrolling
← Previous message | Next message →

As Olaf said, many people with accessibility needs are not using
screen readers-- and making an indicator such as that visible is
a usability win for all of your users, disabled or otherwise.

Keep in mind cognitive disabilities as well. If somebody
activates a link from your infinite scroll, and then uses the
browser "back" button, will they return to a place that seems
logical to them (e.g. where they were when they clicked the link
in the first place), or will they come back to a confusing screen
(e.g. the top of the infinite scrolling page, with the selected
link no longer viewable until they reactivate the infinite scroll
the right number of times)?

Deborah Kaplan

On Thu, 29 May 2014, Musthafa KP wrote:

> Thanks for your quick response.
>
> Will it be a good experience if I put page indicator "Showing 1 to 10 of 20"
> into a *aria-live *region? So the screen reader will announce as you scroll
> down.

From: Jesse Hausler
Date: Thu, May 29 2014 2:45PM
Subject: Re: accessibility issue in infinite scrolling
← Previous message | Next message →

It's probably a personal choice, but i wouldn't add "showing 1 to 10 of 20"
on your own using aria or otherwise. If the semantics of the content
provide that to assistive technology (such as with a listview on Android)
then so be it.

I would however add aria-live or something that inherits aria-live to your
loading indicator. That will let screen reader users know that more content
is being added to the page.

Jesse


On Wed, May 28, 2014 at 9:12 PM, Musthafa KP < = EMAIL ADDRESS REMOVED = > wrote:

> Thanks for your quick response.
>
> Will it be a good experience if I put page indicator "Showing 1 to 10 of
> 20"
> into a *aria-live *region? So the screen reader will announce as you scroll
> down.
>
>
> On Thu, May 29, 2014 at 3:23 AM, Jesse Hausler < = EMAIL ADDRESS REMOVED =
> >wrote:
>
> > On a PC with a standard browser, we do infinite scrolling. In general if
> > you navigate near the end of the page the scroll will occur. It doesn'
> > matter how you get there, whether its by tabbing there, dom traversal,
> > jumping by heading and so on.
> >
> > On iOS, you wan to avoid divs with overflow hidden. That will make iOS
> > VoiceOver see a single page.. and scrolling will only work if you flick
> > through the dom.
> >
> > On Android with its spiffy 2 finger scrolling, pretty much anything goes.
> > Scroll to the bottom and more will load. The location indicators will
> even
> > update. So "Showing 1 to 10 of 20" will change to "Showing 10 to 20 of
> 30"
> > as appropriate.
> >
> > Jesse
> >
> >
> > On Wed, May 28, 2014 at 7:33 AM, < = EMAIL ADDRESS REMOVED = > wrote:
> >
> > > Are your designers open to the idea of infinite scroll being an option?
> > > For example, in the search engine Duck Duck Go, infinite scroll is the
> > > default users can turn it off and replace it with standard pagination.
> As
> > > long as this option is easy to find, this might provide the best
> > compromise
> > > for usability. (Infinite scroll is not just an accessibility issue; a
> lot
> > > of usability folks find failures in infinite scroll in user testing,
> > > depending on the application.)
> > >
> > > -Deborah Kaplan
> > >
> > >
> > > On Wed, 28 May 2014, Musthafa KP wrote:
> > >
> > > Hi all
> > >> I'm working on a web app which uses infinite scroll for pagination.
> How
> > >> can
> > >> I enable this interaction to screen reader? What approach should I
> > follow
> > >> to make it available to popular screen readers like nvda/jaws. Any
> help
> > is
> > >> highly appreciated.
> > >>
> > >> Thanks
> > >> mkp
> > >> > > >> > > >> > > >>
> > >>
> > >>
> > > --
> > > > > > > > > > > >
> > > > > > > >
> > > >

From: Michael Moore
Date: Thu, May 29 2014 3:06PM
Subject: Re: accessibility issue in infinite scrolling
← Previous message | No next message

Infinite scrolling can be extremely frustrating to keyboard users. Is there
active content that you will never reach in the tab ring as the page
continues to scroll? Links in a right hand side bar or footer for example?


On Thu, May 29, 2014 at 3:45 PM, Jesse Hausler < = EMAIL ADDRESS REMOVED = >
wrote:

> It's probably a personal choice, but i wouldn't add "showing 1 to 10 of 20"
> on your own using aria or otherwise. If the semantics of the content
> provide that to assistive technology (such as with a listview on Android)
> then so be it.
>
> I would however add aria-live or something that inherits aria-live to your
> loading indicator. That will let screen reader users know that more content
> is being added to the page.
>
> Jesse
>
>
> On Wed, May 28, 2014 at 9:12 PM, Musthafa KP < = EMAIL ADDRESS REMOVED = > wrote:
>
> > Thanks for your quick response.
> >
> > Will it be a good experience if I put page indicator "Showing 1 to 10 of
> > 20"
> > into a *aria-live *region? So the screen reader will announce as you
> scroll
> > down.
> >
> >
> > On Thu, May 29, 2014 at 3:23 AM, Jesse Hausler < = EMAIL ADDRESS REMOVED =
> > >wrote:
> >
> > > On a PC with a standard browser, we do infinite scrolling. In general
> if
> > > you navigate near the end of the page the scroll will occur. It doesn'
> > > matter how you get there, whether its by tabbing there, dom traversal,
> > > jumping by heading and so on.
> > >
> > > On iOS, you wan to avoid divs with overflow hidden. That will make iOS
> > > VoiceOver see a single page.. and scrolling will only work if you flick
> > > through the dom.
> > >
> > > On Android with its spiffy 2 finger scrolling, pretty much anything
> goes.
> > > Scroll to the bottom and more will load. The location indicators will
> > even
> > > update. So "Showing 1 to 10 of 20" will change to "Showing 10 to 20 of
> > 30"
> > > as appropriate.
> > >
> > > Jesse
> > >
> > >
> > > On Wed, May 28, 2014 at 7:33 AM, < = EMAIL ADDRESS REMOVED = > wrote:
> > >
> > > > Are your designers open to the idea of infinite scroll being an
> option?
> > > > For example, in the search engine Duck Duck Go, infinite scroll is
> the
> > > > default users can turn it off and replace it with standard
> pagination.
> > As
> > > > long as this option is easy to find, this might provide the best
> > > compromise
> > > > for usability. (Infinite scroll is not just an accessibility issue; a
> > lot
> > > > of usability folks find failures in infinite scroll in user testing,
> > > > depending on the application.)
> > > >
> > > > -Deborah Kaplan
> > > >
> > > >
> > > > On Wed, 28 May 2014, Musthafa KP wrote:
> > > >
> > > > Hi all
> > > >> I'm working on a web app which uses infinite scroll for pagination.
> > How
> > > >> can
> > > >> I enable this interaction to screen reader? What approach should I
> > > follow
> > > >> to make it available to popular screen readers like nvda/jaws. Any
> > help
> > > is
> > > >> highly appreciated.
> > > >>
> > > >> Thanks
> > > >> mkp
> > > >> > > > >> > > > >> > > > >>
> > > >>
> > > >>
> > > > --
> > > > > > > > > > > > > > > >
> > > > > > > > > > > >
> > > > > > > >
> > > >