🎁 Download all our marketing resources for FREE. Dozens of eBooks, 100s of email templates, and more →

Email Accessibility Guidelines: Standards & Best Practices

Take a look around, listen to what’s going on. Do you see everything clear, in full-color mode? And you hear noises and voices well? Congratulations, you’re certainly a lucky person. Moreover, you’re actually a really happy one.  You have vision and hearing!

You may think these abilities are common and given by default to everyone? What if I tell you that 4.5% of recipients in your contact list are suffering from color blindness, so it’s difficult for them to read or understand your email content?

Though color blindness is not the only widespread disorder. Just a bare fact: 285 million people around the world suffer from severe visual impairments that make seeing a problem even with contact lenses or glasses. 

And 5% of the Earth’s population have hearing impairments. In other terms, over 360 million.

That’s something to think about. We cannot ignore all those people. We must do our best to be friendly to them, and to make their life better. This is what accessibility is all about. 

Now, make yourself a cup of tea or coffee, and let’s dive into the details.

What does email accessibility stand for?

There are people who suffer from severe visual disorders or even complete blindness. They are using screen-reading software to vocalize inbox emails — VoiceOver, Microsoft Narrator, and other similar tools. Therefore our duty is to adjust our content to these assistants. 

When it comes to color blindness, from protanopia (when people cannot distinguish certain colors) to monochromacy — there are no tools that help people with these conditions. So we have to optimize email imagery ourselves.

Others are suffering from hearing impairments, dyslexia, etc. Consequently, there are sets of accessibility rules for each type of disorder. Thus we came to the answer to a question in the heading.

In a nutshell, it means sticking to standards that make emails readable for people with all types of special requirements. Fortunately, modern HTML email template builders and other marketing software provide us with advanced tools to implement these standards quite easily and with no special skills.

I’m gonna share these standards below, as well as some practices that will be helpful to create accessible emails.

Accessibility standards

So, dear friends, it’s time to explore one by one these sets of recommendations we need to follow in order to send out “universal” emails that will be easy to read for recipients with all types of visual, hearing, and perception malfunctions.

1. Color blindness

There is a list of color blindness types. Here they are:

Protanopia means defunct perception of the red color. Readers with protanopia, aka red-blind people, tend to confuse black color with all the shades of red. They also cannot distinguish dark brown from dark green and see no difference between blue color and mid diapason of red. Take a look at this email from Uber:

Stripo-Email-Accessibility-Red-Original-Image

And this is how recipients with protanopia see it:

Stripo-Email-Accessibility-Red-Test

Deuteranopia is a reduced perception of green. These people also tend to confuse mid red/green diapason, bright green/yellow, and light blue/lilac colors. Again, take a look at the same email: original on the left, and deuteranopia version on the right.

AcreliaNews

Tritanopia means blindness to blue color and its shades. This is why those who suffer from this impairment typically confuse light blue/gray, and dark purple/black. The same email sample, but you can see the tritanopia perception of it on the right:

Monochromacy is for total color blindness. These people can see the reality painted only in black, white, and varying shades of gray. No other colors. Just imagine the world on the screen of a very old TV set. This is how monochromacy looks like. Seriously, it gives me goosebumps.

Green-Button
Original campaign from Wufoo
Green-Button-on-Red example
The same email through the eyes of monochromats

What should we do?

  • Choose the font size for email copy no less than 14 px. However, I recommend 16px to provide recipients with accessible email design;
  • Avoid contrast solutions based on colors that color-blind clients may not distinguish. For example, don’t write your copy with green or blue text over a red or lilac background. Look at the message below. It’s OK for people with full diapason of colors perception… but is it as good in the case of protanopia or monochromatic vision? I don’t think so…
Accessibility-Green-Red

(original message)

Red-Test-Dots

(this is how clients with protanopia will see it)

Monochromacy example

(the way monochromats see this message)

How should they understand whether their favorite team won or lost the match?

  • Forget the idea of adding green buttons over red pics, or vice versa. The same is true for all the “risky” color combinations mentioned above. The idea is really bad — people with color perception malfunctions may not notice the button at all;
  • Always specify the product’s color in brackets — clients may not distinguish, for example, red color but they know that red shirts or dresses match their image perfectly;
  • Make links in your emails bold.

Yeah, regular blue color for links text is not enough. And not only because of color-blind recipients. Have you ever read emails in the street when the sun shines mercilessly right onto the smartphone screen? Then you know what I mean — it’s hard to distinguish colors at all. So make links bold, and don’t underline them. Why? Because underlining may distract people with dyslexia. We’ll talk about dyslexia in detail a bit later.

Bold-Links in email

In this email, menu items are bold too. This simple idea optimizes the customers’ navigation within the newsletter — they will easily find the desired category of apartments.

Notice the “View detail” link with an arrow. It says that you may see more details by clicking it;

