WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Tab order of interactive elements

for

Number of posts in this thread: 5 (In chronological order)

From: Isabel Holdsworth
Date: Tue, Oct 02 2018 1:22AM
Subject: Tab order of interactive elements
No previous message | Next message →

Hi all,

We have a scenario where there's a question to be answered, then a
series of 3 or 4 buttons (sitewide preferences and a couple of others
that have slipped my mind), then the "Next question" button, which is
effectively the Submit button.

The navigation is consistent throughout the product, but IMHO the
elements in between the question and its Submit button are misplaced.

Would this fail against any WCAG2 test criterion? I don't think so,
but I wonder if I'm missing something?

Thanks as always, Isabel

From: Birkir R. Gunnarsson
Date: Tue, Oct 02 2018 4:58AM
Subject: Re: Tab order of interactive elements
← Previous message | Next message →

Hi

your only bet is WCAG 2.4.3 - focus order.
It only says that focus order has to be logical, best practice if it
matches the visual order of the elements on the page.

In this scenario I have filed a best practice/keyboard usability
recommendation to move the CTA (the submit button before the secondary
buttons (e.g. forgot password or cancel).
This can be hard to do, people do not want to mess around with
tabindex attributes and the order is often pretty fixed so switching
the underlying source order will require adjustments to global CSS
styles which triggers the whole set of approvals and regression
testing retesting.



On 10/2/18, Isabel Holdsworth < = EMAIL ADDRESS REMOVED = > wrote:
> Hi all,
>
> We have a scenario where there's a question to be answered, then a
> series of 3 or 4 buttons (sitewide preferences and a couple of others
> that have slipped my mind), then the "Next question" button, which is
> effectively the Submit button.
>
> The navigation is consistent throughout the product, but IMHO the
> elements in between the question and its Submit button are misplaced.
>
> Would this fail against any WCAG2 test criterion? I don't think so,
> but I wonder if I'm missing something?
>
> Thanks as always, Isabel
> > > > >


--
Work hard. Have fun. Make history.

From: Isabel Holdsworth
Date: Tue, Oct 02 2018 6:33AM
Subject: Re: Tab order of interactive elements
← Previous message | Next message →

Thanks Birkir. I have thought about 2.4.3, but I wasn't sure because
the focus does akign with the visual presentation. It's just that IMHO
both need an overhaul.

I think I'll fail it. Thank's for your help.

On 02/10/2018, Birkir R. Gunnarsson < = EMAIL ADDRESS REMOVED = > wrote:
> Hi
>
> your only bet is WCAG 2.4.3 - focus order.
> It only says that focus order has to be logical, best practice if it
> matches the visual order of the elements on the page.
>
> In this scenario I have filed a best practice/keyboard usability
> recommendation to move the CTA (the submit button before the secondary
> buttons (e.g. forgot password or cancel).
> This can be hard to do, people do not want to mess around with
> tabindex attributes and the order is often pretty fixed so switching
> the underlying source order will require adjustments to global CSS
> styles which triggers the whole set of approvals and regression
> testing retesting.
>
>
>
> On 10/2/18, Isabel Holdsworth < = EMAIL ADDRESS REMOVED = > wrote:
>> Hi all,
>>
>> We have a scenario where there's a question to be answered, then a
>> series of 3 or 4 buttons (sitewide preferences and a couple of others
>> that have slipped my mind), then the "Next question" button, which is
>> effectively the Submit button.
>>
>> The navigation is consistent throughout the product, but IMHO the
>> elements in between the question and its Submit button are misplaced.
>>
>> Would this fail against any WCAG2 test criterion? I don't think so,
>> but I wonder if I'm missing something?
>>
>> Thanks as always, Isabel
>> >> >> >> >>
>
>
> --
> Work hard. Have fun. Make history.
> > > > >

From: glen walker
Date: Tue, Oct 02 2018 10:09AM
Subject: Re: Tab order of interactive elements
← Previous message | Next message →

Is the visual order on the page (and the DOM), the question, the site
preferences, then the "next" button? If so, the focus order does match the
visual order.

But it sounds like the visual order is confusing. I think the phrases "the
navigation sequences affect...operation" and "components receive focus in
an order that preserves...operability" of 2.4.3 would apply in that case.
It seems odd to have to tab over site preferences between the question and
the "next" button, and to have to do that on every question. But it might
be hard to convince someone that that actually fails 2.4.3. It's
essentially a bad UX for all users which, weirdly enough, sometimes makes
it not an accessibility issue since it affects all users.

Glen

From: Isabel Holdsworth
Date: Tue, Oct 02 2018 11:59AM
Subject: Re: Tab order of interactive elements
← Previous message | No next message

Hi Glen,

Thanks for your comments. We've reluctantly decided that it's a UX
issue rather than a WCAG fail. Either way I'm quietly confident it'll
be dealt with in an upcoming product overhaul.

Cheers, Isabel

On 02/10/2018, glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> Is the visual order on the page (and the DOM), the question, the site
> preferences, then the "next" button? If so, the focus order does match the
> visual order.
>
> But it sounds like the visual order is confusing. I think the phrases "the
> navigation sequences affect...operation" and "components receive focus in
> an order that preserves...operability" of 2.4.3 would apply in that case.
> It seems odd to have to tab over site preferences between the question and
> the "next" button, and to have to do that on every question. But it might
> be hard to convince someone that that actually fails 2.4.3. It's
> essentially a bad UX for all users which, weirdly enough, sometimes makes
> it not an accessibility issue since it affects all users.
>
> Glen
> > > > >