Each image requires alternative text that is equivalent to the information it conveys, unless the image is purely decorative and provides no useful information. So you need to be careful about what value you give the alt
attribute.
Examples
✗ Bad example
Omitting an alt
attribute provides no information to screen-reader users.
<img src="path/to/image.jpg">
✓ Good example: providing an alt attribute
Supply alternative text through the alt
attribute. The alternative text should provide information equivalent to what’s conveyed in the image:
<img src="path/to/image.jpg" alt="Your alternative text.">
✓ “Null” example
Some images are purely decorative and have no useful information to convey non-visually. In these cases, you should use an empty or “null” alt
attribute, as demonstrated below:
<img src="path/to/image.jpg" alt="">
Video: Alternative text with VoiceOver and Safari
Code editor
Code editor for an image of a bus with descriptive alternative text (external link)
See the Pen image with descriptive alternative text by HUIT - Web, UX and Digital Accessibility Services (@hwpdas) on CodePen.