If you add interactivity elements or run tests in your campaign, choose green/deep red/light blue colors to highlight the correct answers. And red/black/grey respectively for wrong respectively. Be sure to duplicate yes/no answers with text.

It’s really essential to check if the email fits the requirements of people who suffer from a color deficiency. For your convenience, I’d like to add this table to our post. Save it to find the matching colors and avoid confusion:

Types of color blindness graph

There’s also a free color blindness simulator tool that shows your pics the way color-blind recipients will perceive them. 

As we can see, color testing is not too complex — just don’t ignore it. Show your care for all the subscribers. Be good.

2. Blindness and severe visual impairments

The next chapter is dedicated to accessibility standards for blind and partially sighted persons. These rules are all about visual disorders too, but the principles and solutions here are totally different. No color schemes or contrast combinations may help in this case. This aspect of accessibility science is based on using screen reading software.

Consequently, our mission is to adjust our emails to these tools. In other terms, we have to make emails legible for these tools.

What should be given special attention here?

Email subject

Typically, screen readers start reading an email from its subject.

So the commonly accepted rule is simple yet effective: make your subject line brief and descriptive. A good subject should explain the core essence of the message.

Language settings

It’s really important to configure language settings in the email copy. This task requires some effort and work with email copy but it’s worth it. The matter is that email text vocalized by screen readers may sound terrifying if you ignore these settings. Something like conversations of orcs from Lord of the Rings 🙂 

To avoid this, specify the respective language in the email code (if available).

Logical order

Screen readers have a strict order on how to vocalize emails. They read containers and blocks from the left to the right and then proceed with the next line.

To provide accessibility, specify header tags like <h1>, <h2>, <p>, etc in HTML code. These tags will add priority over regular text, so these elements are vocalized first.

Headline-in-Email

Also, the font size doesn’t matter when tags are specified. In the example above, the heading 2 font size is 24px, and the normal copy font is bigger — 27px. But screen readers will vocalize heading 2 first.

Alt text

AI technologies are developing steadily today. But screen reader tools are still not smart enough to “look” at the pics in the email and describe them. Maybe in the near future… As for nowadays, these utilities can only read alternative text aka Alt text we add to images. 

How to adjust alt text to accessibility standards? You guessed right, it’s pretty obvious: make this text concise, descriptive, and informative. One helpful note: avoid the “image” word in this text. The image tag already specifies it, so it will be kind of weird to hear the duplicated “image image…” 🙂

Links should be as concise and informative as possible. Add clear text to them and remember that screen readers will transform this text into voice! Let recipients know what you offer them and where they’ll go by click.

Just look at these links:

Long vs short link example

The first link… uh… seriously, I fear to imagine how creepy it will sound. While the second one clearly specifies the website, publication date, and the post title.

The same is true for CTA buttons and social media icons. In fact, these items are hyperlinks, too, just wrapped in aesthetically appealing visual shape. Every skilled email marketer pays the closest attention to them, works on design and effects, chooses perfect color solutions to generate clicks…

But when it comes to screen readers and accessibility for blind persons, the only important thing here is text. Make it catchy enough to complete its mission — compel subscribers to click the button.

This is how we see the CTA button in the email:

CTA Button

But screen reading tools don’t give a flying duck about all our designer tricks and marvelous hover effects. All that software sees is the bare text. Nothing else. So make sure your text works on its own.

Regarding social media icons, some subscribers who “listen” inbox emails may not understand the abbreviations we apply to these icons. So write descriptive alt text for these items.

That’s all about blindness. Just one more important note: screen readers are widely used today not only by people having severe visual disorders. Millions of recipients are listening to their inbox emails when they are busy, in the street, in the car, etc. So this aspect of accessibility is even more vital than one could imagine. 

3. Dyslexia

People who suffer from dyslexia tend to confuse the order of letters in the text, despite the normal IQ level.

Stripo-Email-Accessibility-Dyslectic-Readers-New-Screen

Here are practices of accessibility for dyslexic recipients based on the post published by the British Dyslexia Association

  • Avoid underlining links. As I already mentioned a bit above, make your links bold instead of underlining them;
  • Don’t begin a new sentence at the end of a line. The new sentence should be a new line respectively;
  • No CAPS LOCK if you need to highlight/emphasize a certain idea — use the bigger font instead;
  • Forget the center-alignment — only by the left side of the screen;
  • White background may distract dyslexic recipients, cream colors are softer and don’t make difficulties;
  • End all sentences with a period (.), you should also use semicolons when there are bullet points in email copy.

4. Deafness and partial hearing

For people with hearing impairments, there’s one single standard. All the videos embedded in your emails should be equipped with subtitles or text descriptions.

Adding Subtitles_Captions to Emails

Just don’t rely on the automated subtitles provided by Youtube and other video hostings. They are often, eh eh… to put it mildly, far from ideal. And in some occasions are even on the verge of schizophasia.

Email accessibility top tips

