I’m currently working on an education website with a requirement that it be accessible to as wide a range of people in the UK as possible.

There’s lots to read up on this subject, particularly on the W3C Standards website, but on this blog post I wanted to focus on just one area – colour palettes.

Choosing a clear and easy to read colour palette is crucial when designing a site like this, aside from the aesthetics and how good it looks. It’s really important to remember that a proportion of visitors may well have disabilities that hinders their ability to see the information well enough to read.

To help with this, I’ve discovered a great tool – a colour contrast checker

There’s a few of these about on the web, but I found this one the best for no nonsense and usefulness.

Picking a background colour and foreground (eg, text) colour shows quickly whether this would be a Pass or Fail in the W3C guidelines. The size of the text also has a part to play – it may fail at smaller sizes, but if it’s big enough then the contrast may be sufficient.

Using this tool was a real eye opener into how much contrast is required to pass these guidelines.