Tech Hive

When you say accessibility, what initially comes to your mind? More often than not, you’d think about making your site accessible to the blind, right? Well that is not always the case. In making your site accessible, you have to think of various ways to accommodate the needs of certain groups or groups that are to be your main audience. I will touch one of the ways to make your site accessible and that is color contrast.

Ensure that foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen. [Priority 2 for images, Priority 3 for text].

WCAG 1.0

Accessibility, having a law to back it up in the US, you’d think that a lot of designers would actually take some of their time to learn more of it, but left and right, you would still see some sites that are created to make your eyes bleed. Gray on gray? Light blue on white?

Color contrast is a huge accessibility issue because it doesn’t only concern a certain group of people but all of us. You have to admit that it does make one’s online experience painful if you’re look at a site where the colors are too close to one another you actually have to squint to make it out.

Some might say, “But that will make my site go bland!” Well not necessarily, designing, for me, is all about challenges and overcoming it. You are given a certain parameters to work with and I have to admit that I do feel great when I am able to work within that parameter and still deliver something good.

In this note, try checking your site in this handy color contrast analyzer and make your site a little more accessible today. Or, if you’re using Firefox, why not download this color contrast analyzer add-on to make everything a little easier? You’ll notice that the rows with yellow background are the ones where you need to work on. The add-on will make your life easier because it tells you where that low contrast is committed on your CSS.