Almost 5% of the population is color blind. To put this into perspective, that’s roughly the same number of people who use Outlook.com or Yahoo! Mail. Yet despite this prevalence, remarkably little has been said about how to choose colors for accessibility.

To give you an idea of how email newsletters are seen by people with color vision deficiencies, we’ve simulated what a variety of email newsletters would look like to those with red-green color blindness and deuteranopia. Along the way, we’ll provide some practical tips to help you create more accessible email designs.

How common is color blindness?

Color blindness test

Can you find the numbers on these six plates? If so, then you may be fortunate enough to not be one of the 2.7 million people (4.5% of the entire population) affected by color blindness as judged by the Ishihara Test, a color perception test consisting of 24 – 38 plates like the ones above.

The reason there are so many different tests is that there are several different types of color blindness. 99% of color blind people can see some color – complete color blindness (also known as monochromacy) is actually quite rare. The most common type of color blindness is red-green color blindness, also known as protanopia. People who experience this do not see a complete lack of color where reds and greens appear, but instead, they have a harder time distinguishing the two colors from each other as the reds will look like greens.

If 4.5% of the entire population is affected by color blindness, then it is definitely something you should consider in all design projects – including email design work. And it’s especially true if your target audience is male, since 8% (1 out of 12) experience red-green color blindness, compared to 1 out of 200 women. It’s one of the reasons that Facebook is blue – because founder Mark Zuckerberg experiences red-green color blindness, thus making blue the color he sees best.

How email newsletters appear to the color blind

Designing with color blindness in mind does not mean removing color completely from the picture, but it does mean taking into consideration the areas you want to truly stand out. Let’s take an example newsletter design run through a color blindness simulator. Here’s a comparison of a very-colorful email would look to those with red-green color blindness:

As you can see, the email is still legible. The only difference is the areas with red no longer pop like they did before. And speaking of a loss of pop, look at this comparison, with the example on the right as seen through the eyes of someone who cannot distinguish greens and purplish-reds – a rarer color blindness also known as deuteranopia:

Again, while it’s still legible, it loses a lot of its contrast. It’s most especially noticeable with the text that was meant to stand out in pink. These are the things you need to know when highlighting specific portions of your email content with color, on colored backgrounds.

Best practices for designing email for color blind audiences

While the differences in how your color blind audience sees your email messages can be dramatic, designing for the color blind can be done without revamping existing color schemes. Just follow these tips:

1. Do not try to convey specific messages through color alone

Considering the above, here’s an example of what red and green selection buttons would look like to someone with red-green color blindness:

Comparing red and green color selections

The text may be helpful in distinguishing the choices, but it goes without saying that at first glance, it’s confusing as to which option you should choose. Likewise, when offering a product in a variety of colors, adding labels beneath each of the options means that someone with color blindness will have less trouble determining what to choose amongst the group.

2. Make sure text stands out on colored backgrounds.

As a general rule, you don’t want to use one shade of red text on top of another shade of red, regardless of whether you are considering design for a color blind audience. If you find the text a little difficult to read, someone who finds it difficult to distinguish reds will have troubles as well. The more contrast between your text and your background, the better for all audiences.

3. Go monochrome

While you don’t have to go black and white, sticking to one shade of color in your emails can help. Observe this original email in purple (center), with variations simulating red-green (left) and blue-yellow (right) color blindness:

As you can see, the design looks stunning. By designing monochromatically, you can easily see how well your text and calls to action stand out without wondering if one shade of color is distinguishable from another.

4. Test your email designs

In addition to the color blindness simulator that you can use to upload images to see them through the eyes of specific color blindness types, Mac users can install an app called Color Oracle. This will place a toggle at the top of your menu bar that allows you to change your entire screen resolution to that of one specific type of color blindness:

Instead of having to take screenshots, you can view your current design through a specific color blindness type and edit accordingly. It’s also a great way to preview images, especially prior to purchasing stock photography or using image backgrounds for your buttons.

Knowing how well your call to action button will stand out from your email newsletter’s background is just as important as checking the readability of your main email content. For example, if you have a green button on a red background, it will not stand out to someone with red/green color blindness. You will want to make sure, at minimum, the contrast between the button and the background are distinguishable. All it takes is adding a different color border around the button, such as the silver borders around the help and act now buttons above.

As you’re editing your emails for color accessibility, remember that the same rules can be applied to the pages you want your visitors to click through to. Don’t lose conversions because your email works for the color blind, but the landing pages they are directed to are confusing.

In summary, by considering your color blind subscribers, you’ll not only be a nice person, but increase the likelihood of everyone having the chance to read and respond to your messages as intended. Hopefully after reading this post, you’ll understand what a difference a color-accessible theme throughout your campaigns and landing pages can make.

Coming soon: Our Guide to Accessibility in Email Design

We consider accessibility to be an important topic, so have teamed up with Vision Australia on an upcoming guide on best practices for email designers. This guide will be available in the coming few weeks, so subscribe below if you’d like to be one of the first to learn how to cater for the vision impaired when creating email newsletters.

  • Mark

    Great article. People spend a lot of time worrying about email clients with 1% usage, this is a much bigger influence.

    I’ve been thinking recently about email Accessibility in relation to semantic code and screen readers. Will be great to see your thoughts in the full report.

  • Zack Lim

    Nice blog post by Ros.

    I personally have colour blind and there are times when reading a html email is frustrating for me especially when the main message is in the red/green colour.

    As like all testing, I personally feel it will be important to do A/B testing so that we will be able to know the type that gets the best response from the list of subscribers.

    Thanks for sharing :)

    Zack

  • Ros Hodgekiss

    Hi there Mark and Zack, thank you for your support! Like you, I think there should be a greater emphasis on accessibility and therefore, can’t wait to show you the guide we have in the works, sometime in the coming month. Hopefully it will give people both some awareness and insight into how to send more inclusive campaigns. Watch this space!

  • Sue W.

    I was really hoping that this article came with a simple albeit rudimentary color-accessible guide.

  • Ros Hodgekiss

    Hi Sue, could you kindly give us a few more details as to what you’re after here? We’d love to come up with more comprehensive resources on accessibility, in addition to our recent Guide to Accessibility and Email Campaigns. Feel free to reach out to us personally – we’d love to discuss this with you.

  • Paula Aranha

    That was a great post. Im currently doing a project for my Master Degree about colour blindness and it helped a lot.

    Also I’m interested to get in touch to a colour blind person that could help me with more personal information about how it feels and other things like that. If you know someone or if you are a colour blind and would be willing to help on this, i would really appreciate.

    Thank you

  • Ros Hodgekiss

    Hi there Paula, I highly encourage you to get in touch with Vision Australia, the co-authors of our Guide to Accessibility in Email Newsletters. By all means, they will be able to help you with your questions :)

Want to improve your email marketing? Subscribe to get tips on improving your email marketing delivered to your inbox.
X

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free