‍15% of your subscriber base cannot read your emails.

‍

Just as you read it, it doesn't matter how impressive and thoughtful the design of your email is, that you have aligned it 100% with your brand guide, or that it has passed through the quality filter of your best art director.

‍

‍Do you sendall your emails 100% image-based?

‍

You have just made reading more difficult for hearing assistance tools.

‍

‍do you usesmall text because it is more elegant and aesthetically pleasing?

‍

Older adults will have more difficulty reading blocks of text and will miss your communication.

‍

As Cap says, I could go on with this list all day.

‍

‍

Luckily, the Email Geeks at Orange Digital work hard to find and enforce Accessibility best practices that ensure that 100% of your subscribers can read your communication, in the best possible way no matter what email client they receive it in, or what tool they use to read it.

‍

What is the situation in Mexico?

‍

15% of the world's population has a disability. Of these, according to INEGI, in Mexico 2 million 237 thousand people have a visual impairment. Add to this the fact that in Mexico and Latin America we have a very large gap in the management of best email practices, and neither clients nor designers are willing to invest in adjusting their communication, and things get even more complicated. 

‍

Most of the emails I receive every week in my inbox are 100% image-based, and when I open them in Outlook, surprise! They arrive with image blocking. Just look at this beauty:

‍

In addition, nowadays we can ask Alexa to read emails to us when we are driving or while we run the first 5k of the day, the Outlook app for iOs already allows reading aloud the emails that arrive in your inbox. Sounds great right? Well, it easily becomes a nightmare if your email is not prepared for it. Having alternative texts in the images and using semantic code in the text blocks is vital for these current tools to do their job properly.

‍

3 simple accessibility rules to improve email communication

‍

Surprising as it may seem, making sure your email is readable for all your users is easier than it seems. I'm going to tell you 3 basic rules so that from now on, all your emails have a chance to be read.

‍

1. Use semantic code in HTML

‍

‍

‍

Emails are based on HTML and CSS code, just like websites. You could say they are first cousins. And you may not be that familiar with the coding language, but stay with me as I tell you about it with an analogy.

‍

Remember that scene in the Simpsons where Mr. Burns wants to hire Steven Spielberg, but instead hires his Mexican equivalent?

‍

‍

Well, something similar happens here, we are using elements that are visually similar, but behind the scenes they work completely different.

‍

Pasa lo mismo en el código para escribir títulos (<h1>), subtítulos (<h2>, <h3>) y párrafos (<p>).

‍

Al escribir código, o usar herramientas como el editor visual de Salesforce Marketing Cloud, es muy fácil que el código se salga de control, y terminemos utilizando elementos que no son apropiados para ello, como utilizar <span> para escribir párrafos y saltos de línea (<br>) para cambiar de un párrafo a otro.

‍

‍

Visual assistance tools depend on well-written code to provide a good experience for your subscribers. So, the next time you are designing an email, think about these specifications.

‍

‍

2. Maintain a balance between the use of images and code for text and buttons.

‍

‍

Remember the example at the beginning of the note where all the images appeared blocked?

‍

It still haunts me in my worst nightmares. Designing and laying out your emails is an art that requires balance.

‍

To achieve this balance, follow these two tips:

• If you are going to add an element with text, do it with code (using semantic code)
• If you are going to load an image that has text, separate both elements and use code for text

‍

‍

Using live text, or text made with code, has many benefits:

‍

• Visible even with Outlook image blocking, helping users understand the communication at a glance
• Appear in searches from your subscribers' inboxes
• Text is responsive and can be made larger on mobile devices

‍

The only benefit of creating image-based emails is that they will look the way the brand guide expects them to look, but this has negative consequences:

‍

• Text within images is not responsive and does not adjust to different device sizes
• Users with reading difficulties will want to zoom in on images, and this can be difficult to achieve.
• Decrease the % of deliverability of your mailings
• Message will be lost with image blocking

‍

If none of this sounds appealing to you, remember that the security mechanisms that Inbox providers such as Gmail and Outlook have in place take these best practices into consideration when deciding whether to allow emails to pass through to users' inboxes.

‍

‍

3. Describe your images with alternative text

‍

‍

Having a descriptive for your images is essential, every image that is uploaded in an email must contain the alt-txt attribute, which helps support tools to describe their content to subscribers.

‍

Each image is part of the email storytelling, in combination with the text. The description of these images must contemplate the context of the message you want to communicate.

‍

‍

In my very personal point of view, the alternative text should be written as part of the copy structure of each email.

‍

Think about it for a second, if the image lock is activated, what is left is the live text written in the code plus the alternative text.

‍

That's also the way it's experienced by people who are visually impaired or use software like Alexa or Siri to read emails to them.

‍

If your image is decorative, i.e. it is not a main communication element, the best thing to do is to leave the alt attribute empty. It should be present in the code to improve your accessibility score, but it should not have anything in it.

‍

This way when readers pass by it, they will not read it or announce the image as an image.

‍

Conclusion

‍

Small changes generate big results.

‍

Follow these 3 accessibility rules in the next emails you send and I assure you that your subscribers will be grateful. 

‍

‍

In 3 steps you increased your deliverability, optimized the visualization of your communication and helped support tools better understand how to read your mailings.

‍

El Cap would be proud of us.  

‍

I'd love to hear how you did after making these adjustments to your campaigns, tell me more in the comments, see you soon!

‍

‍

‍

‍

‍

‍

‍

‍