Accessibility — WCAG AA / RGAA Compliance

[mbenadda]

Richie is not accessible

Richie is not RGAA/WCAG compliant. This is a problem for us because we want to support all users. This of course starts, but does not end, with compliance with those norms.

An professional audit of Richie was done in mid-2019 that pointed out a lot of issues. Some of them have been fixed since then. This issue exists to list the work that remains to be done to achieve RGAA/WCAG AA compliance.

Note: this issue should evolve over time to track our progress towards an accessible Richie.

What needs to happen

Text contrast

Colors in Richie are somewhat all over the place and most of the color pairings outside of black-on-white fail the minimal required 4.5 contrast ratio (although a value closer to 7 is preferable for regular-sized text).

This is in part dependent on theming for the final result but Richie needs a general overhaul of its color system, and needs to have acceptable color pairings by default.

• [ ] overhaul color management in Richie to simplify the use of accessible pairs
• [ ] make sure Richie comes with accessible colors by default

Automated testing

We know automated testing can only catch ~30% of possible accessibility problems. We still think this is valuable as these are parts we can get for "free" (it's pretty easy to fix issues surfaced by automated testing and prevent regressions).

It can also prevent some regressions over time as long as we make sure to include it in the CI process.

• [x] integrate an automated end-to-end testing tool (eg. cypress) with axe to start running automated checks
• [ ] add a Makefile command to easily run these checks on any developer machine
• [ ] create a CI job that runs these checks including a11y testing