Many alt text issues can be fixed automatically. In the Accessibility report panel, click the Fix with Edlio AI button next to flagged issues — Edlio AI can generate alt text descriptions for you. See Fix Automatically with Edlio AI for details.
To add Edlio AI to your account, click Fix automatically with Edlio AI on your Accessibility Report and then Contact us to start using Edlio AI today!, or simply email [email protected].
Alt text (alternative text) is a brief description of an image that can be read by screen readers, search engines, and other assistive technologies. Providing alt text is crucial for ensuring your site's accessibility. Effective alt text should be concise and accurately describe the image's content.
When thinking about what alt text description to write, ask yourself: why is the image is being used and what message does it convey? Parity in what is being communicated in images and in text is key.
Don't want to generate every alt text description yourself? Let Edlio AI do it for you! Check it out in your Accessibility Report features.
Common Alt Text Errors and How to Correct Them
Here are some common alt text errors that Accessibility will flag, along with tips on how to correct them.
Missing Alt Text
Provide alt text unless the image is completely decorative and not needed to understand the page's content.
Alt Text contains only blank spaces
Provide a meaningful description or alt="" ONLY if the image is purely decorative.
Alt Text has only one word
One word is likely to be insufficient to describe the content of the image. Make sure the alt text conveys who is doing what action and where, and include any text present in the image.
Alt text has more than 100 characters
The alt text might be too long. Ensure that it is as concise as possible while accurately describing the image.
Two or more images sharing the same alt text
If the images are different, their alt text should also be different. Provide unique descriptions for each image.
Alt Text starts with the word "image", "picture", or "photo"
It's unnecessary to provide words such as image or photo since screen readers already inform viewers that the item is an image. The alt text should directly describe the image content without redundant information.
Alt Text for images used as links
When using an image as a link, make sure to describe where the link leads to when clicked and not just the alt text for the image. This helps users understand the destination or action associated with the image link.
Images with "burnt-in" text
When an image has text as a part of the image, otherwise known as "burnt-in text", like the words "Back to School" in the example image below, this text must be a part of the alt text description to give full accessibility to what the image is communicating for your website visitors using screen readers to engage with your site.
When using an image as a link, make sure to describe where the link leads to when clicked and not just the alt text for the image. This helps users understand the destination or action associated with the image link.
Don't use PDFs as Images
Remember that all text that appears in images must also be included in alt text, and that screen readers can't read text from images. Therefore, avoid saving PDFs as PNGs. Instead, ensure your PDF is accessible and upload it using the File Page Block.
See PDF Accessibility and File Page Block.
Related