Use helpful alt text for on page images
Alternative (alt) text describes the purpose of the image as it relates to the content. Images should be used to enhance the content of a page, so writing alt text helps with screen readers and will show if an image becomes unavailable for any reason.
Write good alt text
- Use on non-decorative images.
- Keep it concise and descriptive
- Don't use "image of" or "photo of"
Example alt text in context
No context:
Two people riding scooters
On a page about student life:
Two students ride scooters outside the student union.
On a page about a partnership with a scooter company:
Students benefiting from the on campus partnership with e-scooters.
Complex images
Icons: Icon alt text should describe the information being conveyed by the icon, such as "Print" or "Visit our Instagram."
Images as links: Images that are used as links should have alt text that describes the action that is taken after clicking the image rather than the image itself.
Infographics: To include images that include complex graphical information or are a diagram, consider how to convey the information in the on-page text.