Hot Off the Press! - Email Newsetters

Recently, I was asked to review an email newsletter and report any accessibility issues that I found. Wow, was I surprised!

I don't expect most people to know that they need to build digital communications with accessibility in mind. But I did expect email newsletter products to have accessibility built into the tool so novice designers could produce a more accessible product without having to understand all the success criteria of WCAG 2.0/1

I decided to do some simple research. Using Google, I searched "top 3 email newsletter design providers" and received the following results set.

Google search results set page with "The top 10 email newsletter templates - just released May 2021" boxed in red.

Clicking "Top 10 Email Newsletter Template - Just Released May 2021…" yielded this page -  The Best Email Newsletter Tools of 2021

Once on that page, I searched for the word "accessible." In the image below, you can see that the search box is highlighted in red meaning that the word "accessible" was not found.

List of the top 10 email newsletter vendors. Each entry consists of the product name and description, a bulleted list of features and a bright pink button with the words Visit Site in white.

I read each review and for each review, I searched "access" and "alt." Not one search returned results having to do with digital accessibility. The word "access" did appear in two of the result sets but was used in the context of accessing a product's features.

So, how do you go about making an accessible email newsletter? You can do several things to increase the accessibility of your newsletter, even if the tool you are using does not offer explicit accessibility options.

  • Color and color contrast
    • Choose colors that are as inclusive as possible. Tableau has a great resource for that. Using tools like Color Safe, you can easily determine the proper contrast between your background and text.
  • Create your link text the same way you would for your website
    (courtesy of NC State)
    • Embed links -
      Accessible: Lesson 2.6: Hyperlinks
      Not accessible: https://lessons/lesson26/comprehensive/mar2202/springsemester
    • Create Concise Hyperlinks
      Concise: Creating Accessible Hyperlinks
      Not concise: This page lists ways in which accessible hyperlinks can benefit screen reader users
    • Create Descriptive Hyperlinks
      Descriptive: Benefits of Accessible Hyperlinks
      Not descriptive: Benefits
    • Write out the full email address
      Accessible: accessibility@fubar.org
      Not accessible: Accessibility Help
    • Create link text that clearly identifies the content. Tell the user what they are about to see / read.
    • If a link downloads a file, let the user know.
      Example: Campus Map (PDF, 5.62 MB)
    • If a link opens in a new browser tab or window, be sure to let the user know.
      Example: CNN Homepage (opens in new tab)
    • Underline all link text.
    • Give link text a different, web-safe, and accessible color from surrounding text.
  • Font choice
    • Choosing the right font is critical not only for readability but for comprehension for users with cognitive disabilities such as forms of Dyslexia. Unfortunately, there is no hard and fast standard on which fonts are more accessible than others. But, according to WebAIM, there are best practices that can make choosing the right font easier:
      • Use simple, familiar, and easily-parsed fonts.
      • Avoid character complexity
      • Avoid character ambiguity
      • Use a limited number of typefaces, fonts, and font variations.
      • Consider spacing and weight.
      • Ensure sufficient contrast between the text and the background.
      • Avoid small font sizes.
  • Proper document structure with headings
    • "Headings are ranked <h1> through <h6>. Use headings hierarchically, with the <h1> representing the most important idea on the page, and sub-sections organized with <h2> level headings. Those subsections can themselves be divided with <h3> level headings, and so on." ~ Usability & Web Accessibility, Yale University
  • Apply ALT text to all images
    Some email newsletter products make it easy to add ALT, many do not. You may need to search the help documentation for instructions on adding ALT text. If your product does not have the capability to add ALT text, please caption all your photos and images.
  • Always include a link to a web version and / or a text-only version of your email newsletter. For many, web and text-only are much easier to read with assistive technology.

Simply by applying a few standard best practices, you can tremendously increase the accessibility of your email newsletter. So, plan ahead, choosing colors, fonts, and images so you can test your layouts. Keep your newsletter simple and keep it short. Your readership will thank you.

Resources

Maggie Vaughan, CPACC
~ friend of DubBot, A11Y practitioner in higher ed