I’ll end up with our review of the best accessibility practices today. As we can see, this aspect of email marketers’ work is really essential. Consequently, never skip the accessibility testing before clicking the “Send” button! Check your campaigns with the aforementioned color blindness simulator, send the test email to all the available devices, and listen to them with different screen readers.

Now let’s briefly recap the key points of this post. How to provide accessibility?

  • Choose different colors to create a contrast scheme to prevent confusion;
  • Write clear and descriptive subject lines;
  • Never forget about alt text, add it to all the imagery;
  • If the GIF animation has an educative role, provide readers with a detailed description;
  • Don’t use different languages in one email because screen readers can work only with one single language at a time;
  • Check the meaningfulness of your links;
  • Align text by the left side;
  • Create your newsletters and triggered emails with true love. Care about all your subscribers.

I sincerely wish you all the best. Spread care and kindness all around!

4.8/5 from 228 reviews
4.9/5 from 158 reviews
4.9/5 from 155 reviews
4.91/5 from 154 reviews

Meet your new marketing automation platform

Customer messaging tools don’t automate workflows outside your product and marketing automation tools are bad at behavior emails. Encharge is the best of both worlds — a marketing automation platform built specifically for startups and digital businesses.

“Encharge helped us visually redesign our onboarding flow resulting in a 10% increase in our trial activation rate."

camille-photo
Camille Richon
Founder Payfacile
See why Encharge is different
Use Cases
Marketing automation
Create user journeys that convert, onboard, and retain customers.
Lead nurturing
Nurture email leads into trial users and customers.
User onboarding
Boost product activation and guide your users to value faster
Trial conversion
Smart marketing automation and behavior-based emails to double your trial conversion.
Success Stories
Landbot automates the onboarding for 80,000+ users while saving 320 hours/month
Samdock reduced the cost and time spent on acquiring a new customer by 77% with Encharge
Aito reduced the time for implementing behavior-based emails from hours to minutes
laptop
SaaS
Convert, onboard, and retain more customers. Grow your MRR with marketing automation for SaaS.
meeting
Agencies
Build advanced marketing automation flows for your clients and grow your agency faster than ever before.
document-2
Content creators
Bring your subscribers in Encharge and nurture them into customers with automated email sequences.
opening-times
Subscription businesses
Create targeted messages and automation flows for recurring-revenue businesses.
automated-logistics
Productized services
Automate your services and focus on the important parts of your business.
Flow builder
Create remarkable user journeys with a robust and easy to use visual flow builder.
Broadcasts
Send targeted one-off newsletters to your whole audience or a segment of people.
Behavior emails
Send targeted emails when people do or don’t do something in your app.
User segments
Create user segments with the market’s leading segmentation for SaaS.
User profiles
See the people behind the actions and access the full view of your customer data.
Email personalization
Get your users to act with highly-personalized emails.
Email editor
Design beautiful mobile-ready emails without any HTML skills.
A/B tests
Drive email engagement with A/B tests for your Broadcasts and your Flows.
Lead scoring
Identify interested users and best-fit customers and proactively reach out to them.
Website tracking
Track page visits and form submissions on your website in real-time.
verified
Free email verification
Free email verification for all your contacts in Encharge, on all plans.
Transactional emails
Send emails like password reset, payment receipt, and single sign-on link from your app.
Facebook Logo
Facebook
HubSpot Logo
HubSpot
Calendly Logo
Calendly
Typeform Logo
Typeform
Slack Logo
Slack
Intercom Logo
Intercom
Mailchimp Logo
Mailchimp
Salesforce Logo
Salesforce
Zapier Logo
Zapier
Pabbly Logo
Pabbly
Integrately Logo
Integrately
Stripe Logo
Stripe
Chargebee Logo
Chargebee
Chargify Logo
Chargify
Recurly Logo
Recurly
Paddle Logo
Paddle
Twilio Logo
Twilio SMS
Webhooks Logo
Webhooks
Segment Logo
Segment
API Logo
API
Google Analytics Logo
Google Analytics
SyncSpider logo
SyncSpider
KonnectzIT logo
KonnectzIT
ThriveCart Logo
ThriveCart
+38
More
Blog
In-depth guides, and practical tips for first-timers, marketing experts, and everyone in between.
logo-facebook
Facebook Group
A community for all things Encharge-related.
Knowledge base
Learn how to use Encharge.
window-dev
Developer Docs
Tools for developers.
thumb-up
Feature Requests
Request new product features.
Product Updates
Latest Encharge updates and news.
crown
Premium Services
Our experts, your project. Get your flows built for as low as $350/month.
b-check
Encharge Experts
Get help from trusted Encharge consultants and service providers.
books
Resource Library
Get access to all of our eBooks, webinars, blueprints, cheatsheets, and more.
artificial-brain
Generate Subject Lines with AI
Create unique subject lines with the only free AI email subject line generator based on GPT3.
logo-slack
Slack community
Talk to the Encharge team in real-time.
Affiliate Program
Earn up to 30% recurring commission referring customers to Encharge.