Images enhance click-through rates and make your emails more engaging. But they can complicate readers’ viewing experience, so you need to optimise any image you use.
One way to do this is to include an ALT attribute to each image.
⚡A definition #
ALT Attribute – An HTML code which provides a description of an image or graphic.
It is not the same as an image caption, which provides extra information about a picture. Instead, it acts as part of the image to describe it to those who cannot see the picture.
⚡What’s ALT text for? #
People may have different viewing experiences of the emails they receive.
- For security reasons, many people have images turned off by default
- Those with visual impairments might use a screen reader. This will only pick up on text, and will not translate images
For these groups, an image that is not accompanied by ALT text will show as a blank space.
But, if you write an ALT attribute, you open up this image for all to enjoy.
#
#
⚡Why is ALT text important? #
- It helps you to explain what value an image adds. If an image adds something to your text, for example, as a clickable link, you can say so. If it’s purely decorative, you can say that too. This means that those who don’t have images in their emails know if the image is something they can scroll past.
- Improves the accessibility of your mailing. Worldwide, 285 million people are visually impaired. That’s a big portion of your market that can’t access images without ALT text. Accessibility features also make things more logical and comprehensive for everyone.
⚡THE DO’S AND DONT’S #
Do:
✅ Keep it short and sweet – ALT text should be no more than two sentences
✅ Punctuate your ALT text – To help screen readers know when to pause
✅ Repeat text included WITHIN the image – If your image shows text of any kind, it is part of how readers understand the picture. Include it in your ALT attribute
✅ Let readers know if the image is purely decorative. Some images are nice embellishments which don’t add a lot of context. If this is the case, let readers know they can scroll past and not miss out. Write ‘Decorative image’ at the start of your attribute to explain this to screen readers
Don’t:
❌ Use quotation marks. The HTML uses quotation marks to point out the beginning and end of your ALT attribute. Adding quotation marks confuses it
❌ Repeat any text included OUTSIDE the image. Don’t re-write your caption or include any of your email’s content in the ALT attribute. This won’t help you to keep it short and sweet, and it isn’t necessary.
⚡The how-to #
Adding ALT text is simple.
- On Klaviyo, upload an image block to your email template.
- Then, under the Styles tab, find ‘Image Settings’.
- There will be a box that says ‘Alt text’, and allows you to give a brief description of your image.
⚡ALT TEXT: You, grinning because you understand image optimisation #
If you have any more questions, you might find the answer in these articles:
Remember, the team at Zap can help you set up and manage your email campaigns. If you need help with your image optimisation, drop us a line. We’ll help you get things moving.
