Improve legibility of text with low contrast

[Aloso]

Motivation

The W3C recommends for text to use a contrast ratio of at least 4,5:1 for good legibility and at least 7:1 for users with moderately low vision.

This is especially relevant for this website, since because of the flashy colours, the eyes can get tired faster. This website uses text with as little contrast as 4,53 : 1, so it's unsuitable for anyone who does not have perfect eyesight (which includes me):

Solutions

I have some ideas for how this can be improved:

• Make the reddish and greenish colours slightly darker
• Add a subtle text shadow to improve the contrast

This image is divided into a part without shadow and a part with a shadow (0 0 5px #00000044, screenshot from Chromium). The shadow is too subtle to stand out, but it might improve legibility. Of course, making the background darker would be more effective.

• Use black text on a white background for the majority of the text. A coloured background could still be used for the header, the footer, for headlines, buttons, icons, etc., but not continuous text.

---

PS: I confused my browser tabs and accidentally filed this issue on blog.rust-lang.org, too. I'm sorry.

[ashleygwilliams]

Hi @Aloso ! Thanks for filing- these types of small changes are exactly what we are looking for. I would happily accept a PR to start address this! Feel free to play around with it and we can coordinate in a Work In Progress PR :) Thank you for the thoughtful issue!

[Aloso]

@ashleygwilliams Thanks for the response. I created a PR.