Understanding The Different Types of Color Blindness - What do color blind people see? — Blue Beacon Creative

Let's Get In Touch

Understanding The Different Types of Color Blindness – What do color blind people see?

For years, color blindness has been an under-addressed subject, leading to a lack of awareness and understanding about what it means to be color blind.

However, with more information being shared online via social media, user-friendly websites are popping up everywhere to give color blind people the opportunity to see what they are missing out on when it comes to colors.

As a result, we have seen a rise in the number of people actively seeking to find out more information about color blindness and what it means for the users accessing their products every day.

What is Color Blindness?

Color blindness refers to the inability or decreased ability to see colors, usually caused by a problem in the eye or brain. For example, most people who are color blind suffer from what is known as red-green color blindness (or deuteranomaly), meaning their ability to perceive red and green shades is impaired.

Some people are only partially color blind, meaning they struggle to see specific colors, while others can see most of the spectrum. Color blindness can also be present from birth (congenital) or developed later in life due to an eye injury or illness such as diabetes.

People with color blindness see shades of gray most efficiently because they have difficulty distinguishing between greens, reds, oranges, and yellows. In short, color-blind people see the world in shades of gray.

People who are color blind can see colors, but they cannot distinguish between certain shades. For example, red looks like dark gray; green looks black, orange looks darkened, and yellow is darker than orange.

The brightness of the colors also seems to be lower for some types of color blindness. Color-blind people do see colors, but they see fewer of them, and the shades are not quite as vivid.

Color-blind people can still see colors because they still have all the photoreceptors that enable sight, known as (rods and cones). The only difference is that they don’t interpret the data the same way as people who can see the full-color spectrum.

What are the different types of color blindness?

There are several different types of color blindness. The two main categories are those with a color perception deficiency who cannot see any colors at all and those who suffer from what is known as red-green color blindness, which is the most common form of color blindness.

Take a look at this graphic. At first glance, we can notice that it relies on color to convey meaning, and for people who have the full-color spectrum, it seems easy to digest.

Figure 1 – Full color. An example of a bar chart graphic in full color that relies on color to convey meaning. The colors looked as in the original design, and sighted users can appreciate it without barriers. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 91% JAWS, 43% NVDA, 60% VoiceOver, 68% Windows Eyes.

But what happens when we take a look at it through a set of different lenses?

1. Blue Cone Monochromacy / Achromatomaly

Blue cone monochromacy is what it sounds like – a condition where an individual can only see things based on shades of gray. This form of color blindness means the blue cones in the eyes are either entirely missing or nonfunctional, leaving little to no ability to distinguish colors at all.

Figure 2 – Blue Cone Monochromacy. An example of a bar chart graphic affected by Blue Cone Monochromacy that relies on color to convey meaning. The colors are looking different from the original design and it can create confusion to color blind users. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

2. Monochromacy / Achromatopsia

Achromatopsia is much less common than red-green color blindness. The reason is that the eyes have either completely missing or nonfunctional cones, leaving only rods – the receptor cells that work in low light conditions. Because of this, a person with monochromacy can only see things as black and white, but they do have the ability to see in low light conditions.

Monochromacy is one of the color vision deficiencies that causes the most trouble in terms of accessibility since many designs rely on color to convey meaning. Therefore, a good practice to keep your web designs and applications accessible is to convert them to black and white.

If you struggle to understand the design once the color is gone, then you need to go back to the drawing board and correct the issues at hand.

Figure 3 – Monochromacy. An example of a bar chart graphic affected by Monochromacy that relies on color to convey meaning. The bars all look the same now with the colors gone. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

3. Green-Weak / Deuteranomaly

This form of color blindness falls under the red-green color blindness category, making it the most common. People with deuteranomaly (the official term) do not see reds and greens as vividly as people who are not color blind.

This form of color blindness is most often inherited, meaning if one parent has it, then there’s a 50% chance that any offspring will also have the condition.

Figure 4 – Green Weak. An example of a bar chart graphic affected by a green weak color deficiency, the design relies on color to convey meaning. The colors are looking different from the original design and it can create confusion to color blind users. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

