Add Alt Text to Images

We know the design of your emails is important, and images are a big part of what makes that design work. But in some cases, a subscriber may not be able to see the images in your emails. That's where alt text comes in.

In this article, you'll learn about alternative text for images, and how to add alt text to your emails so every subscriber has a smooth experience.

About alt text

Alt text, or alternative text, is a short description of an image in your email that displays when subscribers are unable to view your images. This can happen if they have images turned off in their email client, or are reading your email with a screen reader.

Alt text helps your subscribers understand what value an image adds to your message, or lets them know that an image is decorative and can be ignored. It may seem like a small thing, but alt text can be very important if subscribers can't see your images, so include it for every image in your email.

Alt text and accessibility

Alt text is especially important for people who use screen readers, so it's considered a basic best practice for email accessibility.

Without alt text, a screen reader will tell your subscriber there's an image there, but the subscriber has no way to determine what information the image provides. To learn more about accessibility best practices, check out Accessibility in Email Marketing.

Alt text and image display

If your images aren't showing up in your subscribers' inboxes, their email client may be blocking them. For security reasons, many email clients turn off images by default, so subscribers have to manually turn on image display. If your subscribers have images blocked, they'll see your alt text in place of an image.

Here's how alt text looks when images are blocked.

This image doesn't have alt text.

This image does.

Tips for effective alt text

Here are a few tips to keep in mind to help you write appropriate, effective alt text.

• Keep it short
  Alt text should be easy to read and digest, so your subscribers can move on to the rest of your message. Aim for one or two sentences.
• Use proper punctuation
  Screen readers use punctuation to know where to pause when reading content, so it's important to use proper punctuation in your alt text.
• Don't use quotes
  The alt attribute that's added to the raw HTML of your email uses quotation marks to identify where your actual alt text begins and ends. Additional quotation marks will cause the HTML to break.
• Repeat text that appears in images
  It's always best to keep important information in the main text of your message, and not contained in an image. But, if an image does include text, repeat that information in the alt text so your subscribers don't miss it.
• Don't repeat image captions
  Image captions are read by screen readers and display even when images are blocked, so don't repeat image captions in your alt text. Alt text should provide information about your image that your subscriber can't get from the caption alone.
• Consider context
  Context is the most important thing to consider when you write alt text for an image. How does the image relate to the content around it? Ask yourself what information your subscribers might already have about the image based on surrounding content.
• Identify decorative images
  If your image is purely decorative, briefly state that in your alt text so your subscribers can move past the image to the rest of your message. For example, just writing "Decorative image" would work.
• Test your content
  Some email clients won't display alt text for a linked image, or won't display alt text that exceeds the image width. Send test emails to different email clients and disable images to find out how your alt text will display.
  Preview and Test Your Email

Add alt text to images

There are a couple of different ways to add alt text to images in Mailchimp, and the method you use depends on where your image is located.

• From an image block
• From a text block
• In custom coded templates

From an image block

To add alt text to an image in any image content block like an Image, Image Group, Image Card, or Image + Caption, follow these steps.

1. In the Content section of the email checklist, click Edit design.
   
2. On the Design step, click the image block you want to work with.
3. In the editing pane, click Alt.
   
4. In the Image Alt-Text field, input the alt text for your image.
5. Click Update.
   
6. Click Save & Close.

All set! Now your subscribers won't miss out on your content, even if they can't view your images.

From a text block

To add alt text to an image in a text content block, follow these steps.

1. In the Content section of the email checklist, click Edit design.
   
2. On the Design step, click the text block that contains the image you want to work with.
3. Double-click the image to open the content studio.
   
4. Click show image style options.
   
5. In the Alt text field, input the alt text for your image.
6. Click Save & Insert Image.
   
7. Click Save & Close.

Great job! Now when subscribers can't view your images, they won't miss out on your content.

In custom-coded templates

If you code your own templates, you'll need to include an alt attribute for each image you use. Insert the alt attribute inside the image tag and enter your alt text.

Your code should look something like this.

<img alt="Woman holding a small clay pot stamped with the Potted Planter logo." align="none" height="400" src="https://gallery.mailchimp.com/example.jpg" style="width: 600px; height: 400px; margin: 0px;" width="600" />