NIH | National Cancer Institute | NCI Wiki  

Error rendering macro 'rw-search'

null

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Purpose of alt text

  • Adding alternative text to images is one of the easiest accessibility principles to learn and one of the hardest to master.
  • Alternative text may be provided in the alt attribute or in the surrounding context of the image.
  • Every image must have an alt attribute.
  • Alternative text should:
    • present the CONTENT and FUNCTION of the image.
    • be succinct.
  • Alternative text should not:
    • be redundant (be the same as adjacent or body text).
    • use the phrases "image of…" or "graphic of…".
  • Appropriate alternative text depends heavily on the image's context.
  • Alt text of a functional image (e.g., an image within a link) should describe the function as well as the content.
  • Decorative images still need an alt attribute, but it should be null (alt="").
Note

Alternative text must be included for every image posted on the wiki. Keep the alt text short; browsers truncate excessively long alt text. In addition, describe the important aspects of the image in the text. However, there is no need to precede alt text with "This is an image of" or explain its relative position on the page. Accessible technology users know when alt text is being read to them and require an equivalent experience to sighted users when it comes to the content of the image that they cannot see.

...

Confluence supports adding alternative text in the Insert Image windowProperties dialog box.

  1. Open the page on which you want to see the image.
  2. Select  Plus sign indicating Insert menu in ConfluenceImage Removed Plus sign indicating Insert menu in ConfluenceImage Added> Files and Images.
  3. Select the image to insert.
  4. Click the image to display the image properties menu.
    Image properties menu
    • Adding a border and reducing the size of the image can give it a more professional look.
  5. Click the Properties button.
  6. The Image Properties dialog box appears.
    Image Properties dialog boxImage Added
  7. Enter Alt text in the Alt text field. The Title is not required.
    Image Properties dialog boxImage RemovedDo not add text in the Title text field.

Add alt text in the XHTML

...