Only 8% of brands rigidly follow best practices for Email Accessibility.
A lot of businesses use all image emails to showcase their products & to make it feel like a seamlessly designed experience. But, doing this usually means you will fail accessibility.
Cognitive and situational challenges, such as being in a hurry or distracted, can hinder the readability of long text blocks.
Establishing hierarchy through visual distinctions, like varying text size, colour, and placement, helps the reader to quickly absorb email content.
Use bold, high-contrast headlines above concise text segments and incorporate whitespace to prevent content overlap, ensuring easy scanning and readability.
Firstly, left align your email copy. Why? Reading relies on visual cues to make sense of where you are on a page or screen.
A crucial visual cue in email readability is the beginning of a new line, serving as an anchor for our eyes as we navigate through the content.
While centred text may appeal for its visual symmetry, maintaining left-justified text consistently is a highly effective strategy for ensuring readable copy, especially for longer copy.
Top tip: If you have any copy that’s longer than two lines, left-align that copy.
Contrast plays a pivotal role in email design, often involving the distinction between text colour and its background. Inadequate contrast poses challenges for individuals with low vision when reading emails.
The key is to enhance visibility by separating foreground from background, achievable through methods such as colour, font weight, and font size. Regardless of the approach, ensuring sufficient contrast between elements is crucial for email accessibility. A free online contrast checker from the accessibility group WebAIM is also available to identify and address any contrast issues proactively.
The format of your email plays a crucial role in ensuring accessibility.
Elaborate, multi-column designs may overwhelm users, causing sensory overload. Simpler layouts are generally favoured, as they reduce the likelihood of users getting lost in the email. Single-column formats, in particular, prove highly effective for creating accessible campaigns.
They streamline content, reinforce hierarchy, and enhance scannability.
When engaging with emails, it’s crucial to ensure that all links and buttons, considered touch targets, are user-friendly.
For text links, it’s essential to make them distinguishable from the surrounding text.
The default underlined blue text for links serves a purpose, and when deviating from this style, it should be done sparingly.
Underlines, especially, play a vital role in indicating links in an email, considering the approximately 300 million colourblind individuals globally.
Relying solely on colour for link styling can present challenges for this demographic.
For calls-to-action and buttons, it’s important to make them large enough to be tapped by individuals with larger or shakier thumbs or pointing devices. Adequate whitespace around these targets helps prevent accidental link taps, reducing frustration for users.
Adding a hover state to both text links and buttons is a valuable practice for creating a more accessible user experience. Incorporating a hover effect through CSS and the :hover pseudo-selector differentiates the appearance and behaviour of links when users hover over them.
This not only serves as a clear indicator that the content is clickable but also enhances the overall email design, an aspect often overlooked.
Revisiting the copy of your campaign is among the simplest methods to enhance its accessibility.
Making sure that your copy is both readable and easily understandable significantly contributes to the overall accessibility of your campaigns, and incorporating a few straightforward tricks can facilitate this improvement.
Although it’s tempting to cram emails with content, shorter, concise copy is preferred. Litmus research suggests the average email attention span is 13.4 seconds and the ideal email copy is around 50 words. Beyond attention spans, individuals with cognitive disabilities may struggle with longer texts.
The W3 Working Group, overseeing WCAG guidelines, emphasises that reading difficulties affect diverse demographics and education levels.
Complex sentences hinder email readability. Choose for short sentences to enhance understanding and allow your audience to focus on content rather than deciphering complicated structures. Split longer sentences whenever possible (bullet points are great!).
Shorter words are better, as they’re easier to absorb and demand less reader concentration. Replace complex words with simpler synonyms whenever possible.
Global marketers should prioritise translating content into local languages rather than relying on operating system or browser translations.
While coding techniques can assist, it’s advisable to use a reputable translation service and go beyond translation by incorporating culturally appropriate language and content.
The popular Flesch Reading Ease test helps gauge how easily someone can read your text based on sentence and word length.
Scores range from 0 to 100, with higher numbers indicating easier readability.
Aim for a score of 60-70, considered plain English easily understood by 13- to 15-year-olds, especially for most marketing copy.
Use a tool like readable to test your email!
Improving the code is key for creating accessible emails, especially for users relying on assistive technology like screen readers.
Screen readers translate email code into audio, making code optimisation crucial for ensuring usability.
Have you ever used a screen reader before? Test your email through a screen reader to see what it sounds like.
Use semantic HTML in your emails. This means using appropriate HTML elements for their intended purpose, providing additional context for screen readers and improving overall accessibility.
For example, use heading elements (h1, h2, etc.) for headlines, paragraph tags (p) for copy, blockquote for customer quotes, and anchor tags (a) for buttons. Avoid using deprecated elements and prioritise semantic structure for a better user experience.
P.S get an expert to inspect your code!
How can you ensure that images in your emails are still accessible?
Include alt text with your images. Alt text is a textual description that provides critical context to subscribers using assistive technology or with images turned off.
Images are used for multiple things in email. However, not all images require the same type of alt
text.
Your images can be categorised as informative, active, or decorative:
Although it may be tempting to use descriptive alt text for every type, this can hinder the objective of creating an accessible email.
For instance, offering descriptions for decorative images introduces unnecessary information when read aloud by screen readers, leading to potential frustration and confusion for subscribers.
If you’re doing this. Stop. Please, just stop. Remember accessible emails improves usability for EVERYONE on your list.
Contrasting colours are so important. Colours like yellow & white are inaccessible. Ensure to test your colours before building your email.
Clearly visible links reduce confusion, helping users easily identify interactive elements in emails.
This not only enhances the overall user experience but also improves accessibility for individuals with visual impairments or those using screen readers, ensuring clear navigation and understanding of the email’s structure.
There are so many tools out there that will help you ensure your email is accessible. Top ones include Litmus, Email on Acid, & email-accessibly.org.
Clunks of text are bad for the eyes & the brain. Keep it clear, concise and simple.
It really does.
Here’s our rules:
This is one of the biggest sins in email marketing and especially accessibility.
Screen readers and other assistive technologies may struggle to interpret text within images. This can make your email less accessible to individuals with disabilities.
Some email clients may not display images by default, or users may have image loading turned off for data or privacy reasons. If your critical information is embedded in an image, these reader may miss out on this content.
Simple fonts enhance readability, especially for those with visual impairments. Complex, decorative fonts can be challenging to decipher, particularly at smaller sizes.
Screen readers, crucial for visually impaired individuals, perform best with straightforward fonts, ensuring accurate interpretation.
Additionally, simple fonts ensure consistent rendering across diverse devices and email clients, preventing potential display issues caused by unsupported fonts.