Email accessibility is a topic that has gained more and more popularity over the last few years. Email accessibility entails designing and sending emails that every subscriber can read and understand, despite their visual compartment or other disabilities. In this eBook, we will walk you through why email accessibility is essential, types of assistive technologies, email components to optimize to make your email accessible, and email accessibility best practices to improve or create more accessible emails.
Why is email accessibility important?
Different levels of access to technology and data connectivity imply that all email experiences cannot be equal. Making your emails accessible will only make a better email experience for everyone or, more precisely, your targeted customers.
Address disability challenges
A Litmus email engagement report has stated that email users spend an average of 13.4 seconds on every email, which is an increase from 11.1 seconds in 2017. This extensive usage of email is highly significant for all email marketers. However, one of the less-discussed challenges in email marketing is that many subscribers face difficulty accessing email campaigns. As a growing population with disabilities find using email and interacting with brands difficult via email, making access is no longer an option but necessary.
Legal Requirements
Making email copy accessible is also considered a legal necessity in many countries. There are different disability rights and legislation intended worldwide to ensure that users with disabilities should not feel disadvantaged. There are various accessibility standards in the US, and America legislates these provisions with the Disabilities Act (ADA). Failure by brands to comply with the ADA may lead to legal penalties.
Online content accessibility guidelines
Another reason why email accessibility is essential is that brands need to ensure that their websites and email communications are compliant with Web Content Accessibility Guidelines (WCAG) by the World Wide Web Consortium (W3C). WCAG has advised that your web content and communications must be POUR:
- Perceivable: Users can perceive your content by sight, touch, or by hearing.
- Operable: Users can navigate, use, and operate your content efficiently.
- Understandable: The understandability will apply to both the interface and the content.
- Robust: Users can use your content by leveraging multiple assistive technologies.
What are assistive technologies?
Assistive Technologies help make content inclusive for all users, including those with disabilities or some impairment. These assistive technologies help partially or fully impaired people to use different interfaces, devices, websites, and emails to experience a fuller life. More recently, assistive technologies have jumped into the mainstream with the help of voice assistant-enabled devices. Some examples of impairments and the technologies that allow people with them to adapt:
- Emergency technologies include biometric monitors and emergency alerts.
- Visual technologies include screen readers, braille embossers, braille displays, magnifiers, tactile keyboards, navigation assistance, and wearable technologies.
- Hearing technologies include assistive listening devices, amplifiers, and aids, as well as voice-to-text systems.
- Cognitive technologies include systems that educate and assist memory.
- Mobility technologies include prostheses, walkers, wheelchairs, and transfer devices.
Email Components to optimize to make your email accessible
You may notice people are reading emails using a screen reader or a text-to-speech tool. If you are spending plenty of time working on your website accessibility, you should also focus on your emails to make them accessible to a wide range of customers.
Here we have suggested some quick email hacks to make emails accessible:
Make it design responsive. A responsive email helps content display optimally and read appropriately on different devices, including smartphones and tablets. The importance of responsive emails continues growing today and in the future, with enhanced mobile usage. Responsive email templates will also help users who may zoom their displays to high levels while accessing emails on their desktops.
Subject lines matter. If some of your subscribers are using screen-reader tools, you need to make sure your emails are worth reading, or they will delete your emails.
Use semantic elements. Use heading and paragraph tags on emails as you use them on your web pages to ensure every text renders correctly, and people can consume and navigate the content without issue.
Use larger font sizes. There is no stringent rule, but consider applying font sizes 14 pixels and more prominent to help many people, including some people with dyslexia or low vision.
Use Headers. If you use headers, screen-reader users can work out the hierarchy of the page.
Use Tables to present content. Use the role of “presentation” on layout tables. The use of tables to format may not be a common email practice. Make sure you add role=“presentation” to the table elements to instruct assistive technologies to read the content and ignore the table’s properties to help people who use keyboard-only access to make better sense of content.
Keep the content simple. Practice concise, simple, and understandable writing. Complex words and syntax reduce readability and drive readers away from the message you want to convey.
Balance text with images. Breaking up long chunks of content with photos can go a long way toward keeping your readers engaged and makes it much easier for some people to consume. Some of your email subscribers may understand visual messages more comfortably than long sentences or benefit from visual accompaniment to reinforce what they’re reading.
Keep a text alternative for all your images and non-text content. Around 253 million people live with visual impairment. Alt text ensures people who can’t see your image understand what it is and why it’s crucial.
Use color mindfully. Color is an essential element of branding and design, but it presents accessibility challenges when not used thoughtfully. Colors should have adequate contrast to appear to most subscribers. Ideally, colors should have a minimum contrast ratio of 4.5:1. Also, colors should not be the only way to prompt a response or convey your information. Use contrasting colors for backgrounds and text. Some colors might look nice but don’t work in terms of readability for visually impaired users.
Add captions and transcripts to your videos. We sometimes think of deaf people as the only people who benefit from captions and blind people as the only ones who benefit from transcripts. And there are other situations such as people in a public place or on a train who do not want others to hear what they are watching. Also, there are situations when people need more time to comprehend the content by reading the transcript. These are common scenarios that highlight the importance of text alternatives to time-based media. Many platforms, such as YouTube, offer auto-captioning features to edit the text to make it more accurate.
Use meaningful and essay-to-follow hyperlinks. Hyperlink text should be clear and descriptive. Instead of writing “Click here,” create descriptive text for your hyperlinks to help people choose what and how they want to engage further. Try incorporating the full title of the destination page instead of labeling your hyperlink with “click here” as these texts may not help your subscribers, especially people with visual or cognitive impairments.
Use helpful descriptions in ALT Tags within your images.
Best practices to improve and ensure your email campaigns are accessible.
Follow these best practices to make sure your email content can be accessible to all your subscribers. If you are already practicing web accessibility, email accessibility should not be challenging for you.
Email Copywriting Best Practices for Better Email Accessibility
Use human-to-human language that’s conversational and easy to understand. Even adult Americans prefer to read 7th-grade-level text, while the average would be able to tackle 9th-grade as well.
You can use Readable to check your readability score and Grammarly to check how Correct, Clear, and Engaging your content is, and how well it is delivered to make the right impression on the reader. The free plan in both tools is already good as a starting point.
Use Headers & Hierarchy The different header levels help your subscribers who use screen readers to understand your message’s hierarchy clearly. If you want to build up your email design system, it’s best to stick with specific headings and text styles.
Avoid All Caps The problem with all caps is not only that it can feel like SHOUTING on the web, but it also makes your text much harder to read for dyslexic people. 5 to 15% of people have dyslexia. Writing in all caps makes it difficult for them to distinguish between the different letters.
Avoid Justified Text Justified text alignment often seems a good idea from the design perspective. But it can make your texts challenging to read for both dyslexic and non-dyslexic users. Justified text creates large uneven spaces between letters and words. When these spaces line up above one another, a distracting river of whitespace can appear.
This can cause dyslexic readers to lose their place when reading repeatedly. You can avoid creating the river effect by using left-aligned text, instead of justified text for your paragraphs.
Short center-aligned text only According to Litmus, if the copy is longer than two lines, it should be left-aligned. Center alignment of text gets more accepted in email designs than justified text alignment. Brands such as Disney, GoPro, Starbucks, Airbnb, Nike, and others, do not follow this rule, making reading a challenging experience for dyslexic and even non-dyslexic people.
Always break up large blocks of text. Make sure to break up overwhelming large blocks of text to make it easier for users to digest the information. Best practice suggests that you should use paragraphs that don’t go beyond five lines as a maximum.
Emphasize with Bold Text Styles
Apply bold text to make meaningful words and phrases prominent. Bold text not only looks better but makes it much easier to read a book for dyslexic people. So, apply the bold text to emphasize your text instead of underlined text or italics.
Use ATL Text for Images ALT text is very important in emails because some email clients may block images. Then, screen readers help users by reading out the Alt text out loud.
Here are some tips to consider when working on your alt texts:
- Don’t repeat the same alt text.
- Descriptive & short (max 100 characters or less).
- Alt-text is not title text
- Use empty alt text for illustrations
- Style your alt text
Do not write “enable images for your email” as an image ALT Text. Most screen-reader tools do not prioritize alt-text over title text. They read both and create a problematic email experience for users.
Email Design for Better Accessibility
Keep your Line Length short. Another aspect of the readability of email content is the length of copy. The ideal size of a copy must be within a range of 45 to 75 characters. A long line causes users to lose focus and makes it harder to correctly move to the next line.
While “too short” of a line causes users to jump too often, causing fatigue to the eyes, consider breaking up the content with headings, lists, or images to give your readers mental breaks and support their different learning styles.
Use headings to logically group and summarize the information. Headings, controls, links, and labels should appear clearly to enhance your subscribers’ ability to digest your email content.
Don’t use a light grey color for your text. Do not choose grey for your email text even though the color looks good from the design perspective. You want to keep readability in mind.
As a rule of thumb, you shouldn’t use a grey color that is lighter than:
- #959595 for 24px text or 19px bold text.
- #767676 for smaller text
Optimize call-to-action size and spacing
Always optimize your email buttons’ size and spacing. According to WCAG, the minimum size for a call to action should be 44 by 44 pixels. Google, however, advises that buttons should be bigger, around 48 by 48 pixels.
The minimum spacing suggestions as per Microsoft and Google are quite different. Microsoft recommends that the min spacing in a call to action should be 8px, while Google says it should be at least 32px.
We are leaning more towards Google’s recommendations because it gives more space to the reader’s eyes.
Optimize the contrast ratio
Ensure that the contrast ratio between the text color and its background color is around 4.5:1 for smaller text, and 3:1 if the text is larger.
You can use online tools like contrast-ratio.com that automatically calculate the contrast ratio between two colors.
It’s important not to round up the contrast ratio you get if you think it’s close to the standard. For example, if your contrast ratio is 4.45:1 for a specific color combination, you can’t simply round it up to 4.5:1. Alter the background or text color to achieve these suggested ratios.
Code HTML Emails with Better Accessibility
Setting the language
I decided to listen to some messages from my Inbox with a screen reader. It was awful. This tool did not detect languages and read everything in a horrible mix. I’ve heard that setting the language in the code might help. And according to instructions given online, within the email template HTML code, I set “Eng” for the entire email.
Encoding characters
The way you want to display your emails depends on the Content-Type. You need to add <charset=”UTF-10″>=”utf-10″> in your email HTML code right after “<head>” as this is the most popular charset net and supports the vast majority of characters.
Logical order
A screen reader has a strict order to read emails. It reads containers/blocks from left to right. Only then it goes to the second line.
When coding accessible emails, make sure to use header elements like <h1> and <p> in HTML code. Tags <h1>, and <h2> will have an advantage over normal text and will be read first.
Note: it does not matter which font you set for certain parts of your texts. As long as it does not have tags <h1>, <h2>, it will be equal to the screen reader even if the font size is 32px or more.
Alt text
The screen reader cannot “read” the images you use in emails. But it can read “alt text.” Make it clear and informative. But avoid using the word “image” in it because its tag already mentions it. Samantha Connelly, in her post on email accessibility, says that “[as it pertains to the use of images for accessibility] it must be somewhat irritating.”
Other Significant Best Practices for Email Accessibility
Email Accessibility Requirements for Dyslexia
Dyslexic readers tend to confuse letters in words and tend to consider capital letters within a sentence as single letters despite average intelligence.
What can we do?
British Dyslexia Association published a guide on how to create websites and books:
don’t underline links. Do like we said a few paragraphs before — make the text you hide the links behind bold;
never start a new sentence at the end of a line — the new sentence means a new line in emails;
no upper case if you want to emphasize something — increase the font size;
never add center-aligned text in emails — only left-aligned copy;
The background should not be white; make it a cream for dyslexic readers — same concerns other people, as the text is written on the cream background looks softer;
all sentences in emails should end with a period (.), and bullet points end with semicolons.
Email Accessibility Requirements For Deafness
There is only one single requirement:
All videos where you give how-to instructions with a voice should have captions or subtitles. Also, don’t rely on the subtitles Youtube offers. Quite often, they do not work correctly.
Next Steps
Sootra Consulting is driven by people and the people in your organization for all your marketing operations and technology needs.
We are your one-stop partner covering all spectrum of marketing operations starting from building, designing, managing, migrating, training, and other areas. We have acquired experience and expertise over the years of serving clients of all sizes, whether startups, small and medium businesses, large enterprises, and clients from diverse industries.
We also extend tutorials, on-demand, and scheduled training sessions for your teams to help them become experts in handling multiple marketing platforms and campaigns like a pro!
If you seek some professional help to get started with email campaigns, all you need is to ask or send us your business information or email requirements at support@sootraconsulting.com. So, let’s start talking!
Also, if you want to check out our other awesome blogs, you can click here.