Unique Alternative Text

A screen reader user can jump from image to image by pressing G (G = Graphics) looking for a specific image. It is crucial to have short alt text that is unique especially when several similar images appear on the same page or platform slate. This will help the user decipher one image from another without listening to the long description (if provided).

Practices to Apply & Avoid

  • Ensure the alternative text is descriptive and unique to the image.
    For example:

    Bad alt text = “A flow chart.”
    Good alt text = “A flow chart showing four strategies in menu planning.”
    Long description = The details are as follows: strategy 1: remember menu planning priorities; guests, quality, operating limitations; financial goals. Strategy 2: consider menu categories. Strategy 3: select menu items for each category. Strategy 4: establish quality standards for menu items.
  • When multiple images appear on the same page that are similar in nature, provide alternative text that differentiates between them.
    To achieve this, here are a couple of techniques:
    Option 1 –
    Use the label method by placing part a and b next to the alt text. For example, the textbook exercise was entitled “Graphing 3.1, example 7”. You could use this method and place a and b to show the progression of the image.

    Alt text = “Graphing 3.1, example 7 a”
    (Note: long description in HTML is required.)

    Alt text = “Graphing 3.1, example 7 b”
    (Note: long description in HTML is required.)

    Option 2 – Describe the image as it appears.
    Alt text for first image = “Incomplete table values of variables x and y.”
    Alt text for second image = “Complete table values of variables x and y.”
    (Note: long description in HTML is required.)

  • Avoid using the same alternative text for similar images on the same page.

Dated: 2023-12-01