teachingtechYT / teachingtechYT.github.io

Creative Commons Attribution Share Alike 4.0 International
340 stars 125 forks source link

Suggestion: slightly change colour scheme so it meets accessibility recommendations #421

Open HelmetOwl opened 2 years ago

HelmetOwl commented 2 years ago

Some of the text on the site does not contrast well against its background on the site, which makes it difficult to read for users with some forms of visual impairment.

For example, the red text on red background here:

Screenshot 2022-07-05 at 18 07 38

The required contrast ratio is 4.5 but it only has a contrast ration of 2.81. The green text on red background is even worse, with a contrast ratio of 1.54. The white text on green background on the other parts of the page fails too.

There are colour accessibility calculators online. My favourite is accessible-colors.com, because it suggests alternative colours that bring it in line with accessibility requirements. Alternatives are: webaim.org and accessibleweb.com, which both have other web accessibility tools too.

There's a guide on accessible colour and contrast from the South Australian Government here: Colour and contrast.