WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: How Screen Reader should read Single Page Application?


From: glen walker
Date: Jul 29, 2018 10:46AM

Hi Pratik,

Whether someone uses a screen reader or not, there are certain behaviors
that will be expected when clicking on a link.

1. I'll be taken to a new page
2. I'll be taken to another location on the current page
3. I'll be taken to the next step in a "wizard", which could be a new page
or could be content updated on the same page (single page app)
4. If the link looks or sounds like a tab, I'll expect just different
content on the same page (and hopefully my focus does not move - ie, my
focus should still be on the "tab")

In your example, if "contact us" were just an in-page link that took you to
a section of the page that had email, phone, address info, or a form for
submitting a question, I wouldn't expect page title and the rest of the
page to be read. It depends what kind of link it is. For a sighted user,
if they see "contact us" as the link text and they don't look at the
browser's status bar to see where the link points to, then they won't know
whether to expect a new page load or to be scrolled to a different part of
the current page. It really doesn't matter. As long as the browser's
"back" button takes them back to where they were before.

If a screen reader says "contact us, link", then I still don't know if I'm
going to a new page or somewhere on the current page, but again I will
expect the browser's "back" button to work.

If I'm going through a wizard or single page app and I hear "next, link", I
would also expect the "back" button to work. If I hear "next, button",
then I'd expect something to happen on the current page and the browser's
"back" button doesn't come into play.

My point is that you were concerned that the user might not know the link
is an in-page link. Most users, whether sighted or not, do not know if a
link is an in-page link. If they see or hear a page load, then they know
they went to a new page. If they see or hear new content elsewhere on the
page, then they know they just scrolled. With a single page app, neither
of those behaviors really happen. A sighted user's visual focus stays
right where it was but part of the page updated. As Jared said, that same
expectation should be conveyed to a screen reader too. Keep the "eye
focus" where it was but put the "screen reader focus" on the new content.

Why "fake" the user into hearing a page title read again (even if the title
changed) when all you're doing is updating part of the page? If you do
that, mimicking a page load, then I would expect the browser's "back"
button to take me to the previous step.

If you still have concerns, you can create some prototypes that do
different behaviors and test them with real users.

On Sun, Jul 29, 2018 at 12:43 AM, pratik roy < <EMAIL REMOVED> >

> Hi Jared,
> Thanks for your reply.
> I understand your point, treating those links as same page link and moving
> the focus to start of changed content would solve my problem to some extent
> but my doubt is, what if screen reader can't recognize the link as same
> page link. In that case, when user click on a link, for example, 'Contact
> us' link, don't you think, they would expect a page load and other screen
> reader behavior associated with a that, like start reading 'Contact Us'
> page title and the rest of page content?
> That is the reason, I am still little bit reluctant to move the focus to
> start of the changed content. Accordingly to me, if we move the focus to
> the beginning to the page and also make the page title read automatically
> then that would give better user experience. Obviously this would not give
> the essence of single page application but they will get the experience as
> per the expectation. This is my thoughts. Kindly let me know your thoughts
> on this.
> Thanks & Regards
> >
> > ---------- Forwarded message ----------
> > From: Jared Smith < <EMAIL REMOVED> >
> > To: WebAIM Discussion List < <EMAIL REMOVED> >
> > Cc:
> > Bcc:
> > Date: Sat, 28 Jul 2018 09:29:59 -0600
> > Subject: Re: [WebAIM] How Screen Reader should read Single Page
> > Application?
> > pratik wrote:
> >
> > > As the normal browser load is not happening, screen reader will not
> start
> > > reading the page content automatically but yes, I can use ARIA to make
> it
> > > read but here comes my actual question. From where SR should start
> > reading-
> >
> > Using an ARIA alert or live region would not be optimal. While it
> > would cause the text content to be read, it would be read as a stream
> > of information devoid of semantics and structure. The user would not
> > be able to pause/play of further explore the content, or interact with
> > elements within it - unless they manually go find where that content
> > is on the page.
> >
> > It would be best to set focus to the new content area so the screen
> > reader will begin reading and navigating there. You indicated that the
> > user is clicking on a link, so the best solution is to treat this as a
> > link - essentially a same-page link.
> >
> > Thanks,
> >
> > Jared