Why your colour contrast matters (and how to test it)

Hi again,

There’s no video this week, as Loom trashed the file 🤦‍♂️
If I manage to re-record it, it’ll be on the site later. But for now - let’s talk about colour contrast.

Good colour contrast is one of the easiest accessibility wins you can have.
Simple to get right - but still one of the most overlooked.

In fact - the 2025 report on the accessibility of the top 1,000,000 home pages found that 79% still had colour contrast issues. So fix yours, and you’re already in the top 21% 😉

But who does poor colour contrast actually affect?
Well - most of us actually!

Poor contrast can affect anyone who’s colour blind, or has low vision. It also affects customers browsing in bright light on their phone.

If your text blends into the background, your customers won’t see it - and if they can’t see it, they can’t act on it.

Go deeper: You can read more about what the colour contrast ratios mean, and how they affect people: https://davedavies.dev/blog/wcag-colour-contrast-explained/

Here’s a real example of what poor colour contrast looks like in practice:

How to test your own site

Pop your product page into Google’s pagespeed insights and it’ll quickly highlight the colour contrast failures it can spot - though text sitting over an image or a gradient will often slip past it, so check those by eye.

But manual testing is important too:

• Are your search boxes clear when focused?
• Do your headings sit over light images or pale backgrounds?
• Are promo banners readable, or do they fade into the design?

You can test if your brand colours pass the colour contrast guidlines directly at colourcontrast.cc.

Remember: every small frustration adds up for your customers. Make it as easy as possible for people to see, read, and buy.

I’ve got another real-world accessibility example lined up for next week - and fingers crossed Loom behaves for that one.

Talk soon,
Dave

P.S. - Let me know if you have any colour contrast questions! I read every reply.