Hlib Kliuiko

Why Accessibility Matters and How to Reach It in Email

When we are creating an email, first of all, we make sure that all recipients see it beautiful, understand the message, and can perform the targeted action. To do this, we adapt emails for display on mobile and desktop, test its appearance in all possible browsers and email clients.

But sometimes marketers don't take subscribers' perception characteristics into account, for example, various visual or reading impairments (color blindness, dyslexia, etc.) And according to the World Health Organization (WHO), there are 2.2 billion such people worldwide. In theory, this is about a quarter of your subscribers. To enable people with disabilities to correctly perceive and interact with the content you share in emails, take care of the accessibility of your emails.

To do this, you don't need to apply extra efforts – just remember a few simple rules. These rules won't just make your emails accessible to people with disabilities. Your content will become more logical and readable for all recipients.

Accessibility is, first of all, good usability of your emails, which means an additional benefit for the business as a whole.

Adaptation of the Email for Screen Readers

Screen readers such as Alexa and Siri have become more and more popular. And they are actively used not only by people with disabilities. For example, a quarter of Americans regularly use voice assistants.

Marketers shouldn't lose sight of the growing popularity of screen readers – they need to prepare for their emails to be heard, not viewed.

Last post

Make subject lines meaningful

Screen readers first read the name of the sender and the subject of the email. Based on this, the recipient decides whether they need to hear the entire email. Therefore, always use a recognizable name and accurately describe the content of the email in the subject line. This will improve the accessibility of your messages to people with disabilities and generally increase subscriber engagement. You can also feel free to use personalization by name and other variable data – screen readers for the blind people reproduce them.

Make templates adaptive

Typically, email layouts are based on tables. And screen readers use a certain order when playing the content of the email: they read columns from left to right and from top to bottom. If the template is not responsive, the email content may be played in a different order than it appears visually. This will break the logic of the presentation and confuse the listener. The same could happen during a normal visual reading of an email on different devices, in browsers and email clients.

To prevent this, add a special attribute to the table code:

role=”presentation”.

This HTML component tells the screen reader that it is a presentation table, not a data table so that the columns are not out of order.

role=”presentation”

If you use eSputnik templates, you don't have to worry about it: they are responsive by default, all the necessary code has already been added.

Try eSputnik Features!

Use headers

Wrap your headers with  h1, h2, etc., and separate paragraphs with p tags.

All of these tags allow screen readers to distinguish the semantic blocks of the email. Therefore, listeners will also find it easier to navigate in it. Don't rely on styling elements like font size, color, or bold italic – screen readers won't read them.

In the eSputnik editor, you can easily customize the design of all headers in the email interface, you don't have to edit the code.

eSputnik editor interface

Set the HTML language attribute

Set the language attribute at the beginning of the email HTML code: lang ="" (en, ru, or another abbreviation according to the list of HTML language codes). This code will tell screen readers in which language to reproduce the email content.

Appearance

To ensure that people with some visual or reading impairments can comfortably interact with your emails, follow these guidelines.

Use color contrast

The correct color contrast always improves the interaction with the email, but it is crucial for people with color blindness. It doesn't mean that you should only create black and white templates. Subscribers may not see correctly certain colors that you used in the email, but they should understand its main message. To achieve this:

With the help of special services, you can see how people with different types of color blindness see colors.

Different kinds of color perception

Convey important information in the text format

Make sure that all-important content in your message is presented in the text form – images should only be an addition to it.

Add informative alt text to images: most screen readers read it. In eSputnik, you can easily do this right in the editor interface.

adding alt text in eSputnik editor

Don't use too long sentences and highly specialized terms. The language of the email should be simple and understandable. A good way to test your email against these requirements is to read it out loud.

Make your text accessible

Use a font size of at least 14 pixels. The lighter the font, the larger it should be.

Add more white space to the email, try to keep paragraphs shorter and line spacing larger. All this will make reading easier for people with impaired vision.

Negative space in email

Don't center the text. This design may look more attractive (especially on mobile), but it will be much more difficult for people with dyslexia to perceive it. Alignment left is a universal option.

Make your links informative

Make sure the link text tells your subscribers where they will go if they click on it. For example, instead of linking to the word here, add a link to the text Click here to see all promotional offers. Read more on links in this article.

Be careful with GIFs

GIF images are good at grabbing attention but can cause discomfort for dyslexic and visually impaired recipients. The WCAG recommends limiting the refresh rate of GIFs to three per second. And you should avoid alternating too bright colors.

Let's Summarize

To make your emails accessible to all your subscribers, follow these recommendations:

  • The subject line of the email should exactly match its content.
  • The structure of the email should be responsive so that the logical order of the content is not broken.
  • Use semantic markup in your HTML code.
  • Before sending, listen to how Siri, Alexa, and other screen readers read your email. Check if the presentation logic is not violated and if the message is clear.
  • Create clear content that doesn't require extra visualization.
  • Use contrasting colors and large fonts.

0.0 from 5 based on 0 reviews

Hlib Kliuiko

One of the Gleb’s top priorities is to make sure your emails are delivered. The articles on validation services, email testers and deliverability you may find on our blog are probably written by him.

Comments 0

Similar Articles

16 May 2018

Interactive Email Design: Does It Have a Future?

Natalya Ustymenko

06 March 2020

Main Email Trends 2020: Design & Content

Iuliia Nesterenko

17 April 2020

6 Rules for Email Template Design

Maria Ivanova