4. Green-Blind / Deuteranopia

People with deuteranopia share the same symptoms as people with green-weak color blindness, but the impairment is even more severe when perceiving shades of green.

Because of that, colors like reds and greens look very similar to them, making it difficult to discriminate between certain shades in these categories, which can create a lot of confusion, especially in designs that rely on color heavily to convey meaning.

Figure 5 – Green blind. An example of a bar chart graphic affected by a green blind color deficiency, the design relies on color to convey meaning. The colors in the graphic are being affected by a green blind color deficiency. The green and red look very similar and purple and blue as well, making it difficult to tell the colors apart. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

5. Red-Weak / Protanomaly

People with protanomaly have the same symptoms as people with red-green color blindness, but they are less sensitive to shades of red. In contrast, they see shades of green more vividly, making it difficult for them to distinguish between shades of red and green.

Like most forms of color blindness, protanomaly can also be passed down from a parent to an offspring through genes.

Figure 6 – Red Weak. An example of a bar chart graphic affected by a Red Weak color deficiency, the design relies on color to convey meaning. The colors in the graphic are being affected by a red weak color deficiency. The colors look different from the original design. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

6. Red-Blind / Protanopia

The most common type of color blindness, red-blindness, means that people with this condition are significantly lacking when it comes to perceiving shades of red.

For people with this condition, colors like orange, yellow, pink, and purple all look the same – they all appear to be shades of gray. Like other types of color blindness, it’s also passed down through genes.

Figure 6 – Red Blind. An example of a bar chart graphic affected by a red blind color deficiency, the design relies on color to convey meaning. The colors in the graphic are being affected by a red blind color deficiency. The colors yet again look very different from the original design. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

7. Blue-Weak / Tritanomaly

Blue-weak is the least common form of color blindness, with only about 1% of men affected by this type. People who are blue weak have trouble distinguishing between shades of blue and other colors, particularly greens.

This form of color blindness, like other types of color blindness, is also passed down through genes and X chromosomes.

Figure 7 – Blue Weak. An example of a bar chart graphic affected by a Blue Weak color deficiency, the design relies on color to convey meaning. The colors in the graphic are being affected by a blue weak color deficiency. The colors look different from the original design. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

8. Blue-Blind /Tritanopia

People with tritanopia have a less severe version of the same symptoms as people who suffer from blue-weak color blindness – they have trouble differentiating between shades of blue and other colors, particularly greens.

Figure 8 – Blue Blind. An example of a bar chart graphic affected by a Blue Blind color deficiency, the design relies on color to convey meaning. The colors in the graphic are being affected by a blue blind color deficiency. The colors look very similar, and it is hard to tell them apart. The graphic reads - Percentage of users visiting a website using a screen-reader and the software they like to use. 40% JAWS, 10% NVDA, 20% Voice Over, 30% Windows Eyes.

Conclusion

In short, color blindness is a condition where someone has trouble perceiving colors like red and green. The way people with color blindness perceiver colors comes in various degrees of how this manifests.

Although there is no cure for color blindness, many treatments are available to make life easier for those with color blindness – including adjusting the lighting in their homes and workplaces and using textured patterns instead of solid colors when creating anything visual.

People who are color blind also tend to be sensitive to light, so wearing sunglasses outside during the day is often beneficial. Although there are many inconveniences for being color-blind, everyone with this condition can become much more adept at perceiving colors through training with the relevant glasses.

Creating accessible designs and applications allows everybody to navigate the web on equal footing. For example, now that you have a better idea of how people with color blindness perceive colors, you can create designs that don’t rely on color to convey meaning.

By doing that, you will be increasing your customer engagement and creating digital experiences that everybody can enjoy and use.

How would you fix the example graphic without relying on color to convey meaning? Please leave your answers in the comments below. I am curious to see how you would approach it 🙂

Please give this article a thumbs up to support more content like this. If you want more information on web accessibility, make sure you check out my YouTube channel.

Also, make sure you follow our LinkedIn page to receive notifications about new content, so you don’t miss a single article!