Colorblind users. It’s something that not every designer has considered when creating images and web experiences. About 5% of women and 8% of men are colorblind. This term tends to make it sound like all “colorblind” people see the world in exactly the same way, but as with most things in life, one size doesn’t fit all with colorblindness.
Colorblindness: Understanding the Cause
Recognizing the problem in its core is the first step towards making an impovement in your design’s colour structure.
Most people are able to perceive color in a normal range. Human sense of color is derived from the presence of “Cones” in the eye. Cones are sensitive to color, while the more numerous Rods are sensitive to light, allowing humans to see when there isn’t much light present. Rods outnumber Cones many times over. And while cones are in the minority, their function is no less important. If someone is deficient in cones of a specific color, or their cones aren’t working right, they will not be able to distinguish between colors the way someone with “normal” vision would be able to.
What does this mean for graphic designers?
When creating a design, which needs to surve a bigger audience, you need to pay attention to this small, yet valuable part of the users, who will inevitably struggle to use your website the way it’s intended to.
Remember the McDonalds logo? I mean, who doesn’t, right?
Actually, Earth’s largest restaurant conglomerade has a slight blemish in its logo, which sometimes makes it hardly visible for people with a certain type of colour blindness. Don’t get us wrong, we totally love those crispy fried, but the issue here is different. When the contrast is not high enough, what users will see is a barely visible “m” and they’ll pay more attention to the white, contrasting text rather than the company’s symbol.
But this is just a case of the extremes. Most people will clearly distinguish the difference in the colors’ brightness of the yellow and red elements, and this is exactly what designers need to have in mind when creating their projects.
The World in #FFFFF and #00000
Sometimes, colorblindness can be so extreme that a very small percentage of the affected wound’t be able to perceive color at all, instead viewing the world in black and white. This is the exception, not the rule. Most colorblind people just don’t have the visual “repertoire” that most people do. So what does this have to do with you and your designs?
Making a user-friendly desing in terms of colorbliness is a rather easy task when you have the right tools for the job. Being well-informed and prepared for job will make creating designs for colorblind users feel like a breeze. All you need to do is follow those rules.
Work With Shades, Not With Color.
We’ve all played games like Zuma and its modern mobile equivalent, Bejeweled. There are many other games like those out there, but that’s not what’s important. All these games have a certain visual feature in common which could make enjoying an joyful afternoon of visually matching a set of pretty gems a rather dull activity for colorblind people. You guessed it – it’s color!
When not having a clear contrast between the different colors, making a difference would be a quite tiresome task. The same rule, which applies to video game and interaction design, goes for graphic design, as well.
Colorblind people have a hard time differentiating different tones of the same color from one another. For example, if you have a box that goes from a one tone of the colour to another without creating a clearly distinctive contrast it wouldn’t be quite visible. When scroling over it, the colorblind user may not be able to perceive the difference.
If your site has many responsive actions which rely mainly on color, this can limit the functionality for 8% of your male usership, rendering some sites totally incomprehensible.
Yet, this barely scratches the surface of creating a user-friendly web design which is particularly created to serve people with colorblindness. Without creating a clear distincion between colors even people with “normal” vision woudn’t be able to see your designs clearly.
Here is an example.
Both pictures clearly represent a mind-boggling combination of colors which make your mind endlessly jump from one shade to another, trying to distinguish and memorize a clear image. Unfortunately, the best that these color palettes can do is make your eyes hurt!
This is exactly what happens to colorblind people when they try to focus on an image which is not well-optimized for all vision types. Horrible, isn’t it?
But what’s most troubling is that regardless of not being entirely compiled by such colors, your design might still give your users a headache when the optimal color contrast is not well-measured.
Contrast is Everything.
Using the right contrast in your design, be it a black & white or color-rich, you’ll be able to create an interactive design which is easy on the eyes and still helps your users surf through intuitively.
Other colorblind individuals have problems telling apart different colors that are about the same brightness. For example, if you have a dark forest green beside a dark navy blue ( not that any of you would have such a weird color combination ), those colors might appear to be identical to the colorblind user. There are other issues that afflict people of this type, but these are the two most common.
So what are you able to do to alleviate these difficulties and make your work usable by the highest percentage of the populace?
Being conscious of color and brightness, especially to keep two similar color / brightnesses from being directly beside one another, is a start. But you can also put useful contrasts through problem colors.
For instance, a simple textured line pattern that appears on a box when someone scrolls over it will demonstrate to all users that some functionality has been initiated, you colorblind users included.
The design has to account for different faculties of users in this way, in a way that something developed in Schema.org would not. This doesn’t mean that design shouldn’t account for these difficulties.
Colorblindness is a common problem, and you’ll make the world a better place by creating experiences that are useful to people with this visual difficulty.