WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: New resource showing accessibility problems of dynamic web components in many tests with users (video)

for

From: Detlev Fischer
Date: Nov 26, 2018 3:18AM

Hi Birkir,

thanks for your helpful feedback about screen reader issues with tab panels.

I have revised the text in the problems section on the tabbed interfaces
page https://accessuse.eu/en/tabbed-interfaces.html#problems

I have now included a general section "Screen reader users and tab
panels" which is more or less based on your feedback.

I have also tweaked the advice in the accessibility tips section
https://accessuse.eu/en/tabbed-interfaces.html#tips in bullet point
"Make the panel content focusable". I hope is hasn't got too wordy now,
and captures what you wanted to add.

Best,

Detlev


Am 24.11.2018 um 16:31 schrieb Birkir R. Gunnarsson:
> When a screen reader encounters a tablist element (or rather, the
> focus is moved inside a tablist element) it goes into
> forms/application mode, a mode in which screen reader navigation (with
> arrow keys / short cut keys) is unavailable).
> This makes a tabpanel element with no focusable elements more
> difficult to discover by a screen reader user because you have to
> manually force the screen reader out of forms/application mode once
> you have activated a tab.
> This is why the idea of putting tabindex="0" on a tabpanel element has
> been floated and why it kind of makes sense in this particular context
> (it's not ideal, it represents an element which is focusable but has
> no interactive properties).
>
> You don't want to use Javascript to send focus to the tabpanel as soon
> as the tab is focused. That is like having an onchange event in a
> dropdown that automatically sends focus elsewhere.
> Imagine that the tab the user wants to activate is the last in a list
> of 5 tabs. You don't want the user to have to press the arrow key,
> then shift-tab to get back to the tablist and repeat 4 times to
> activate the desired tab.
> If you implement a set of tabs where the user has to press the enter
> key to activate, you could implement it so that focus automatically
> goes to the tabpanel but if pressing the arrow key navigates to and
> activates the tab you hvae this problem.

--
Detlev Fischer
Testkreis
Werderstr. 34, 20144 Hamburg

Mobil +49 (0)157 57 57 57 45

http://www.testkreis.de
Beratung, Tests und Schulungen für barrierefreie Websites


---
Diese E-Mail wurde von Avast Antivirus-Software auf Viren geprüft.
https://www.avast.com/antivirus