Top
Web Design

Web Design for Color Blind Users

If you are not color blind, chances are you don’t think about this problem very often. People who live with colorblindness, on the other hand, have to think about it all the time. Before we get into ways for web designers to create better websites for color blind users, let’s spend a little time understanding color blindness better.

 

8% of men and 0.5% of women (of Northern European descent) are colorblind. This might make it sound like color blindness is a condition with identical symptoms between different cases. This is not the case. Color blindness has a whole range of color perception symptoms. For instance, some color blind people see almost normal ranges of color spectrum, while a small percentage see only in black and white.

 

Color blindness comes from a common flaw in the gene that causes the creation of color receptor Cones in the human eye. The cones are the color receptor bodies (rods detect blacks, whites, and shade contrasts). This gene is found on the X chromosome, meaning that for men (who have one X and one Y chromosome) if the gene on the one X chromosome is flawed, they will be color blind. Women have two X chromosomes, so if the gene on one isn’t working correctly, chances are that it is functioning properly on the other chromosome.

 

That’s why more men have color blindness than women. Color blind individuals usually have trouble telling certain colors apart, especially if they are at the same brightness level. One common sort of color blindness causes people to see greens, yellows, and oranges as basically the same color. The only way to distinguish them is to see that one color is lighter or darker than another (in terms of closeness to white or black, not saturation of the color itself). This last point offers clues about how to design for color blind users.

 

It is important for web designers to create websites that don’t use difficult colors right beside each other, especially if they are at similar levels of lightness/darkness. This is especially true of the color of text. Text that isn’t colored in a way that color blind people can see will be invisible, swallowed up by the background color is sits upon.

 

Variations in lightness and darkness are helpful, but there is another easy way to help color blind users navigate a website. Shapes and textures offer helpful clues when navigating a website. They offer clues that colors can’t, and which color blind users can perceive without difficulty. If you think that a color scheme may be problematic for a color blind user, consider altering the texture, not the colors.

 

If you are concerned about the usability of your website for color blind users, do some research on the topic. It is a surprisingly deep topic, and one that you will need to master if you are to create designs that become widely used. After all, if 8% (potentially) of your users can’t use your website, is it really a good website?

Daniel Bailey
  • David R

    Great article.
    I’ve recently tried to download and use the ColorOracle software for Windows. As I recall the release date was 2010, and the software would not run.
    I hope it’s been updated. Please check and ensure the link is as helpful as it once was.
    please add it to your list of articles on Accessibility: https://www.logoglaze.com/animated-video/

  • Mark Good

    I am a graphic designer in a Professional Logo Design USA company. In this article the writer has done a tremendous job by posting some precious matter for the young and inexperienced designers.

  • Sarah Burj

    yes, it is the most in demand web designing technique used to be practiced by every web designer. Almost 2.7 million people in this world are color blind according to the WHO survey reports, and we at Our responsive web designing company in uae aim to provide and create such designs which are user friendly and well optimized for best user experience.

  • Yeah I am really agreed with this articles, all site being designing should be inspected and audited this way to make a perfect UX for the user and visitors. Now, the Website Designing Services are heavily focusing on such parameters.

  • Damir Radovic

    I never actually thought about this, I’m sure UX designer have :D Great point of view and no one should suffer (not being able to see the website’s content) because of the color blindness. Also, it makes me think about photography (hobby photographer here :) ) – it would be an interesting project, to make a series of photos for color blind people (of course, without the use of Photoshop :) )