I have a question about tabs (like containers, used to group information together) and tab ordering (used when pressing the tab key to move between elements on a page) in terms of accessibility and usability when used on web pages.
Since the browser will generally set the tab order to work through the elements on a page sequentially (unless
tabIndex is provided to each element) this causes some oddities in behaviour when the tab container is aligned so that the tabs go across the top of the content.
The tab container implementation is some custom thing used in a CMS package and the tab ordering feels completely unintuitive to me with the particular software I'm using.
Take a look at these crudely drawn images that contain absolutely no Comic Sans whatsoever:
Would you expect that pressing tab would first go through each tab before moving onto the content in the tab as follows:
This is in fact, the way it currently works when the tabs are aligned across the top of the content. This doesn't feel right to be at all.
Alternatively, would you expect that pressing tab would work its way through the contents of the tab before moving onto the header for the next tab, as follows?
What are the merits of both tab orders in terms of both usability and accessibility? Are there any scenarios where one works better than the other or a generally agreed standard on how these are supposed to work?