Using images accessibly
This guidance is for anyone who creates or publishes digital content and uses images. It explains how to make images accessible in web pages, documents, presentations and emails.
Why images matter
Images can improve understanding, but they can also exclude people if they are not used carefully. People who use screen readers, have low vision, or have cognitive impairments may miss important information if images are not accessible.
Images are one of the most common sources of accessibility issues across University content.
3 simple ways to improve accessibility
- Add alternative text to images that convey information.
- Mark decorative images as decorative.
- Avoid putting important text inside images.
Before you add an image
Before using an image in your content, decide what the image is for:
- Does it add information or meaning?
- Is it purely decorative?
- Does it contain text?
- Is it complex (for example, charts, diagrams or infographics)?
- Is it functional (does it act as a link or button)?
Most images that add information will need alternative text.
Image guidance
Open the section that best matches the type of image you are using.
Informative images
Use this for images that add meaning or information to the content, such as photos, illustrations, diagrams or screenshots.
What to do
- Add alternative text that describes the purpose of the image.
- Keep alternative text concise (usually one sentence).
- Focus on what the user needs to understand, not visual detail.
- Avoid phrases like “image of” or “picture of”.
Example
Image: Students working in a laboratory.
Alternative text: Students wearing lab coats working together in a biology lab.
Decorative images
Use this for images that are purely visual and do not add information, such as background images or decorative icons.
What to do
- Mark the image as decorative using your platform’s settings.
- Do not add alternative text.
- Ensure the image does not interrupt reading order for screen readers.
Examples
- Background or banner images.
- Dividers or stylistic icons.
- Stock images that do not add meaning.
Decorative images should be skipped by screen readers.
Images that contain text
Use this for images that include written text, such as posters, screenshots or text-based graphics.
What to do
- Avoid placing important information in images wherever possible.
- Use real text in the page or document instead of embedding it in an image.
Text in images can cause accessibility problems because it cannot be resized, customised, or reliably read by screen readers.
If text in an image is unavoidable:
- Provide the same text in the surrounding content.
- Add alternative text that describes the message, not just the appearance.
Complex images (charts, diagrams and infographics)
Use this for images that present data, trends or relationships.
What to do
- Add a short alternative text describing what the image shows.
- Provide a longer explanation in the surrounding content.
- Focus on the key trends, patterns or conclusions.
- Do not rely on colour alone to convey meaning (for example, “the red line shows…”).
- Provide a well-structured data table as an alternative format.
Functional images (links and buttons)
Use this for images that act as clickable links or controls.
What to do
- Ensure the alternative text describes the action or destination.
- Do not describe the appearance of the image.
Example
Alternative text: Download the facilities brochure (PDF).
Colour and contrast (applies to many images)
Some accessibility checks apply across multiple image types, particularly when images include text, icons or data.
What to do
- Ensure sufficient contrast between foreground and background.
- Do not rely on colour alone to communicate meaning.
- Check contrast using appropriate tools where possible (for example, the WebAIM contrast checker).
Pay particular attention to:
- infographics;
- diagrams and charts;
- images with overlaid text;
- annotated screenshots.
Where this applies
Use these principles whenever you include images in:
- web pages;
- word documents and PDFs;
- powerPoint presentations;
- emails;
- social media content.
Different tools handle alternative text differently, so you may need to refer to platform-specific guidance.
Support
If you are unsure how to describe an image or whether it needs alternative text, contact your local web or digital team for advice.