Show and tell and demo: Göransson on alt-text

Thanks to a retweet by Beth Fox, I came across Daniel Göransson‘s 2017 post, Alt-texts: The Ultimate Guide. It’s well worth reading in full, but I want to summarize why I think that.

Göransson is visually impaired, and his screen reader comes across lots of what he calls alt-text-fails, like image file names or photographer credits. As he says:

An alt-text is a description of an image that’s shown to people who for some reason can’t see the image…

Alt-texts are super important! So important that the Web Content Accessibility Guidelines (WCAG) have alt-texts as their very first guideline

For a long time on my blogs, including this one, I treated alt-text as a way to show a kind of cleverness: many of the images here have alt-text that was intended as a pun or a side comment; it doesn’t describe the image at all. So it was no help to anyone.

Describing: it depends

Göransson points out what should be obvious: what you put in the alt-text description depends on context. Here’s an image from his post:

Head and shoulders of a man standing outside.
This image appears in Daniel Göransson’s article on the Axess Lab site.

If the context was about a TV series, he says, the alt-text might be:

Star of the show, Adam Lee, looking strained outside in the rain.

In an article on photography, though:

Close up, grayscale photograph of man outside, face in focus, unfocused background.

The top items for me from Göransson:

  • Describe the image in context.
  • Keep it concise.
  • Don’t say it’s an image (as in, don’t put “image of” or similar in the alt-text).
  • End with a period (so the screen reader will pause for a moment).
  • Always include text labels with icons.

That last point is about alt-text, in a sense: he’s saying put text on screen next to an icon, and not in alt-text. Icons shouldn’t stand alone, as users who didn’t create the icons could tell you. (That’s a whole other story, as this link from his article illustrated.)

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.