WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Interaction with tab panels

for

From: Bryan Garaventa
Date: Aug 4, 2016 1:26PM

Hi,
A quick question, is what you are building an Accordion, or a Tablist?

E.G A Tablist control includes all tabs within one parent container, and the controlled Tabpanel is outside of that container element, either positioned one on top of the other or side by side visually. Nevertheless, both containers are not nested.

An Accordion control is different however, in that the dynamically rendered content is nested within the same container element and inserted inline between the Accordion toggle elements.

Can you explain which one fits what you are doing?

The ARIA and keyboard usage paradigm will be different based on which one you are building.

Thanks,
Bryan




Bryan Garaventa
Accessibility Fellow
SSB BART Group, Inc.
<EMAIL REMOVED>
415.624.2709 (o)
www.SSBBartGroup.com


-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Vemaarapu Venkatesh
Sent: Wednesday, August 03, 2016 8:19 PM
To: <EMAIL REMOVED>
Subject: Re: [WebAIM] Interaction with tab panels

Bryan, I found interaction is perfect with tab panel in the mentioned pages by you. In the first page, tab items are selected with the focus and in the second page first tab item is expanded as soon as receiving the focus. In two pages, interaction is possible only with arrow keys inside tab panel and tab key wont take us to next tab item.
But in my case tab items are in collapsed state even after taking the focus to the tab panel and my main concern is "navigation is moving to other tab items in the list when we hit tab key when all items are collapsed". Is it fine like that.
Please refer
https://support.skype.com/en/faq/fa109/i-ve-forgotten-my-username-or-password
I am using NVDA+Firefox. Hope I am clear.
Regards,
venkatesh


On Wed, Aug 3, 2016 at 8:12 PM, Vemaarapu Venkatesh < <EMAIL REMOVED> > wrote:

> Hello all, Greetings
>
> If we consider tab panel, we should use arrow keys to interact with
> tabs inside the widget if I am not wrong.
>
>
> https://support.skype.com/en/faq/fa109/i-ve-forgotten-my-username-or-p
> assword
>
> When I interacted with the tab panel present in the above link, I
> observed 1. When all tabs are in collapsed state, I hit tab to enter
> into tab panel. Then I thought that focus moves out of tab panel to
> "Yes" button if I hit tab key once again. But navigation continues in
> tab panel i.e the other two tab items are in tab order. This behavior
> is not seen when any one of tab items is expanded.
> I feel that interaction inside the tab panel should be only with arrow
> keys but not with tab key anytime.
> 2. If I am expanding any tab item, the already selected tab item is
> not getting collapsed automatically. User has to collapse and expand manually.
>
> Whether these two behaviors are recommendable when I am interacting
> with tab panel widget.
>
> Hope you will correct me if I am going wrong with my perception.
>
> Regards,
> venkatesh
>