You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
When reviewing #1736 I noticed an odd interaction: keyboard navigation through the mobile sidebar eventually gets you to the "ReadTheDocs Ethical ads", then tabbing further will focus the first landmark on the main page --- but the main page is still (partly) obscured by the slide-out sidebar and by the dimming layer over the part of the main page that is still visible. Moreover, once focus is on a main-page landmark, pushing Esc no longer works to collapse the sidebar.
Is there an a11y / WCAG standard for how to handle overlays / slideout menus?
My instinct is that the sidebar should automatically collapse when tabbing beyond its last element... but that could be a bit annoying because if you accidentally overshot, you couldn't immediately Shift+Tab to "go backwards" to where you just were --- you would have to start over at the hamburger menu to tab through to the items in the sidebar again.
Another possibility would be to have tab focus loop back to the beginning of the sidebar, such that the only way to get "out" of the sidebar would be to hit Enter (follow a link) or hit Esc (send the "close sidebar" command). Again: if there's an industry standard we should just do that. If not, folks can weigh in on these two ideas and/or suggest better alternatives.
The text was updated successfully, but these errors were encountered:
I think one could argue that our mobile sidebars are a form of modal dialog. If so, then we should probably follow that pattern, which states: Tab and Shift + Tab do not move focus outside the dialog.
I think one could argue that our mobile sidebars are a form of modal dialog. If so, then we should probably follow that pattern, which states: Tab and Shift + Tab do not move focus outside the dialog.
What happens at the end? Does focus cycle back to the first element in the sidebar?
It seems both of these follow the modal-like pattern where one tabs through all the items then tabs to the x or Close button. Which seems to be the general recommendation I have also seen for modals.
So for PST it would mean adding an equivalent close button/component.
Edit: I did not check if pressing Esc exits the sidebar in the examples above but that is I believe also the default for modals.
When reviewing #1736 I noticed an odd interaction: keyboard navigation through the mobile sidebar eventually gets you to the "ReadTheDocs Ethical ads", then tabbing further will focus the first landmark on the main page --- but the main page is still (partly) obscured by the slide-out sidebar and by the dimming layer over the part of the main page that is still visible. Moreover, once focus is on a main-page landmark, pushing
Esc
no longer works to collapse the sidebar.Is there an a11y / WCAG standard for how to handle overlays / slideout menus?
My instinct is that the sidebar should automatically collapse when tabbing beyond its last element... but that could be a bit annoying because if you accidentally overshot, you couldn't immediately
Shift+Tab
to "go backwards" to where you just were --- you would have to start over at the hamburger menu to tab through to the items in the sidebar again.Another possibility would be to have tab focus loop back to the beginning of the sidebar, such that the only way to get "out" of the sidebar would be to hit
Enter
(follow a link) or hitEsc
(send the "close sidebar" command). Again: if there's an industry standard we should just do that. If not, folks can weigh in on these two ideas and/or suggest better alternatives.The text was updated successfully, but these errors were encountered: