Accessibility and inclusion: Guidance for email newsletters

(Portions of this item originally appeared in our November 2018 newsletter)
Web accessibility has always been a requirement for UMaine websites, and has been a regular feature in our monthly newsletter — and ensuring your content is accessible is part of an inclusive communication strategy.This month, we focus on email, and pitfalls to avoid when sending an email newsletter or message.

Email is an effective engagement tool— this newsletter, for example, has been well received and gives us opportunity to share our expertise in bite-sized, monthly updates. These days, emails can contain many of the same features as web pages, and therefore the same web accessibility concerns apply.

Images for images, text for text

If you have taken the time to create a flyer for a communication, it is tempting to use an image of the flyer for an email “blast” to your audience; we are all busy, and that certainly can save time. Unfortunately, it gives a poor experience for many of your recipients. Anyone who relies on their computer to resize text or even read the contents of an email to them would be unable to see the content of the image— and mobile users would be presented with the image on their phone screen, perhaps too small to easily read. Even worse, some email programs will load the message without the images, and your entire message would be obscured unless the recipient chose to view the image.

A better tactic is to let images be images, and text be text. You can crop the interesting visual element from your flier and put that in your email— email programs like MailChimp and Constant Contact allow you to add “alt text” to the image as well, which will display in place of the image until the image is loaded. You can then use text formatting underneath the image to convey your message in a way that is accessible, searchable, and visible even if the email program does not display images by default.

Keep text easy to read

Email formatting options allow you to change the text from the default “San Serif” font and “Normal” text size. It is generally best to keep these options as-is, and not alter the font of the body text. Headings in an email can be made larger, but using fonts for artistic/aesthetic reasons can cause problems for readers who need a vision accommodation, or have set their own email preferences for text size and font.

Color contrast is important

The color of text and images in your email should have good contrast against the background color of your email. It is especially important to keep text color at the browser default for mobile device users, where “dark mode” may be a preference for the reader. Such an option typically displays the default background in an email as black, with the default text color as white, and overriding either option may result in a poor, difficult-to-read display.

Use descriptive link text

When using an email newsletter service such as MailChimp or Constant Contact, it is even more important to give descriptive link text for any links you provide, rather than the link address itself as the link text. Not only is that bad for web accessibility, it can trigger spam/phishing warnings in email clients when the link address does not match the link address displayed in the message (typically links in email newsletters go to the service sending the email, which redirects to the final location.)

If you have any questions about web accessibility, or want to see us cover an accessibility topic in a future newsletter, please get in touch with us at um.weboffice@maine.edu.