Sitemap
Bootcamp

From idea to product, one lesson at a time. To submit your story: https://tinyurl.com/bootspub1

Writing effective alt-text

5 min readNov 16, 2024

--

Press enter or click to view image in full size

We use alt-text to describe images to screen reader users (including people with visual impairments, blindness, and dyslexia). Alt-text is also used to access information when the Internet’s slow or an error occurs while loading the page. Thanks to alt-text, the key information in the image remains accessible to everyone.

If you work in digital, you might think you already know about this. But errors with alt-text are among the most common issues in accessibility. I had to correct several of them in my portfolio after an accessibility audit. So it’s not as easy as it looks. That’s why I’m offering some tips to help you avoid future mistakes.

Consider the context

Before anything, ask yourself whether the image needs alt-text or if it’s just decorative. Alt-text should be provided when the image conveys essential information that is not already covered in the nearby text.

For example, imagine a title “Tamara’s wolf park” next to a photo of wolves in an enclosure. An appropriate alt-text could be: two wolves in an enclosure near a tree. Here, I indicate the number of wolves and their surroundings, as this information is not provided elsewhere. However, if this information was already covered somewhere, then the image would be considered decorative, and the alt-text could remain empty.

--

--

Bootcamp
Bootcamp

Published in Bootcamp

From idea to product, one lesson at a time. To submit your story: https://tinyurl.com/bootspub1

Responses (4)