Press "Enter" to skip to content

Accessibility Shorts: Colour Contrast

This website with 'blurry vision' enabled in ChromeScreen capture of this blog in ‘Blurred Vision’ mode

Our accessibility webinar this week was really useful. They demonstrated the Color Contrast Checker I mentioned last time in more detail and showed how it can be used across applications and web content, and then explained a bit about the science behind contrasting colours and how the W3C derived the contrast ratios which we use.

Most strikingly impressive though was a demonstration of Chrome’s ‘Emulate Visual Deficiencies’ tool which is somewhat buried in their Developer Tools. I had to DuckDuckGo for a guide on how to find it, but you can just click this link. In the screenshot I’ve posted here you can see what my website looks like with ‘Blurred vision’ emulated, and the tool can also emulate various types of colour blindness.

Don’t forget that Chrome and Google are still evil and don’t care about your privacy though. Firefox also has a developer tool for accessibility called the Accessibility Inspector, it’s just not as striking and impressive as Chrome’s emulator. Hopefully they’ll steal the idea.

Leave a Reply

Your email address will not be published.