Tabs interface needs better way to get to panel content

[detlevhfischer]

When used with NVDA it is difficult to get from the tabs on https://design-system.service.gov.uk/components/tabs/ to the corresponding panel. Both left / right as well as up / down arrows traverse the tabs in the tablist. I suggest to consider implementing arrow down as a shortcut to move focus to the right panel content. See https://inclusive-components.design/tabbed-interfaces/ , section "A problem reading panels".

[alex-ju]

@detlevhfischer: hi, thanks for adding your suggestions, we took that article into consideration while building the component. have you done any user research around this?

[detlevhfischer]

I just tried it using NVDA and Firefox and noticed that left/right arrow did the same as top/down arrow, so that latter is not used (as I believe recommended by Heydon) to move the focus to the panel. Leaving forms mode and trying reading mode to progress to the panel often lands in the wrong one because tab and its panel are not adjacent in the source code, I guess.
I intend o include the gov.uk example in the user tests I am currently conducting and will report back on issues, if there are any.

[alex-ju]

@detlevhfischer: Both left/right and up/down arrows currently have the same effect of switching between tabs and that is mainly because the non-sighted users don't know how the tabs are being positioned (one next to each other or one under each other - horizontal/vertical tabs).

Feedback from research would be extremely valuable for us and would help us shape the component, thank you!

[kr8n3r]

closing this, as I've reopened the issue in the appropriate repository