Accessible Email is for Everyone

What is Accessible Email?

As defined by Really Good Emails,¹ accessible emails are ones "that your recipients can access regardless of disabilities.” And with the World Health Organization estimating that over 1 billion consumers—or 15% of the global population—live with some form of disability,² it’s something you should probably be paying attention to. To keep your communications inclusive and accessible, be sure to consider how they’ll be perceived by the following groups:

• The visually impaired, ranging from having to wear glasses to color blindness and full blindness.
• The cognitively impaired, impacting very young or elderly users, or those with a mental disability.
• The motor-impaired, including those who have difficulty moving their hands or those with a situational impairment, such as a broken arm.¹

Looking to up the inclusivity of your brand’s emails? We’ve outlined some impactful, easy-to-implement email design and development enhancements you can make to improve accessibility.

Clear Hierarchy Using Semantic HTML

Using larger fonts for headlines and a smaller style for paragraph text can help define the hierarchy of content within your email. Likewise, the application of font styles, such as bold, helps important information stand out. Though this fundamental best practice should always be considered, it’s especially pertinent for visually impaired users who are assisted by screen readers. These devices use semantic HTML tags to distinguish the hierarchy of the content. Developers should be cognizant of applying semantic code to define headers (<h1>), paragraph styles (<p>), and so on, to help listeners better navigate emails.³

Minimum 14px Text

As a best practice, email font size should be a minimum of 14px. Anything smaller than this can be difficult for users to read. (For reference, this blog post uses 16px Open Sans Regular). Be sure to test the font you are using and increase the size if needed, especially when using a lighter weight.³

Left-Aligned, Concise Copy

For longer blocks of text, left-justified copy is recommended. This acts as an anchor, making it easier for all your subscribers to follow along. Copy blocks should also be kept concise. At ERGO, we suggest keeping them around 50–75 words to keep subscribers engaged.

Color Contrast

Make sure to consider the contrast ratio between your text and the background. Those with poor vision or color blindness may have a hard time distinguishing text with low contrast. A greater contrast ratio will improve accessibility and enhance the overall aesthetic for readers. In compliance with the Web Content Accessibility Guidelines (WCAG) 2.0, an email design should have a minimum contrast ratio of 4.5:1.³ Need a visual? See below for a few examples.

Don’t Rely on Color

Color can be a great asset to enhance an email design, but it shouldn't be the primary method of communication. Similar to low contrast, visually impaired subscribers may have difficulty accessing a message if color is the only way it's communicated. If you're using color to indicate text links, be sure to use a bolder font or underline to help represent clickability.

Alt Tags for Images

As a best practice, live HTML is recommended for email copy rather than text embedded on imagery. For subscribers who rely on assistive devices or have images turned off, your email message may get lost if you don’t use alternate text to accurately describe imagery. If there’s new information or important context included within imagery, set alt text as needed. If images are purely aesthetic, there isn't a need to provide alt text as it doesn't provide any additional value.

Make Clicking Easy

Ensure that your calls-to-action are usable by all your subscribers. Create links and buttons large enough to be clicked easily. Help avoid user frustration by keeping ample whitespace around CTAs so a user doesn't accidentally tap another link.⁴

To further enhance the user experience, links should clearly indicate to the user where the link leads. Avoid generic language like "Click Here," as this lacks context for all users.⁵

Use Accessible Tables

Basic HTML edits can enhance accessibility for your subscribers who rely on assistive devices. By including the role attribute, role=”presentation,” to all your tables used for layout purpose, these devices will skip over the semantic markup, allowing the user to focus on the email content.⁵

Set the HTML Language Attribute

Language attribute informs assistive technology about which language profile to use for content. This results in the appropriate pronunciation of your content, allowing for a better experience for subscribers.⁵

Test Your Emails

Most importantly, test your emails across multiple email clients and with actual users.