missing-long-alt
Rule Severity : Moderate
Description
Complex images, such as charts, diagrams, and infographics, must have a long alt text that is meaningful and accurately describes the purpose or content of the image. Without detailed and relevant descriptions, users who rely on screen readers to interpret images cannot understand complex images.
Users with visual impairments depend on screen readers to interpret images. Complex images often contain critical information that is inaccessible to such users. Simply providing a short alt text may not be sufficient to convey detailed information. In such cases, it is essential to include accurate and meaningful long alt text that clearly conveys all of the key information in the image. This ensures that accurate information is accessible to all users.
Examples
The following example uses only a short alt text that lacks details conveyed in a graph. If such cases exists in your web pages, BrowserStack AI highlights those cases for you to correct.
The following corrected example provides a long alt text that gives a detailed description of the information in the graph.
How to fix?
Ensure the short alternative text (i.e., the “alt” attribute value) contains a brief description of the image. Further, add long description of the image using any of the following methods:
- Use
aria-describedby
to provide the long alt text. - Use
<figcaption>
within<figure>
elements to provide the long alt text. - Add a link adjacent to the image which directs to the long description.
- In the short alternative text of the image (the “alt” attribute), add a reference to where the long description exists in the web page.
References
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
We're sorry to hear that. Please share your feedback so we can do better
Contact our Support team for immediate help while we work on improving our docs.
We're continuously improving our docs. We'd love to know what you liked
Thank you for your valuable feedback!