My Approach to Alt Text

I ran across a survey from Tilburg University on the experiences and perspectives of image describers. It asked what process I follow to write image alternative text, and it occurred to me that I don’t use a checklist or guideline anymore. That may or may not be a good thing, but since I’ve been told that my alternative text is generally good for the context (more than once but not always), I thought it might be useful to scribble what I generally do.

Useful for the next time I am asked, useful for readers to correct me, useful for other readers to borrow, useful for me to amend, and so on.

My Approach

Broadly, when talking about images in narrative content that are not also iconography or used as part of interactive controls…

• I consider the audience who may encounter it (social media followers, users of a marketing site, customers for an e-commerce flow, my blog, etc.)
• I factor in their potential experience, skill level, reading level, and general technology profile.
• I look to the surrounding context to understand what detail is already provided and what would be necessary to convey.
• Then I consider how the alternative text will be exposed (by screen reader navigation techniques or display type), when images are broken, as part of an accessible name (for a link or button or whatever), and so on.
• Then I work at writing content that front-loads the important bits and tries to maintain any surrounding tone and style.
• This may include identifying people by race, gender, ability and so on, or it may not.
• I try to avoid describing things not in the image, by removing editorializing and carving out SEO efforts.
• I factor in cultural cues that may need to be conveyed but might not be in straightforward descriptions.
• When images are gags or puns, I try to preserve the intent as much as possible.
• I consider punctuation (avoiding periods mid-stream, using proper quotes versus attribute-ending double primes) and am careful to avoid line feeds.
• I do not use emoji (perhaps there is a corner case that might warrant one).
• I look to what I can move to an adjacent structured description while keeping a minimal description (think about charts and graphs).
• In those cases, my alternative text references the adjacent description versus using a blank alt.
• In all this, I work to keep the content as brief as is reasonable.

This incomplete list is not meant to suggest other guidance is wrong or less than ideal. Writing alternative text is not a technical exercise (at least, not beyond basic WCAG conformance); it is copywriting tailored to your audience and constraints. There should be as much care and consideration as all the other plain text content on the page (or social media post or whatever).

Further Reading

Some reference material:

• An alt Decision Tree from W3C’s Web Accessibility Initiative
• How to Write Alt Text and Image Descriptions for the visually impaired from Perkins School for the Blind
• Text descriptions and emotion rich images by Léonie Watson
• Short note on coding alt text by Steve Faulkner
• The perils of using double quotes "" inside an alt attribute text value by Steve Faulkner
• ALT LEFT by Steve Faulkner
• There is no character limit for “alt text” by Eric Eggert
• On Describing Comics by Liana Fink
• Your Image Is Probably Not Decorative by Eric Bailey
• How to write text descriptions (alt text) in BBC News articles from BBC GEL
• Alternative text in action from Gov.UK
• How To Write Alt Text For Memes by Veronica Lewis
• Old alt text advice by Steve Faulkner

My stuff:

• The Writing Alternative Text section from Improving Your Tweet Accessibility, 6 January 2018
• Accessible Memes Can Be Done, 24 April 2018
• Blaming Screen Readers 🚩×5, 16 October 2021
• Reference: SRs and Extended Characters, 19 October 2021
• An alt Decision Tree Using Only :has(), 13 August 2023
• Long Alt, 20 April 2024

If you have your own favorite resources or techniques, then please share.