Color blindness affects a large percentage of the population. Studies have shown that up to 8% of males and 0.5% of females of Northern European heritage are affected by red-green color blindness for instance. The ability to distinguish between colors gets worse with age as well.
As a webmaster, you may want to make sure that your site is accessible to visitors with color blindness, or difficulties distinguishing certain color patterns.
This gives those users a better experience on your site, and may prevent part of them from insta-closing the site when they run into accessibility issues.
Probably the best way of checking your websites quickly when it comes to accessibility for color blind visitors is to use a browser extension. Some sites and services may require more than that, but the extensions should be fine for the majority of webmasters out there.
RGBlind is a simple extension. It adds an icon to the main Firefox (or Chrome) toolbar on installation that you can click on to switch between two color blindness simulation modes.
You may switch to test Protanopia or Deuteranopia, and will notice that the color scheme of the site you are on changes immediately once you make a selection. The difference between the two forms is that in protanopia, the red retinal photoreceptors are missing, whereas in deuteranopia, it is the green photoreceptors that are missing.
Basically, what the test does is simulate color blindness, so that you can see how a color blind person would see the website.
Dalton for Chrome adds tests for eight different types of color blindness to the browser. Simple navigate to the website that you want to check for accesibility, click on the extension icon, and select one of the available types (Achromatomaly, Achromatopsia, Tritanomaly, Tritanopia, Deuteranomaly, Deuteranopia, Protanomaly, Protanopia)
The extension pains the colors of the site accordingly, so that you can verify what works, and what does not.
You need to click on each type separately to test them all. An option to rotate through all types automatically would be useful, but is not provided.
Another browser extension for Google Chrome that you may use to test a site#s accessibility for the color blind.
It works almost identical to Dalton above: click on the icon, select one of the available types, and watch as the site's color scheme gets modified accordingly by the extension. Supports the same eight types as Dalton.
Colorblind test extensions for Firefox and Chrome are helpful to webmasters and designers, as it allows them to test a site's or design's accessibility. The extensions are easy to use, and it should not take longer than a couple of minutes to run initial tests to find out how well, or not, the site displays for visitors affected by the various types of color blindness.
Now You: are you color blind? Are there many sites out there that don't show up correctly for you?Advertisement
Advertising revenue is falling fast across the Internet, and independently-run sites like Ghacks are hit hardest by it. The advertising model in its current form is coming to an end, and we have to find other ways to continue operating this site.
We are committed to keeping our content free and independent, which means no paywalls, no sponsored posts, no annoying ad formats or subscription fees.
If you like our content, and would like to help, please consider making a contribution:
Ghacks is a technology news blog that was founded in 2005 by Martin Brinkmann. It has since then become one of the most popular tech news sites on the Internet with five authors and regular contributions from freelance writers.