Cancel simulation
(or press "esc")

Skip to main content
(press enter)

Images

Images are one of the elements on a page that people with vision problems may find difficult, or even impossible, to see.

To fix this issue you should add alternative text to each image. Its purpose is to describe the image so that a user that uses a screen reader will know the content of an image.

Using alternative text in HTML

The following HTML code shows how to add an alternative text to a simple picture. The description must be complete and concise.

<img src="2-cats.jpg" alt="Two grey cats cuddling" /> 

Two grey cats cuddling

Using alternative text in Microsoft Word

To add an alternative text to an image in a Word document:

  1. Right click on the image,
  2. Select Edit Alt Text...,
  3. Add your description.

Screenshot of Lorem Ipsum Word file

Using alternative text in Adobe Acrobat

To add an alternative text to an image in a PDF document using Adobe Acrobat:

  1. Click on Accessibility tool,
  2. Select Set Alternate Text,
  3. Type the most appropriate image description.

Screenshot of Lorem Ipsum PDF file

Quick note for images used as decorations

In the case the image is used for decorative purposes, for example as a background or a corner decoration, there is no need to assign an alternative text. In Microsoft Word or Adobe Acrobat you have the option to tick the "Decorative figure" box however, in HTML, you can simply leave the quotation marks relative to the alt text empty:

<img src="my-background.jpg" alt="" />