Synopsis
The current language and documentation version switcher on the Django documentation site is not accessible via keyboard navigation. This means users who rely on keyboard inputs or screen readers cannot interact with it effectively. This project aims to make the switcher fully accessible by implementing proper focus states, keyboard navigation, and ARIA attributes.
Benefits to the Community
- Improves usability for people with disabilities.
- Enhances keyboard accessibility, aligning Django’s documentation with WCAG 2.1 standards.
- Ensures better compliance with accessibility best practices.
Deliverables
- Enable keyboard navigation using tab, arrow keys, and enter for selection.
- Ensure dropdown options are accessible without requiring hover.
- Add ARIA roles and labels for screen reader compatibility.
- Provide a visible focus state for better usability.
- Update documentation on accessibility improvements.
Technical Details
- Modify the existing JavaScript handling the dropdown to support keyboard events.
- Use
aria-expanded
,aria-labelledby
, andaria-live
attributes for better screen reader support. - Apply CSS for visible focus indicators.
- Test across browsers and screen readers like NVDA and VoiceOver.
Expected Outcome
A fully accessible language and version switcher for Django documentation that allows seamless keyboard navigation and improves usability for all users.