Leo Laskov
By Leo Laskov on 30 Jan, 2023

Here in the UK, more than 3 million people are colour blind. That’s 4.5% of the entire population

Colour insensitivity can make it difficult for some users to distinguish hues and shades of colours.

To make email content accessible to everyone, email designs should meet certain standards to ensure that subscribers / viewers who cannot see the full colour spectrum are able to read the email.

77% of marketers say email accessibility is a priority for their brand - we investigate why this is the case, why it should be, and how you can make it a priority for your brand.

What is colour contrast accessibility?

Colour contrast accessibility in email design is about ensuring email content is accessible to all users, including those with visual impairments such as colour blindness.

The intent of the colour contrast accessibility is to provide enough contrast between text colour and background colour, so that all digital content is easily recognisable and equally accessible to all users.

How is colour contrast measured?

According to WCAG, contrast is measured by comparing the difference in perceived brightness between two colours. The colour contrast is calculated as a ratio of the relative luminance of two colours ranging from 1:1 to 21:1.

To meet these standards, email text and elements should have a colour contrast of at least 4.5:1.

Colour contrast measurement examples

Black (#000000) on white (#FFFFFF) has a ratio of 21:1. 


Blue (#0000FF) on white (#FFFFFF) has a ratio of 8.59:1.


Red (#FF0000) on white (#FFFFFF) has a low ratio of 3.99:1. 


Light grey (#FEFEFE) on white (#FFFFFF) has a very low ratio of 1:1 – this will be impossible to read. 

Contrast ratios between colours can be tested using a variety of free web tools such as:

How to use contrast accessibility in email

There are three levels of conformity established by the WCAG: A, AA, and AAA.

  • Level A – requires minimum level of accessibility.
  • Level AA – requires all text and graphics to meet the minimum colour contrast accessibility, and a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text.
  • Level AAA – requires use of very dark with very light colours and is required for email specifically designed for visually-impaired viewers. It requires a contrast ratio of at least 7:1 for normal text and 4.5:1 for large text.

Colour accessibility guidelines

Text

To meet Level AA, text should have a contrast ratio of at least 4.5:1. To meet Level AAA, text should have a contrast ratio of at least 7:1.

Headings and sub-headings, however, can have a contrast ratio of 3:1.

There are no contrast requirements for logo or banner text.

User interface elements

Drop-down menus, checkboxes, radio buttons, and slides, should have a contrast ratio of 3:1.

Graphics

Graphic elements that are required to understand the content should also have a 3:1 contrast ratio.

Avoiding colour accessibility issues in email design

Background and text

Avoid low colour contrast between text and background – for example, light grey text on white background – as it affects the readability of the email, especially for viewers with low vision or those who are colour blind.

Links and buttons

Use accessible contrast ratios for links and buttons, avoid opacity and colour changes on hover, and consider more accessible options such as underline or increase of font size.

Graphics

Use Alt text for images, as most email clients do not initially render images. Where possible, use colours that meet WCAG guidelines, use simple images, and avoid using text over complex colourful images or backgrounds.

Get closer to your customers with DCX

Here at DCX, we combine the power of data with compelling creative and digital technology to help brands connect better with their customers for better outcomes.

From digital strategy and consultancy services to creative concepts and content, we'll give you a bespoke service offering of our email marketing expertise, gained over the past twenty years.

Want to get started with better email accessibility and transforming your email campaigns to be more inclusive? Talk to us today.

Do Email. Better.

Share