WebAIM - Web Accessibility In Mind

E-mail List Archives

Misuse of TabIndex 0

for

From: Sailesh Panchang
Date: Jul 7, 2017 7:35AM

Michael,
Does this not directly contravene SC 2.4.3: '...focusable components
receive focus in an order that preserves meaning and operability'?
If there are non-focusable elements with tabindex=0 or just empty tab
stops between focusable elements, will users not be confused i.e.
meaning and operability are impacted by a disappearing focus
indicator?
SC 2.4.7 only requires operable elements to have a focus indicator so
it will be a contravention of this SC if a non-focusable element with
tabindex=0 has a visible focus indicator. And as others suggested, in
this case it will fail SC 4.1.2 as the role is misleading.

Users need to be 'allowed to keep track of their location' [1].

Yes , tabindex=0 used to be suggested to ensure instructions placed
within form fields were not missed by SR users (as a hack) in order
to meet old S508 para (n) of 1194.22 before ARIA.

References:

1. From Understanding Guideline 2.4
https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechanisms.html
:
The intent of this guideline is to help users find the content they
need and allow them to keep track of their location.
Navigation has two main functions:, the first being: 'to tell the user
where they are'

2. From Understanding SC 2.4.3:
"For example, a screen reader user interacts with the programmatically
determined reading order, while a sighted keyboard user interacts with
the visual
presentation of the Web page. Care should be taken so that the focus
order makes sense to both of these sets of users and does not appear
to either of
them to jump around randomly".

3. Link to 'Giving focus to an element' referred to in Understanding SC 2.4.3:
See Section 17.11 on https://www.w3.org/TR/html401/interact/forms.html

Thanks and regards,


On 11/5/15, Moore,Michael (Accessibility) (HHSC)
< <EMAIL REMOVED> > wrote:
> Far more people than just screen reader users use tab navigation to move
> through a form. Adding unneeded tab stops to make everything on the form
> readable through the tab ring does a disservice to those users and provides
> screen reader users and others. It implicitly implies that all of the
> tab-able objects have a role of active. Far better to use aria-labelledby
> and aria-described by to make sure that critical information is not lost to
> a screen reader user. See comments on this thread from Steve Faulkner and
> Paul Adam.
>
> Modern screen reader software has an auto forms mode allowing the use of
> reading keys to navigate a form rather than just tabbing through. I am not
> saying that you would never use tab-index of 0 on a static object. There may
> be a rare use case when it is the only way to make an object accessible. But
> if the only purpose of tab-index 0 is to make sure that a screen reader user
> cannot avoid reading the instructions then you are denying them the same
> opportunity that anyone else has to ignore the instructions. It may be that
> they have already filled out the form 10 times before and don't need to read
> the instructions again.
>
> Much better form design is to use headings to define sections of a form and
> provide the instructions for each section immediately after the heading and
> before the fields start. Screen reader users will receive information about
> the number of headings when the form opens and will know that there are
> multiple sections. I could even see using aria-describedby or aria-label on
> the last field in a section to notify a screen reader user that this is the
> end of the section. This would be unobtrusive for other users and would not
> adversely impact the tab-order or the implicit roles of the objects in the
> form.
>
> Mike Moore
> Accessibility Coordinator
> Texas Health and Human Services Commission
> Civil Rights Office
>
>
>