WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Tab navigation for non-interactive content?

for

From: JP Jamous
Date: Oct 28, 2016 3:27AM

Patrick,

Funny you mentioned this. I was in a meeting with UX and UI managers yesterday and I think my recommendations were not welcomed by all of my audience.

I was complaining about labels that were used as radio buttons. The devs completely masked them as radio buttons. As we were debating that, one thing came up that I took in consideration as I try to be open minded. A radio button is a radio button, you cannot style it with round corners or square ones or make it look cool. To achieve that desirable outcome they do that with Divs and other elements.

Of course, JAWS and NVDA were having issues with the focus. JAWS would repeat the text a few times stating unselected and selected. So go figure out what status the radio button is in. NVDA, on the other hand, would not state anything as I up or down arrow through the list. However, visually it was changing between the radio buttons because of the tabindex that was applied to the label. In other words, it is receiving keyboard commands and not necessary NVDA commands.

We settled on ensuring that devs do not approach this concept like that anymore. Stick to proper semantic.

I continue to run into buttons and links and all kinds of elements that are masked as another element. Personally, I think it is pathetic. We have DOM elements that we are masking as other DOM elements.

I wish W3 would come out with an update for HTML 5 and add an element called object and that can be only to create a custom control. That way browsers can provide keyboard access to it, SR manufacturers can provide support for it and so on.

Trust me, we are not the only folks who are unhappy with that approach. SEO managers frown big time on things similar to that as they backfire on SEO.

I hope we can overcome this issue someday.

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Patrick H. Lauke
Sent: Thursday, October 27, 2016 5:04 PM
To: <EMAIL REMOVED>
Subject: Re: [WebAIM] Tab navigation for non-interactive content?

On 27/10/2016 20:04, Erik Conrad wrote:

> I know that having a tabindex on non-interactive content is not a best
> practice and may be unexpected or annoying for users who normally use
> the keyboard to navigate, but as someone with experience in UI design
> but new to accessibility, it seems like a fair trade off. I would
> greatly appreciate any opinions about how wrong (or right?) I am about that.

Coincidentally, I've just recently pushed a change to the W3C HTML5.2 editor's draft specifically warning that authors SHOULD NOT add tabindex values greater or equal to zero to non-interactive elements.
https://w3c.github.io/html/editing.html#the-tabindex-attribute

Some discussion on this change here:
https://twitter.com/stevefaulkner/status/789885665253163008

Generally, it's confusing for keyboard users in general (as by default only interactive controls/widgets receive focus). It's further problematic for users of assistive technologies, as these non-interactive elements, when focused, also lack a sensible role (since they're non-interactive, and usually are <div>s, <span>s or similar that don't get any special announcement of role by AT).

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