blob: bca6fbf8ac7543503ef92606f0d1d9b6e11a9ea1 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
Accessibility
=============
Baseline
--------
The current frontend already uses semantic landmarks such as ``main``,
``section``, and ``article`` in key routes. Several icon buttons include
accessible labels, and theme-aware colors are centralized through design
tokens.
Required Practices
------------------
* Give icon-only controls an accessible name.
* Preserve visible keyboard focus for custom controls.
* Keep text readable in both light and dark themes.
* Use semantic elements before ARIA.
* Do not hide essential navigation or status only behind animation.
* Validate empty, loading, success, and error states for forms.
Review Checklist
----------------
.. list-table::
:header-rows: 1
:widths: 34 42
* - Check
- Expected Result
* - Keyboard navigation
- Header, menus, buttons, form controls, and links are reachable.
* - Screen reader labels
- Icon-only actions have clear names.
* - Contrast
- Text and UI states remain readable in light and dark modes.
* - Layout
- Text does not overlap or overflow at mobile and desktop breakpoints.
* - Feedback
- Form errors and success states are visible and announced where needed.
Known Follow-ups
----------------
* Improve visible focus states for all custom controls.
* Audit icon-only social and action links.
* Add reusable empty states for posts and tags.
* Add visual regression coverage for critical routes.
|
