This repository has been archived by the owner on Feb 22, 2023. It is now read-only.
Expanding the filters sidebar does not focus a screen reader on the filters section #2182
Labels
♿️ aspect: a11y
Concerns related to the project's accessibility
🛠 goal: fix
Bug fix
🟧 priority: high
Stalls work on the project or its dependents
Problem
The desktop version of the search page has an expandable filters sidebar on the right. When the user opens the sidebar by clicking on the "Filters" button, the page focus should move to the sidebar. We have implemented this for the keyboard "tabbing" order. However, this does not help the screenreaders: they follow the DOM order (i.e., the order in which the elements are written in the code)
Possible Solutions
We could move the sidebar to the left side of the screen.
Another possible solution to try could be to use the "filters sidebar" -> "main content" order in the DOM, but switch it using CSS. Normally, using CSS for ordering is bad for accessibility, but here it would probably have an opposite effect.
Original description by @alexstine
Expanding the Filters button does not focus the user in the filtering section. Adjust the DOM order so the filtering options appear directly after the Filter button.
The text was updated successfully, but these errors were encountered: