How do I make Mailchimp emails accessible?

Content authors can use Mailchimp to create accessible marketing emails. Note: If you’re currently using Constant Contact, we urge you to transition to Mailchimp because Constant Contact has a number of accessibility issues at this time.

Common accessibility features that you should utilize in Mailchimp:

  • Headings - Designate text as paragraph text or as heading levels H1 - H4.
  • Text styles - Use text styles to edit the appearance of text and ensure it’s consistent.
  • Alt text - Add alternative text to images.
  • Links - Ensure links are underlined (defined in the styles section), unique, and use meaningful text.
  • Contrast - Editors can adjust the color of most elements, so you should ensure combinations meet contrast requirements.
  • Lists - Use list formatting when appropriate.

Avoid:

Survey block - At this time, questions with radio buttons and checkboxes don’t read the question for screen reader users in forms mode. Use a Google Form instead.

Quirks, issues and work-arounds

Here are a few issues and work-arounds to be aware of as you create emails in Mailchimp.

Images

When a screenreader user reads a Mailchimp email in gmail, they will hear “button download attachment” for each unlinked image over a certain size. This is a function of the email client, not Mailchimp, and can’t be turned off.

Links

The default setting opens links in a new tab, which is usually bad for accessibility. It’s an easy fix– just uncheck the “open link in new tab” checkbox.

Link editing interface showing checkbox to open in a new tab

Alternatively, if you feel the link  should open in a new tab, be sure to add “(opens new tab)” to your meaningful link text.

Alt text

  • At this time, you can’t add alt text to an image in the library, so you’ll have to add alt text every time you insert an image from your library into an email.
  • AI-generated alt text is automatically generated, but the quality is poor, it lacks punctuation / capitalization, and it doesn’t describe link destinations if an image is used as a link. Plan to fix AI-generated alt text.

Focus indicators

Focus indicators are a thin black outline and can’t be edited. As a result, they disappear on black button links and are difficult to see on other black interactive elements, such as images and video screenshots.

Work-arounds:

  • Avoid black and darkly colored button links -OR-
  • Add a pale-colored border to dark button links so the outline is visible when present.

Before:

Black linked button with a black focus indicator that users can't see.

After:

Black focus indicator is visible on a black button with a pale green outline.

Videos

When you insert a video block and add a YouTube (or Vimeo) link, Mailchimp will generate an image with a video still, which will link to the video on YouTube. 

As such, your alt text should describe the link destination, not the screenshot content. You can use something like “YouTube video about color contrast” or “Learn about color contrast (YouTube video).”

Additional resource

Mailchimp: Email Accessibility Tips to Help You Reach More People