Accessibility

Email Accessibility

Introduction

Email accessibility is the practice of making an email easy to read for as wide an audience as possible, including those with visual, auditory, motor or cognitive disabilities. When your emails are accessible, you unlock your content to everyone and people with differing abilities can read and work with your messages. Whether you send an email personally or through an email marketing application (like MailChimp or Constant Contact), here are some best practices for any email:

Copywriting: Write copy everyone can understand

First things first. You wouldn't be sending an email if you didn't have a message to convey. Screen readers and other assistive technologies work great with your typical paragraph, but there are a few elements of accessible copy that may surprise you.

Descriptive subject lines

  • Subject lines should be brief but descriptive, and give recipients an accurate idea of what's in your email. Effective subject lines aren't just good for accessibility, they also tend to increase overall engagement.

    DON'TAn important message from the school of law

    DO:       School of Law to proctor bar exams June 9

Readability

  • The average American adult reads at around a 7th or 8th grade level. Use simple language. Don’t pad your email with long, fancy words (even if you think it makes you sound smart).
  • Studies have shown that people scan emails and only read about 18% of what’s on the page. So keep sentences short and sweet whenever possible.
  • Limit your use of jargon and difficult words

Link Text

  • Phrases like “click here,” “see below,” “click the red button in the top right corner” are problematic for users with screen readers and those with cognitive conditions. Don't direct users by referring to direction, location, or color.
  • Similarly, with screen readers, link text often appears in a list. When you use language like “click here,” it tells the user nothing about the destination. Instead, use language that refers to the content itself, like "download the annual report today".

Design: Designing with accessibility in mind

Now that your copy is ready to go, it’s time to consider design elements.

Images

A picture may say a thousand words, but you also need those words spelled out. Never send an email that is an image only. Recipients who use a screen reader, or have images blocked in their email client, aren't going to see information in images or infographics. Make sure the most critical content in your message is presented in text, and use images to complement that text.

Alt Text for Images

Alt text, or alternative text, is a brief description of an image that's displayed when a recipient can't view your images. Alt text should be short but descriptive, and highlight the relevance of the image to your message. Here's a great blog post on writing great alt text.

Color Choice

In your email templates, make sure that color contrast levels are adequate; so those with vision limitations can still read the content on your site or view your images. Additionally, avoid using color as a means to convey information. For example, if an email uses green and red circles to highlight different elements, it won’t be useful for people who can’t see those colors. The same goes for phrases like “click the red button.”
examples of good and bad color contrast

Fonts and Spacing

  • Generally, sans-serif fonts are easier to read online and decorative fonts should be reserved for headlines.
  • The World Wide Web Consortium suggests line spacing of 1.5 to 2 is preferred to single spacing.
  • Be sure to leave enough space around buttons and other elements that need to be clicked on.

Maintain Structure

Templates that use multiple columns can sometimes resize on mobile devices and end up displaying out of the intended order. This can also be problematic for screen reader users where the text being read aloud may be out of order, or for users who are using a keyboard (e.g., pressing the Tab key) rather than using a mouse to move through your message. Check that order is maintained at different screen sizes and when using the Tab key.

Also, be sure to use proper heading styles, since screen readers will offer users a shortcut menu so they can skip to headings in a hierarchy.

choose a heading style, rather than changing font size and weight

Check Your Accessibility

Siteimprove is UCI's trusted partner for tools to monitor and improve accessibility on campus. For broadcast emails, you can download Siteimprove's FREE Chrome browser extension and use it to check your preview - either in Zotmail or any other mail application (like Mailchimp or Constant Contact).

This Accessible Emails tipsheet is also a good checklist to run through prior to sending an emails.

Microsoft also offers a built-in accessibility checker for Office apps, including Outlook.