Making Your Website Colorblind Accessible



If you’re a freelancer with your own website, have you considered all kinds of accessibility? Is your website colorblind-accessible? Many designers and casual site creators don’t even consider the possibility of colorblind visitors to their site. However, colorblindness affects 1 in 12 men and 1 in 200 women worldwide. This means 8% of men and .5% of women may be having trouble using your website.

Luckily, there are a bunch of popular apps and online tools that can help you figure out if your site and other online content are usable for the colorblind. There is a Google Chrome extension called Colorblindly that is especially popular among web designers. How does it work? The extension uses a CSS filter that modifies color ratios on the page. The filter mimics what people with various types of colorblindness would see.

And yes, I said ‘different types’. Remember that there are different types of colorblindness, though red-green (AKA deuteranopia)is the most common. Tritanopia is yellow-blue color blindness. Achromatopsia, or total color blindness, is extremely rare, only occurring in one in 33,000 people. The lead singer of band Steppenwolf, John Kay, has achromatopsia. There are different levels of severity for each type of colorblindness, and someone can even have multiple types of colorblindness at once! This is why it’s a bit complicated for the average website creator to plan for this particular problem.

Text, charts, and infographics in particular are places where design can be optimized for colorblind folks. Using monochrome colors can help, as people of any level of colorblindness can distinguish light shades from dark shades. Colors with high contrast is also effective.

Here are some of the worst color combinations for any kind of colorblindness:

  • Red and green.
  • Blue and purple.
  • Gray and pink.
  • Blue and gray.
  • Green and brown.
  • Green and blue.
  • Green and gray.

Note that if you use highly contrasting shades of these colors together, then a colorblind person should be able to distinguish the darker shade from the light.

Even if it’s not an astronomical percentage of people affected, you’d still be practicing good site design and good business practices by using color with color vision deficiency in mind.

Leave a Reply