Alt Text Checklist

This tool has two parts. First, a short decision guide: answer up to four yes or no questions about an image and get tailored advice on what its alt text should do, with an example pattern. Second, an alt text checker: type your alt text and see whether it falls into common traps such as starting with “image of”, looking like a file name, being too long or being written in capitals.

Accessibility Runs in your browser

Work Out and Check Your Alt Text

1. Is the image the only content of a link or button (does clicking it do something)?
2. Is it a chart, graph, diagram, map or other image that needs a long explanation?
3. Does the image contain text that people need to read?
4. Is it purely decorative, or does nearby text already say everything it shows?
Type or paste the alt text exactly as it would appear in the alt attribute.

How to Use the Alt Text Checklist

  1. Answer the four questions about your image. The guidance below updates as you choose.
  2. Read the recommended approach and the example pattern.
  3. Type your alt text in the checker, choose what kind of image it is, and press Check alt text.
  4. Fix any Fail or Warning rows using the suggestion next to each one, then check again.

About This Tool

Content editors, marketers, developers and course authors who add images to pages and want a quick, practical way to decide what to write in the alt attribute.

Input: Your answers / alt text  ·  Output: Guidance and checks.

Features and Limitations

Features

  • Decision guide for decorative, informative, functional, complex and text-in-image cases, based on the W3C alt decision tree.
  • Ten checks: empty vs decorative, “image of” wording, file-name look-alikes, length over about 125 characters, ALL CAPS, repeated text, trailing full stop, URLs, placeholder words and HTML in alt.
  • Each check shows Pass, Warning or Fail as text and an icon, with a specific suggestion.
  • Shows the finished alt attribute with the text safely escaped.

Limitations

  • A checker can spot patterns, not meaning. Whether alt text accurately conveys the purpose of an image in its context needs human judgement.
  • The 125-character threshold is a common guideline, not a rule in WCAG; longer text is fine when it is truly needed, but consider a separate long description.
  • Image purpose depends on the surrounding content, so the same photo can need different alt text on different pages.
  • Nothing is stored or sent; the text you type stays in your browser.
  • Results are computed in your browser; nothing you enter is sent to a server.

Example

A search icon inside a button should have alt="Search" (what it does), not “magnifying glass”. A bar chart needs a short alt such as “Bar chart: sales rose 20% in 2025” plus the data in a table or long description.

Frequently Asked Questions

When should alt text be empty?

When the image is decorative or fully redundant with adjacent text. Use alt="" (not a missing attribute) so screen readers skip it. Never leave out the alt attribute altogether on an img element.

How long should alt text be?

As short as possible while carrying the same information. About 125 characters is a common upper guide because some screen readers split longer text. For charts and diagrams, give a short alt and put the detail in nearby text, a table or a linked long description.

Do I need to say “image of” or “photo of”?

No. Screen readers already announce that an element is an image. Start with the content itself. Mention the type only when it matters, for example “Oil painting of…” or “Screenshot of…”.

What should alt text be for a logo that links to the home page?

Describe the destination or function, for example alt="Acme home", not the appearance of the logo. If the visible text beside the logo already says the company name, you may use a short form of it.

Does an image of text need alt text?

Yes: the alt text should contain the same words as the image. Prefer real text styled with CSS whenever possible (WCAG 1.4.5 Images of Text); logos are an exception.

Related Tools

More like this: all Accessibility tools, all Developer & Web tools or the TinySandy home page.