This is a guest post from Chris Donald, Director of InboxArmy, a professional email marketing firm .

When you’re thinking about email design, alt text for images may not be one of your top 10—or even top 50—biggest concerns. After all, the alt text is something most of your subscribers will never see. Many don’t even know it exists.

But alt text does serve an important, if underrated, role in your emails—both from an accessibility perspective and from a user experience one.

In this article, we’ll cover the basics of using alt text for your email images and share some tips for maximizing its value.

By definition, alt text is a HTML attribute that provides text when a non-textual element, generally an image, is not displayed. Why wouldn’t an image be displayed? It could be blocked by an email client because a user is on a slower internet connection, because you’re an unrecognized sender, or because of an issue downloading the image from your server. There are even a number of email clients that block images by default (including AOL, some iterations of Outlook, and Yahoo)—and keep them blocked until a user chooses to see images in a sender’s emails.

However, the original (and primary) purpose of alt text is its crucial role for accessibility. Your subscribers who use a screen reader will hear your alt text whenever an image comes up, which allows them to properly experience and enjoy your emails. 

Alt text can also serve a search engine optimization role when used on a website, but, as emails don’t require SEO, we won’t cover that facet of alt text in this article.

For an example of alt text in action, here’s an email from Seltzer Goods. You can see how the email looks with images enabled versus how it looks with images disabled. Thanks to the alt text, you can understand what the email wants to convey even without relying on the images.  

If you peek inside an email’s code, you can see the alt text is specified along with the image in the following format.

<img src="url" alt="the alt text goes here" />

Keep it simple

One of the most important email marketing tips is: Keep your email as simple as possible in all aspects. That extends to alt text. Just because you could turn each image’s alt text into an essay, that doesn’t mean you should. It’s generally best to keep your alt text to a couple of sentences at most. What you do with those sentences, however, depends on the purpose of the image.

Replicate text-based images

If you’re writing alt text for an image that contains text, it’s usually smart to put that text in the alt tag—that will ensure the same information is conveyed regardless of whether a subscriber can see your image or not. In the example below, Oculus uses the text in the image as the alt text so there’s no gap in the information they’re conveying.

And in this example, Cracker Barrel even keeps the nuance of a text-based image in its alt text. The text in the image contains an asterisk (“Get oven-ready goodness delivered for free*”) indicating there are conditions on the offer. The alt text also contains that asterisk.

Describe the image

When you’re dealing with an image that tells a story, make sure your alt text also tells that story. Again, though, as we’re trying to keep alt text short and to the point, you’ll have to keep it brief.

In this example from East Fork, the image features a smiling person identified as “Annie” and a speech bubble shows her talking about “brass flatware.” Thus, the alt text reads: “Annie loves brass flatware.”

Irrelevant images and spacers

Not every image in an email requires alt text. The W3C standards for accessibility even state that “decorative images [that] don’t add information to the content” can use an empty alt tag (i.e., alt=“”) as to not make the screen reader experience unnecessary long or confusing.

In order to give your email design some breathing space, you may use blank spacer images—those don’t need alt text. The W3C also says images that are purely decorative (“eye candy”) don’t necessarily need alt text—although it’s a judgment call on your end whether an image is decorative or informative.

Watch out for alt text quirks

Your emails go out to users with a number of different email providers, email clients, platforms, and devices. As a result, be careful with your alt tags so you don’t wind up creating an unexpected—and negative—user experience.

Avoid using quotes 

The HTML syntax for specifying alt-text is:

<img src="url" alt="alt text" />

Because the alt text is enclosed in quotation marks, that makes it tricky to use quotation marks within the text itself. Even if your email service provider is set up to handle quotes in alt text (and escape the characters so they don’t cause broken HTML code), there’s still no assurance the alt text will work correctly for every subscriber. If you need to use quotes, use single quotes in your alt text to minimize potential issues.

Consider the Outlook security message

