You’ve scheduled your email marketing campaign to launch—the copy has been proofread several times, your brand team has signed off on all the creative and you’ve double-checked that all your links are working. But, have you confirmed that your campaign meets the best practices for email accessibility?
Accessibility should be at the forefront of conversations around ensuring that your emails are considered best in class, but often those conversations don’t happen and best practices aren’t followed.
According to Litmus, 77% of brands say email accessibility is a priority for them, but in practice, only 8% say they actually follow industry best practices for accessibility.
So let’s improve that.
Before we talk about how to make the changes, let’s take a small detour to look at why this is so important and needs to be a conversation involving your entire team.
Globally, people with disabilities represent one in four people, and if that’s not enough to get your team’s attention, this group has $1.9 trillion in disposable income. For making content accessible to this group there’s a wide range of use cases to think through—vision, cognitive, motor, reading and hearing impairments all need to be considered.
Above all else, I firmly believe that improving accessibility improves the experience for everyone. My favorite example of this is wheelchair ramps on sidewalks. Sure, they were created for people in wheelchairs to easily get on and off sidewalks but a wide range of groups also benefit: the woman with the walker, the dad with a packed stroller, the business professional with a set of luggage or the commuter on their bike.
So let’s dive in with how you can create accessible content.
1. Follow subject line and preheader best practices
Your subject line and preheader are a great place to start. Like most subject line best practices, you want to make sure that your subject lines are concise and descriptive, but not full of jargon. Any abbreviations that might be obvious to you have the potential to be difficult to be understood when being read by a screen reader.
2. Consider how emojis might be read out loud
Emojis—love them or hate them—can be used in subject lines if they fit with your brand voice, but be mindful of how they could be read by a screen reader or a virtual assistant like Siri or Alexa.
Let’s take a look at the subject line below.
This might be read as “What’s 5 Stars & 3 For $60?” but a screen reader will read it as “What’s yellow five-pointed star, yellow five-pointed star, yellow five-pointed star, yellow five-pointed star, yellow five-pointed star and $3 for $60?”
So if you’re using emojis, make sure that your meaning is still easily communicated to those that might be using assistive technologies.
3. Make your content is readable with a passing color contrast ratio
The color palette for your brand and your emails is essential to your brand, but also to your readers.
The color contrast ratio is the ratio between the background and the foreground color and the basis for making sure that your communications are easily readable. Determining readability can be more scientific than getting a “looks good to me—approved!” from your team. At a minimum, email colors should have a ratio of at least 4.5:1.
For comparison purposes: White text on a light gray background has a contrast ratio of 1.19:1 while white text on a black background has a contrast ratio of 15.04:1.
4. Ensure you’re not communicating information by just using colors
With color blindness, some of your customers might not be able to differentiate between certain colors, so you need to consider how you’re communicating outside of using colors. Do you use blue to show a few words of your content are hyperlinked or are you showing swatches of your latest colorways?
Consider adding other indicators: Underline your hyperlinks to show a differentiation between the rest of your copy or add the name of the colorway rather than relying on a swatch or visual representation.
5. Don’t get too wild with animations
GIFs (you can choose-your-own-adventure on the pronunciation) are cool, but make sure that you’re being conscious of how they can affect your customers. Animations shouldn’t be too fast or have the ability to cause dizziness or vertigo to those who might have a visual sensitivity.
They also shouldn’t contain any excessive blinking or flashing, which could contribute to a seizure. You should also consider how long you need your animation to play as it can detract from some users being able to focus on the rest of your content.
6. Alt text is a must-have
The Web Content Accessibility Guidelines say “all non-text content that is presented to the user has a text alternative that serves the equivalent purpose.” Enter alt text. Alt text is shown to users when the image doesn’t display; it’s also what screen readers use to read through non-text elements of an email. Alt text is also non-negotiable.
If you have images (or GIFs) you need to make sure that you’re communicating that same information through alt text. This seems simple, but there are a few “don’ts” to keep in mind:
- Start with “an image of…”—the screen reader will already be relaying that this is an image
- Add alt text to decorative elements—leave the alt attribute blank instead
- Skip adding alt attributes altogether on images—the screen reader will read the file path instead!
7. Use semantic elements in your code whenever possible
These are elements that clearly define the content like <section>, <h1>, <h2>, and <p>. These allow screen readers to easily navigate the content, which in turn creates a better user experience for those using screen readers.
8. Set the language attribute within your HTML
You can set the language attribute at the top of your HTML to identify the language that your content is in. Screen leaders can switch language profiles to ensure the correct accent and pronunciation is used.
9. Keep font size readable and CTAs clickable
We’ve already talked about readability with color, but you don’t want to take a step back and use too small of a font size. Text should be 14px at a minimum and even then, you’ll want to make sure that your emails can still be read when zoomed up to 200% for those who need it.
Similarly, for CTA buttons, just because someone is viewing your email on a small screen like their phone, that doesn’t mean the CTA buttons should be small. Ensure that you have a large enough touch target that someone can click it with ease. In its Human Interface Guidelines, Apple recommends touch targets with a size of 44 x 44 pixels.
To help support customers who might have hand tremors or difficulty controlling a mouse, you also want to make sure the entire button is clickable, rather than just the text to avoid any frustration when trying to click.
Improving Email Accessibility: How to Get Started
So you’ve read through this, and you’re not sure where to start? Take a look at your latest campaign and do a quick email accessibility audit!
A few sample questions:
- Do you have alt text on all of your images?
- Is the language set at the top of your HTML?
- If you use a screen reader, is your content easily understandable and logical?
- Do your CTAs provide enough room to easily click on them (desktop and mobile)?
- Does your color scheme pass the color contrast ratio?
From there, you can create your own checklist for your team to reference to make sure you’re following through on accessibility best practices.
Want to modernize your email marketing? Reach out and schedule a demo with Iterable today.