WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Tab Order and Focus Question

for

From: Mallory
Date: Mar 20, 2019 6:02AM

I would however argue that if someone is, for whatever reason, foolish enough to set a tabindex on a non-interactive element (such as I recently saw in the Stemwijzer here in the Netherlands), then if they do not show a focus indication, then I as a sighted keyboard user am at a loss. Where am I? Separate from the issue of having focus on things that don't seem to do anything being confusing in and of itself, I feel letting me hit Tab and not seeing anything happening is wrong. Probably double wrong if I'm using screen magnification and using Tab moves my viewport to a focussed thing which does not appear focussed.

cheers,
_mallory

On Sat, Mar 16, 2019, at 12:27 AM, glen walker wrote:
> Ahh, now I understand Jim's original question. You're asking if a
> non-interactive element receives focus (for whatever reason), should it
> have a visible focus indicator?
>
> That's an interesting question. My take on it is that it is not required
> by WCAG.
>
> 4.1.2 talks about focus but it's for "User Interface Components", with the
> definition <https://www.w3.org/TR/WCAG21/#dfn-user-interface-components>
> saying "What is meant by "component" or "user interface component" here is
> also sometimes called "user interface element"."
>
> 2.4.7 says the focus must be visible for a "keyboard operable user
> interface".
>
> So a non-natively focusable element that happens to have tabindex=0 so that
> users can tab to it, if it's not an element that can be acted upon (a user
> interface component), then it doesn't need a focus indicator according to
> the spec. (We'll ignore for the moment that non-interactive elements
> shouldn't have tabindex=0).
>
> If you use tabindex="-1" so that you can programmatically move the focus to
> the element, for example the destination of a skip link, or a heading in a
> single page app, or a modal dialog container, then since those elements are
> not interactive, they don't need a focus indicator either. That doesn't
> mean you can't do some kind of visual styling to show the element received
> focus. For example, the WebAIM site will show a focus indicator briefly
> when using the skip link even though the destination of the skip link is
> not an interactive element. The background of the element (which in this
> case is a big <div>) goes yellow then fades away. It gives you a clue that
> the focus changed. If they didn't have that indicator, it would still pass
> WCAG but it's a nice UX addition.
>
> On Fri, Mar 15, 2019 at 5:00 PM Mallory < <EMAIL REMOVED> > wrote:
>
> > Yes, including the example mentioned earlier of something with
> > tabindex="-1" and JavaScript sets focus. If the developer didn't remove it,
> > focus should be visible.
> >
> > cheers,
> > _mallory
> >
> > On Fri, Mar 15, 2019, at 9:51 PM, Jim Homme wrote:
> > > Hi,
> > > I was asking if the visual indicator for focus is the same when focus
> > > is not on interactive elements.
> > >
> >
> >
> > > > >