Screen reader issues with admin navigation sidebar
There are three issues with the admin’s toggle-able sidebar nav for screen reader users:
- Its toggle button doesn’t set
aria-expanded to indicate its state. This is important so people can tell whether the current state is "opened" or "closed".
- The sidebar is wrapped in a
<nav> landmark (good!) but that landmark should ideally have a label set with aria-label="{% translate 'Sidebar' %}" so users can more easily decide whether this is the part of the UI they want to go to.
- The sidebar shouldn’t be navigable when closed (to replicate the experience of sighted users). This is because we’re preventing navigation by setting
tabindex="-1" on the sidebar interactive elements. Instead, we should set the whole region to display: none or visibility: hidden when closed.
Change History
(5)
| Triage Stage: |
Unreviewed → Accepted
|
| Has patch: |
set
|
| Owner: |
changed from nobody to Gloib
|
| Status: |
new → assigned
|
| Patch needs improvement: |
set
|
| Patch needs improvement: |
unset
|
| Triage Stage: |
Accepted → Ready for checkin
|
| Resolution: |
→ fixed
|
| Status: |
assigned → closed
|
patch created here