WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Where do single page applications fail WCAG2?

for

From: Lynn Holdsworth
Date: Feb 10, 2015 3:38AM

Thanks Patrick.

I did think about 4.1.2, but wondered if I might be trying to shoehorn
a square peg into a round hole.

And as for focus order, the focus seems to go to the first link in the
document, which is where it would go if a whole new page were loaded,
so I'm not sure I can fault them on that.

What I really want to fail them on is something around AT not being
alerted to the fact that new content has loaded. JAWS for one isn't
always great at refreshing its off-screen model, and in this case it
tells me that I'm still on the Login button, which doesn't exist in
the newly loaded view.

Best, Lynn

On 10/02/2015, Patrick H. Lauke < <EMAIL REMOVED> > wrote:
> On 10/02/2015 10:00, Lynn Holdsworth wrote:
>> I'm looking at a single-page application which, when I press the Login
>> button, loads a whole new set of main content, essentially a new page,
>> without alerting screenreader users or moving the focus to somewhere
>> appropriate.
>>
>> I understand what's wrong with this scenario and how to fix it, but I
>> can't find where it fails under WCAG2. Someone please tell me it does
>> fail!
>>
>> I'd really appreciate any concrete info on which checkpoint(s) I
>> should fail this under.
>
> 2.4.3. Focus Order would be a good start. Generally, if new content
> appears and the focus is programmatically moved to it, screenreaders
> will take it from there. If the focus isn't moved, or is reset/lost to
> the start of the document, the order is inherently wrong/illogical.
>
> Depending on the specifics, 4.1.2 Name, Role, Value may also play a part
> here (to make sure controls expose their correct role, alerts/dialogs
> are correctly identified, etc).
>
> P
> --
> Patrick H. Lauke
>
> www.splintered.co.uk | https://github.com/patrickhlauke
> http://flickr.com/photos/redux/ | http://redux.deviantart.com
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> > > >