Email Accessibility Best Practices: 20 Must-Read Tips

This article was last updated on April 18, 2021

We know that most brands strive to shine with unique email designs in order to impress their audiences. However, not all recipients are able to enjoy a glamorous design. Moreover, some might not even understand your message. This is why email accessibility is crucial for today’s email marketing campaigns. If your email isn’t optimized for the audience with disabilities, you are already losing points.

In order to help you optimize your email for subscribers with disabilities, we’ve created a list of useful tips for email accessibility highlighting the best practices to help you cope with this issue.

Before we move on, let’s make it clear that your email must be compatible with assistive technologies which help people with disabilities read your email. The technology nowadays is quite advanced but the devices still need particular information from your email in order to transfer the information to the reader.

Some of the most popular assistive technology devices are:

• Screen readers

Most of the optimization you’ll be making for your email template would be to help screen readers “read” your email properly to the visually impaired users.

• Screen magnifiers

Also helping the visually impaired, screen magnification software makes text bigger.

• Text readers

This software helps users who have a hard time reading and understanding text. Unlike screen readers, this software doesn’t read navigations and menus, just text.

• Input devices alternatives

Such technology replaces the mouse and keyboard for users who are unable to use them. Such devices could be joysticks, eye-tracking technology, head pointers and more.

Okay, now that you are familiar with the most popular assistive technology for email accessibility, let’s move on to those tips that will help you optimize your email template for the audiences with disabilities.

1. Build your email on semantic elements

Semantic elements are elements such as <p>, <h>, <table>, <title> , <ul>, <li> tags clearly speak of the nature of the content. This means they are extremely important, so the assistive technology can understand the essence of the content and easily scan it.

NB! Have in mind that these tags may not work correctly on all email clients. Test before you send.

2. Don’t skip the <title> tag

The <title> tag says a lot about your email. This is the tag which will provide valuable context for the recipients who read your email with the help of assistive technology. Moreover, if your email is viewed in a browser, this tag sets the tab title on the webpage.

3. Avoid tagging links with <title>

The <title> tags on your links would interrupt the screen readers’ reading flow, thus making the content harder to comprehend. In result, the recipient might get confused. Instead of using this tag, simply put information as part of the text.

4. Avoid “Click here” link copy

Such a copy doesn’t bring any value and most users, with or without disabilities, wouldn’t know what to expect if they click through. Make the link copy informative, instead, so the recipients can get context before clicking.

5. Set an appropriate size for links and buttons

Some users are not able to operate a mouse precisely, and since links and buttons are the most important elements of your design, make them big enough. Regarding buttons, surround them with enough negative space, so all users can find them easy to click on.

6. Stick to an information hierarchy

Undoubtedly, the hierarchy is important for both well-sighted and visually impaired subscribers in order to understand your content. And it is crucial for recipients with cognitive or neurological disabilities.

7. Use <hn> tags wisely

Speaking of hierarchy, tags from <h1> to <h6> are the main source from which screen readers receive information about your HTML email’s hierarchy. Header tags help assistive technology navigate through the content easily.

8. Set the font size to 14px

A font size of 14px is the minimum size which allows most users to read and acquire the text without additional effort.

9. Adapt font size to smaller devices

Text can be tougher to read on smaller devices. So, use media queries to increase the font size from 14px to 16px on such devices.

10. Choose the typeface wisely

To achieve a better readability and email accessibility for both audiences with or without disabilities, pick a typeface which is evenly spaced, not too condensed and not too extended.

11. Don’t justify the text.

Also related to a better readability, stick to a left-aligned text. Justification makes text harder to read since it makes the word spacing uneven. It’s better to align your copy to the left only.

12. Stick to 50-70 characters per line

An email line from 50 to 70 characters is considered normal and is well perceived by the readers.

13. Put <alt> tags for images

A picture is worth a thousand words but for those who cannot see it, it wouldn’t mean a thing unless you tag it properly with an <alt> tag. Using <alt> tags not only describes the visionary content to the visually impaired but to all those recipients, whose email clients block the images.

14. Preview email without images

It’s quite important to see how your email template looks with images off. This way you will get a better understanding of how recipients who will not be able to see these images will perceive your email, and therefore – increase the email accessibility for those users.

15. Use null <alt> tag when necessary

If an image is not of a great importance to the user, you can simply put a null alt attribute. Such tagging “tells” the screen reader that this particular image can safely be ignored.

16. Avoid text in images

Unlike sighted recipients, those with visual disabilities wouldn’t be able to read text in images or infographics and neither would screen readers. Put all your information in the text, instead and simply use images to support this information.

17. Include a text-only option

Some users simply prefer to read a plain-copy version of your email no matter if they are disabled or not. Make sure the content is comprehensive if switched to a text-only version.

18. Use color contrast analyzers

Color contrast is incredibly important for recipients with color blindness. To make sure these users can differentiate colors in your email, test your template first by using color contrast analyzers.

19. Avoid infinite GIF loop

Some users may suffer from photo-sensitive seizures, so it’s recommended that your GIF images stop looping after 3 cycles.

20. Not all GIFs are email accessibility friendly

GIFs which flash and flicker may cause nausea, confusion, distraction and more unpleasant effects, so you’d better avoid them.

In conclusion,

Email accessibility is not an option anymore, it is a necessity. We hope we’ve been helpful with these 20 quick tips for email accessibility best practices. If you want to share something from your experience, you are more than welcome to do so in the comments below.