Posted on 12/10/2019 in Accessibility


Introduction

Yes. Just as  websites need to be accessible, the emails we send out need to be accessible as well. While we do not have a specific email accessibility guideline to adhere to, it can be assumed to fall under the umbrella of the Web Content Accessibility Guidelines (WCAG), along with a few best practices.

Design

Use High Color Contrast

Using appropriate color contrast is important for all users, not just those with visual disabilities. It affects those with color-blindness or even those taking in the outdoors on a bright sunny day. Improper color contrast can make it difficult for your users to perceive your content. Ensure there is enough contrast between foreground and background colors, as well as contrast between your body text and link text colors.

To check color contrast, I recommend tools below, both of which I use on a regular basis:

Choose Native Over Custom Fonts

There is much debate about which fonts are best suited for the web, specifically with “fonts designed especially for on-screen viewing”. Custom fonts are nice, but they may present varying levels of accessibility issues. In general, you should follow a few best practices when selecting a font family. Choose one that:

  • is basic and simple
  • has even spacing
  • Is not too condensed
  • uses native or standards fonts (usually available on end user device)

Content

Hierarchical Structure

A page with properly structured headings (<h1> - <h6>) provides well organized information to screen reader users, allowing them to scan through your email more easily. Headings should be constructed similar to how table of contents are without skipping any levels. They should not be used based on their size or design appearance.

Here is a more detailed explanation of how to construct your emails with hierarchical accessible headings.

Email Copy

Body

It is generally recommended to left-align your body text, rather than center or justify it. Centered text can make it harder to find the beginning of each line for some users. Justified text presents inconsistent spacing between words which can also make it hard to follow.

Fonts

For fonts, use a size of at least 14px. Anything less can make it tough for people to read. Personally, I recommend going with a larger minimum of 16px, but 14px is definitely the smallest size you should consider. Additionally, set your line height to a minimum of 1.5.

Links

Use meaningful link text. “Click here” and “Learn more” link text, by themselves, do not accurately describe the purpose of the link alone. “Click here to sign up for our newsletter” or “Learn more about our wins in accessibility” are link text examples that clearly define the link’s purpose is.

Images

Avoid hiding context or information within images. Text embedded in an image cannot be interpreted by users with visual issues, or Google for that matter. If this cannot be avoided, take care in making sure there is a textual representation of the information in the image as well (i.e. - image alternate text or adjacent text). Having a textual representation is 100% accessible.

Plain-text version

If you are not already sending out a plain-text alternative version along with your emails, you really should be. Email platforms allow you to send a plain-text version of your email along with your HTML version. These versions are text-only and without any design treatment. So why send plain-text?

  • Sending your HTML email along with a plain-text version helps to avoid spam filters
  • Some people prefer the plain-text version
  • Message clarity - it requires you to represent your visual elements (i.e. links, images) in a textual manner
  • It’s accessible

Conclusion

Getting your audience to act on your email is hard enough. Think of how much harder that might be for someone with a disability or temporary impairment. Take care in removing usage barriers from your email. It will only increase your chances of getting that already hard to earn conversion.


Not sure if your site meets proper accessibility standards?

Contact us today for an accessibility audit to find out

Related Articles

Demystifying SPF, DKIM and DMARC: Strengthening Email Security

Demystifying SPF, DKIM and DMARC: Strengthening Email Security

With Slack and other instant messaging services handling more and more of our online communication, email can sometimes feel like a newspaper being [...]

Elevating Your Brand: The Transformative Power of Website Design

Elevating Your Brand: The Transformative Power of Website Design

In the digital age, your website is often the first point of contact between your brand and potential customers. It's not just a platform to showcase [...]

Navigating the Digital Landscape: Website Design Trends of 2024

Navigating the Digital Landscape: Website Design Trends of 2024

In the ever-evolving realm of digital innovation, website design trends serve as the compass guiding businesses and creators toward impactful online [...]