According to Color Blind Awareness, color blindness affects 1 in 12 men (8%) and 1 in 200 women (0.5%). There are an estimated 300 million color-blind people worldwide, including Mark Zuckerberg, Bill Clinton, and Prince William!Optimizing your graphics can help make them more accessible—and that doesn’t mean banishing color from your charts and graphs either.
Contrary to popular belief, more than 99% of color-blind people can see color—just not in the same way as someone who isn’t impacted by color blindness.In this guide, we’ll break down the different types of color blindness and their special considerations concerning data visualization.
Color blindness—also known as color vision deficiency (CVD)—is a deficiency in distinguishing between different colors. It occurs when light-sensitive tissue in the back of the eye—the retina–fails to properly respond to variations in wavelengths of light, which enable people to see different colors.
Although color blindness is primarily an inherited condition, it can also result from cataracts or trauma to the eye, as well as several diseases, including Parkinson’s, Kallman’s Syndrome, and diabetes. Damage to the retina caused by aging can further cause color blindness.
According to Colblindor, 99% of all color-blind people suffer from red/green color blindness. This is further broken down into two distinct categories:
Protanopia: Also referred to as “red weakness”, individuals who suffer from this variation of red/green color blindness are unable to perceive red light.
Deuteranopia / Deuteranomaly: Also known as “green weakness”, this type of red/green color blindness renders people insensitive to green light (deuteranomaly) or unable to perceive any green light at all (deuteranopia).
People who suffer from blue/yellow color blindness have difficulty distinguishing between blue and yellow colors. This particular form of color blindness–also known as Tritanopia–is far less common than its red/green counterpart. In fact, according to the U.S.
National Library of Medicine, blue/yellow color blindness affects fewer than 1 in 10,000 people worldwide. Because Tritanopia isn’t caused by a genetic trait linked to the X chromosome, it is equally present in both men and women.
People who suffer from complete color blindness—also known as Monochromacy—are unable to distinguish between any colors at all. Monochromacy is quite rare, occurring in 1 in 33,000 people, according to color blind awareness.
Color plays a significant role in data visualization. For starters, colors are used to highlight important information, as well as illustrate relationships between various types of data. Color also plays an instrumental role in guiding the viewer’s eye. It can even be used to stimulate emotion through color psychology.
Using a color-blind-friendly palette with accessible colors doesn’t mean you need to compromise on aesthetics or strip out all the colors from your charts. By planning, you can ensure a color-blind friendly palette compliments your design, rather than clashes.
If you don’t have a pre-planned accessible color scheme, you can generate one for free using Venngage’s Accessible Color Palette Generator:
Gone are the days of mixing, matching, testing, and retesting to find a beautiful, accessible color palette. Now you can use this simple tool to generate inclusive color pairings in seconds — for free.How does it work? In two ways: Randomize.
Don’t think twice — roll the dice and generate palettes based on a random color.Generate from HEX. Input a HEX code to discover accessible palettes based on your color of choice.No matter which route you choose, you’ll see the contrast ratio of each color against black or white text. And every palette generated adheres to a contrast ratio of 4.5:1 as per the latest Web Content Accessibility Guidelines (WCAG) 2.1 AA.
In other words, the designs you create with these color combos will be compliant and inclusive.
Once you find a palette you love, simply click download. You’ll get a text file with the HEX codes for that palette and for the text color that goes with it (#ffffff for white text and #000000 for black text).Try Venngage’s Accessible Color Palette Generator for free!
Once you’ve narrowed down your color palette, you can upload your data. It’s simple with Venngage’s chart widgets. Open your chart widget, click the green IMPORT button under the DATA tab and upload your CSV file. Your chart will visualize the data automatically.
We’ve also made it easier to customize your tables now. You can present data and highlight important information without compromising the accessibility of your design.
When editing your table, you can choose the style and color of your fonts, and the background colors of your cells. You’ll find these options under the data tab. You can also organize your text to improve readability under the settings tab. Here you can choose how to align your text horizontally and vertically within each cell.
Take advantage of stylization features like these! After all, if it turns out your colors aren’t particularly suited to color blind people—and accessibility is important to you—it’s better to find this out before you’ve invested considerable time and effort in your design composition.
HOT TIP: If you’re stuck, try using a tool like Coblis, a free color-blind simulator that will give you a better sense of how your images will appear to people with color blindness.
Another reason you should plan out your color scheme beforehand is so you can avoid using problematic color combinations, some of which can make your charts or infographics completely inaccessible to color-blind people.
Color combinations to avoid for people with color blindness include: Red & green Green & brown Green & blue Blue & gray Blue & Purple Green & gray Green & black. If you’re stuck and absolutely must use one of these combinations, try making adjusting the shades so one is extremely dark, and the other extremely light—most color-blind people can detect contrast, so this likely will make things easier.
As previously mentioned, contrast isn’t an issue for most people who are color-blind. Darken and lighten your colors, respectively, to contrast more pronounced. You can also play with different hues, as well as levels of brightness and saturation.
Using patterns and textures in your design is a great way to incorporate visual elements into your design that doesn’t rely on color.
Symbols and icons are a great way to make your designs more accessible because they can visually punctuate a message, without relying on color.
Hot Tip: Venngage’s library includes over 4,000 icons you can use to make your infographics and charts more accessible.
Optimizing your info-graphics and charts for people affected by color blindness is important for both accessibility and inclusive. It’s also possible to do this without compromising the aesthetic quality in the process.
The following measures can help ensure color-blind people can engage with your designs:Selecting color-blind-friendly palettes.Avoiding problematic color combinations.Using different textures and patterns to highlight important information–not just color.Using symbols and icons to supplement color-coded messages, warnings, and alerts.Using highly contrasting color combinations.
Adopting minimalist design to help avoid unnecessary confusion.Combining all these elements will help make your designs more accessible to color-blind people. After all, the more people you can engage with, the more impactful your work will be.