Making It Know
戻る

How to Create More Accessible Emails

Download our free workbook to help you launch your email marketing strategy.

入力したメールアドレスが無効です。

ご登録ありがとうございます。

Whether you're a business owner, marketer, or simply someone who values inclusivity, understanding the principles of accessible email design is a crucial step towards fostering a more inclusive digital landscape. Creating accessible emails is not just a matter of goodwill; it may be a legal requirement for your business, and it's the cornerstone of a great user experience.

Here are five simple things to remember when crafting emails that will ensure they’re welcoming, informative, and usable for individuals with a wide range of needs and preferences. 

Note: This guide is available as a resource to help you get started, but shouldn't be construed or relied upon as legal advice. Squarespace can't provide advice about making your site compliant with any specific accessibility laws, regulations, or standards.

1. Add alt text for images

Alternative text (alt text) is a description of an image that can be picked up by assistive technologies. Alt text is useful not just for people with visual disabilities, but also:

  • People with some cognitive disabilities who may better understand spoken language than visuals

  • People using voice assistants when they're not looking at the email

  • Users who may not see an image due to internet connection issues

  • Users who prefer not to download images due to time or cost consideration

Adding alt text to your images ensures that all readers can get the most important information out of your email. To know when to add alt text and write helpful descriptions, ask yourself:

  1. Is this image decorative or conveying information? Decorative images need empty alt text, since they’re unlikely to help a user understand the information in the email better.

  2. What does someone need to know about the image? Not every part of an image is necessary to help someone understand its purpose. For example, the color of the background in a headshot isn’t necessary, but the name of the person in the photo might be. 

As you’re writing any alt text, keep these other guidelines in mind.

  • Try to keep alt text to 250 characters or less. If an image requires a longer and more detailed description, include a caption for the full description. 

  • Don’t include “an image of” or “a picture of” in your description. Assistive technologies will identify images for users, so you don’t have to.

Get more tips for writing helpful alt text

2. Structure emails with headings

The way you organize content in your email impacts the way people using assistive technologies will navigate it. For most emails, making your emails easier for these technologies to navigate means keeping your layout simple and consistent and giving clear and distinct names to each section in your email.

You can give your email an easy-to-follow structure by using headers (e.g., H1, H2, H3) instead of relying on bold or italic text to separate different sections of your email. Use only one H1 per email, since a H1 indicates the title or headline and use heading levels in order, rather than skipping from a H2 to a H4, for example. 

To make scanning your email easier, use a combination of font size, weight, style, or even color to differentiate regular paragraph text from title text. For example, bolder and larger fonts tend to draw the eye, so it’s best to apply them to the copy you want to stand out, like section headers.

3. Consider font type & size

Readability is an important part of making your emails more accessible. Making careful choices in your font size, style, color, spacing, and more allows others to navigate your content more easily. 

Font style 

Try to select a legible font with clean lines and very few decorative flourishes. As a general rule, sans-serif fonts, like Arial, Calibri, Tahoma, or Helvetica tend to work better on screens. These fonts typically make it easier for someone to skim your email and understand your message quickly—valuable when many people are scanning their inboxes on the go. 

Most email clients default to sans-serif font if they don’t support the font you’re using for better readability across platforms and devices. If you need some extra guidance on font options, you can also find a list of accessible and open source typefaces on the U.S. Web Design System website. 

Font size

The size of font you select has a big impact on the readability of your email, especially for people with visual impairments. A good minimum font size to aim for is 16px (depending on the type of font you’re using).

Try testing different sizes as you’re designing your message, since readability could vary by font. It’s also important to send a test email before you send it to your subscribers, so you can see how your design choices look on different devices and screens.

Font color 

Select a font color that can clearly stand out from the rest of the background color (think black font on a white background). The more contrast there is, the more legible your content will be. 

Although some colors may seem to contrast (like green and red), people reading your content who have visual impairments (like green-red color blindness) may not be able to see your content. You can use a Color Contrast Checker to make sure your text is legible against the background.

4. Use descriptive text for links

If you’re hyperlinking any text, give your links appropriate labels. Assistive technologies generally point out when text is linked, so you don’t need to include the word “link” in your content. 

When pointing users to a contact page, for example, it’s more helpful to write “Reach out on our Contact page” than to write “To contact us, click the link here.” In general, it's easier for someone to know where a link will lead if they only have to read the link text, instead of the link text and the surrounding text.

Lastly, make sure that your links are visually distinct from the rest of the text surrounding it so readers know that it’s not regular text. This can be done with formatting, like a different color, italicizing, underlining, or using an icon or button.

5. Avoid using GIFs

GIFs can add a fun and engaging element to some emails, but it's essential to consider the context and audience as they can present significant accessibility challenges. They may not be compatible with screen readers, making it difficult for individuals with visual impairments to understand the content of the email. 

GIFs may be information-heavy, since they tend to show more detail or convey more than a static image. It may be difficult to provide appropriate alt text to help assistive-technology users understand them. They can also be distracting, create a visual disturbance, and detract from the core message of the email.

If you do decide to add a GIF to your email, aim to add a slow-moving GIF that doesn’t flash or bounce more than three times in one second, as this can be very disorienting to some. If it’s possible to allow the reader to pause the GIF, allow them to do so. And always include alt text describing the GIF for those unable to see the image.  

Read our guide to web accessibility

Related Articles

  1. Know

    How to Create a Newsletter for Your Blog or Business

    How to Create a Newsletter for Your Blog or Business

  2. Know

    How to Collect Emails on Your Website

    How to Collect Emails on Your Website

Subscribe

Subscribe to receive the latest MAKING IT blog posts and updates, promotions and partnerships from Squarespace.

入力したメールアドレスが無効です。

ご登録ありがとうございます。