Microsoft Outlook 2003 through 2016 uses Internet Explorer as its rendering engine—and Internet Explorer has a cumbersome way of handling broken images. So whenever images are blocked in an email, Outlook prepends your alt text with a small rectangle with a red “x” inside and a custom message: “Right-click here to download pictures. To help protect your privacy, Outlook prevented automatic download of this picture from the Internet.” The error looks like this.

As a result, there’s a chance there won’t be any room left for your alt text in smaller images. It’s another reason to keep your alt text short and simple—and something to keep in mind if you’re using lots of small images in your email.

Don’t repeat your alt text

There are times you’ll use the same image multiple times in an email. You don’t need to use the same alt text message with all of those images. That could confuse (or get very redundant for) someone using a screen reader. Either keep the alt text blank for repeated images or use custom alt text for each image to give them more relevance. 

Get creative when you can

Alt text is, by nature, utilitarian—it’s short, functional copy that serves a basic purpose. But if you’re feeling inspired, it is possible to get a little creative with your alt text. And while those efforts might not be seen (nor appreciated) by the overwhelming majority of your customers, the ones who do pick up on what you’ve done just might appreciate it even more.

Creative alt text can also help you stand out. One survey found fewer than 14 percent of email creators say they “go all out” with their alt text. (And, as we researched hundreds of brands’ emails for this article, we found very, very few doing anything beyond the basics with their alt text.)

Add some flair to your alt text

Believe it or not, you can include style attributes to your alt text—it just takes a little bit of inline CSS on your image tag.

<img src="url" alt="alt text goes here" style="width: 100%; height: auto; display: block; color: green; font-size: 36px; font-style: italic; font-family: Georgia, serif;" />

It’s win-win: Styled alt text won’t affect people using screen readers or hurt the accessibility of your emails, but it will add a little bit of visual appeal and style in cases where your images are blocked or otherwise don’t display.

So instead of standard, unformatted alt text like the example on the left, you can style your alt text to add some flair like the example on the right.

Here’s an example of this in action from Vitamin Shoppe (as well as the HTML code they’re using to pull it off.)

Easter eggs

If you’re feeling extremely creative, alt tags also provide a chance to throw an Easter egg into one of your emails. You could hide a message in an alt tag, or a code over a series of alt tags.

Some designers have even created innovative pixel art by slicing their image into small blocks—and when those small blocks come up as text rather than the images, they form a different pattern. 

In the example below from Sony PlayStation, the email’s hero image has been sliced and styled to reveal the Transformers’ Autobots logo when images are disabled. (The aggressive Microsoft Outlook red “x” somehow even enhances the art here.)

Alt text may not be one of the most talked about aspects of creating emails, but it serves two important purposes. One, it’s essential for accessibility when you have customers who use screen readers. And two, it keeps your email functional and viable when your images are blocked or otherwise don’t load.

So as you craft your emails, keep in mind the techniques you can use to maximize the value of your alt text.

Keep it simple. There’s no reason to turn your alt text into essays—focus on the basics and keep it brief.

• Text-based images. Replicate your text-based images as alt text.
• Describe your images. Describe your email images in a quick but illustrative way.
• Ignore “decorative” images. Don’t worry about alt text for “decorative” or irrelevant images.

Watch out for alt text issues. You don’t want your alt text usage to go wrong. So watch out for some common potential pitfalls. 

• No quotes. Avoid using quotation marks in your alt text to prevent potential problems with your code.
• Be cognizant of email clients. Recognize how your alt text will look in email clients like Outlook that add their own text to broken images.
• Don’t repeat your alt text. If you use the same images over and over in an email, don’t repeat your alt text, as that can be confusing and/or redundant for someone using a screen reader.

Get creative when you can. Alt text isn’t normally thought of as a creative outlet, but there are a few things you can do to enhance it.

• Add some flair. Use inline CSS to style your alt text.
• Hide Easter eggs. If you’re feeling especially creative, hide Easter eggs in your alt text for super observant subscribers to find.