Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Check alt text in three passes: inventory every image, classify its purpose, and review the wording in the page context. Informative images need a concise description of their meaning; decorative images need alt=""; images that act as links or buttons need text describing the destination or action. Automated scanners can locate missing attributes, but only human review can determine whether an alternative is accurate and useful.

What good alt text does

Alt text is a text replacement for an image, not a filename or a caption. It should preserve the information or function a visitor would lose if the image could not be seen. Screen-reader users, people browsing with images disabled, and people using speech input all rely on that replacement. Search engines also use it to understand images, but search optimization does not change the accessibility requirement.

Read the alternative together with the sentence before and after the image. If the surrounding copy already supplies the same fact, a shorter alternative—or a null alternative when the image is redundant—usually gives the clearer result.

Classify each image before writing

Purpose What to put in alt Example
Informative The useful visual information in context alt="Dalmatian puppy playing fetch"
Decorative An empty (null) value alt=""
Functional The action or destination of the control <a href="/next"><img ... alt="Next page"></a>
Complex A brief summary, with complete detail in nearby or linked text alt="Line chart showing monthly sign-ups rising from January to June"

Informative images

Name the subject and the detail that matters to the page. “Dalmatian puppy playing fetch” is useful; “dog.jpg” and “image of a dog” are not. Do not begin with “image of” or repeat a visible heading unless that repetition adds meaning.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Decorative and redundant images

Use alt="" for borders, flourishes, background ornaments, and images that duplicate nearby text. Keep the attribute present: omitting alt can cause assistive technology to announce a filename or attempt to infer a description. A decorative image must not use a space or a descriptive word in place of the empty value.

Images that are links or buttons

Describe what activating the control does, not its shape or color. An arrow icon that advances a carousel needs “Next slide”; a magnifying-glass control needs “Search.” If a linked image and adjacent text repeat the same destination, make one alternative empty and let the remaining text provide the accessible name.

Charts, diagrams, maps, and other complex graphics

Give the image a short, decision-useful summary in alt, then provide exact values, relationships, or instructions in surrounding HTML or on a linked description page. A chart alternative should not attempt to encode every data point in one attribute. An accessible data table is often the best long description.

A complete alt-text audit workflow

  1. Inventory the images. Include CMS content, templates, component libraries, server-rendered HTML, client-rendered views, inline SVG, image maps, and image-like controls. Record the URL, selector or content ID, owner, and page context so corrections can be maintained.
  2. Find candidates automatically. Scan rendered pages and source templates for <img>, linked images, SVGs used as controls, and missing or empty attributes. Run the scan across representative routes, authenticated states where applicable, and responsive breakpoints. A scanner is a locator, not a judge.
  3. Assign a purpose. Mark each candidate informative, decorative, functional, or complex. Ask what a visitor must know or do at that point in the page. The same file can need different alternatives in different contexts.
  4. Rewrite informative text. Keep only details that convey the image’s purpose. Mention visible text, people, objects, states, or relationships that the surrounding copy does not already provide. Remove filenames, keyword lists, and visual trivia.
  5. Fix decorative images. Add an explicit empty value: alt="". Check that CSS background images are genuinely decorative; if a background conveys content, provide that content as HTML text.
  6. Fix functional images. State the destination or action (“Download invoice,” “Open account menu,” “Next page”). Test keyboard focus and screen-reader output so the accessible name is not duplicated by a tooltip or adjacent label.
  7. Document complex graphics. Put a concise summary in alt and expose the underlying data or explanation in text. Ensure the long description remains available when scripts or images fail.
  8. Review in context. Read the page with images hidden or with a screen reader. Compare the alternative with the preceding and following copy. Edit wording that is technically present but misleading, incomplete, or repetitive.
  9. Check repeated components. Cards, carousels, product grids, and responsive variants often reuse one asset with different purposes. Verify that each rendered instance has the correct alternative and that mobile and desktop versions do not conflict.
  10. Prevent regressions. Add an automated check to continuous integration or the CMS publishing workflow, assign an owner for exceptions, and sample complex and functional images during every content release.

How to check alt text yourself

Inspect the HTML

Open the page, choose View source or the browser developer tools, and search for <img. Confirm that each content image has an alt attribute, that decorative images use alt="", and that linked images name the action. Inspect the final DOM, not only a template: JavaScript frameworks can add, replace, or remove attributes after load.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Test with images disabled

Temporarily block images in the browser or use a text-only reading mode. The page should still identify important subjects, controls, and chart conclusions. This catches alternatives that are present but do not communicate the page’s purpose.

Use a screen reader or keyboard-only pass

Tab through image links and buttons. Listen for duplicate names, filenames, empty controls, and controls whose action is unclear. For a longer audit, use a screen reader’s elements list to review all graphics and links, then return to the page to verify context.

Run an automated scanner

Accessibility checkers are valuable for finding missing alt attributes and obvious patterns at scale. Configure them to crawl rendered, authenticated, and dynamically loaded pages where your site requires those states. Treat every result as a review queue: automation cannot reliably decide whether a description is equivalent to the image or whether an image is decorative in its particular context.

Writing rules that prevent common mistakes

  • Be concise but specific. Include the information needed for the task, not every visible detail.
  • Use context. The right wording for a product photo in a catalog differs from the same photo in a photography tutorial.
  • Do not keyword-stuff. Search guidance favors useful, information-rich alternatives used naturally in context. Repeating target terms or adding unrelated phrases harms readability and can be treated as spam.
  • Do not put essential text only in an image. Reproduce headings, prices, warnings, and instructions as real HTML whenever possible.
  • Keep punctuation natural. A sentence fragment is fine; excessive punctuation can make some screen readers verbose.
  • Localize meaning, not filenames. Translate the alternative when the page is translated, and preserve proper names accurately.

Examples you can adapt

<!-- Informative -->
<img src="dalmatian.jpg" alt="Dalmatian puppy playing fetch">

<!-- Decorative -->
<img src="divider.svg" alt="">

<!-- Functional -->
<a href="/next"><img src="arrow-right.svg" alt="Next page"></a>

<!-- Complex image with nearby detail -->
<img src="signups.svg"
     alt="Line chart showing monthly sign-ups rising from January to June"
     aria-describedby="signups-data">
<div id="signups-data">January: 120; February: 145; March: 171; April: 210; May: 238; June: 264.</div>

For a purely decorative SVG embedded inline, use an empty accessible name and ensure it is not exposed as a meaningful graphic. For an icon-only button, put the action on the button itself when possible; do not rely on a tooltip as the only label.

What’s actually slowing this PC down?

Pick the symptom - the matching free tool is one click away.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

What automated tools can and cannot tell you

Audit question Automation Human review
Is an alt attribute missing? Usually detects it across crawled pages. Confirms the page state was actually rendered.
Is the image decorative? May flag an empty value but cannot infer intent reliably. Determines whether the image adds information or is redundant.
Does wording match the image and copy? Cannot judge equivalence consistently. Reads the image and surrounding content together.
Does a control have a clear action? Can identify some unnamed controls. Verifies destination, keyboard behavior, and duplicate labels.
Is a complex graphic explained? May find a missing attribute. Checks that trends, values, and relationships are available as text.

Performance, reliability, and maintenance

Large audits fail when crawlers see only the initial HTML. Wait for client rendering, authentication, lazy-loaded images, and route transitions before evaluating the DOM. Keep a URL sample for templates, error pages, search results, and repeated components. Record false positives and approved exceptions so the same issue is not reopened every release.

Alt text itself has negligible transfer cost, but inconsistent CMS workflows create long-term accessibility debt. Make the field required for informative and functional images, offer an explicit “decorative” choice that writes alt="", and reject filenames or keyword strings in editorial review. For complex graphics, require a linked data table or description before publishing.

Troubleshooting common failures

“The scanner says alt text is missing, but I added it.”

The crawler may be inspecting a cached page, a pre-JavaScript response, or a different template. Purge the relevant cache, confirm the final DOM in developer tools, and recrawl the exact URL and state that users receive.

“An empty value is reported as an error.”

Many tools flag every empty value even when it is correct. Verify that the image is truly decorative or redundant, keep alt="", and document the exception rather than replacing it with “decorative image.”

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

“The same image needs different text.”

Alt text belongs to the use, not the file. Supply context-specific values in each component; do not force one library-level description onto product cards, galleries, and instructional pages.

“The chart has a good summary but users need the numbers.”

Keep the short summary in alt and add a visible data table or linked long description. Never compress all values into one unwieldy attribute.

“A linked icon is announced twice.”

Inspect the accessible name sources: image alternative, link text, ARIA label, and adjacent visible text. Keep the clearest one and make redundant images empty.

Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Or skip the browser setup

For screenshots of audited pages, ScreenshotNeo can capture the rendered result through one request. It accepts consent banners before capture and removes more than 60 known consent platforms, newsletter popups, and chat widgets; each step can be disabled. Bot checks, blank pages, timeouts, failed loads, and cache hits are not billed, and response headers identify the page verdict and billing status. Its MCP server provides take_screenshot, get_page_info, and capture_pdf tools for Claude, Cursor, and other MCP clients.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

The API supports full-page captures with lazy images loaded, CSS-selector element captures, custom CSS and JavaScript, waits, headers, cookies, user agents, blocking rules, device and viewport settings, PDFs, HTML-to-image, caching, signed links, asynchronous jobs, bulk capture, and a usage API. Every plan includes every feature. The Free plan includes 1,000 shots per month without a card; paid plans start at $5 for 3,000 shots.

See the ScreenshotNeo documentation for options and authentication. Example:

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp
import requests
r = requests.get("https://api.screenshotneo.com/v1/shot", params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"}, timeout=90)
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

Create a free ScreenshotNeo account to get 1,000 screenshots a month with no card.

FAQ

Should every image have descriptive words?

No. Decorative or redundant images should have an explicitly empty alternative so they are skipped.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Is a filename acceptable alt text?

Only if the filename itself is the meaningful content, which is uncommon. Replace it with the information or action users need.

Can alt text replace a long caption?

No. Use a short alternative and put extensive explanation or data in normal page text or a linked description.

Does alt text guarantee better rankings?

No. It helps search engines understand images when it is useful and contextual; stuffing keywords is counterproductive.

Frequently Asked Questions

Should every image have descriptive words?

No. Decorative or redundant images should have an explicitly empty alternative so they are skipped.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Is a filename acceptable alt text?

Only if the filename itself is the meaningful content, which is uncommon. Replace it with the information or action users need.

Can alt text replace a long caption?

No. Use a short alternative and put extensive explanation or data in normal page text or a linked description.

Does alt text guarantee better rankings?

No. It helps search engines understand images when it is useful and contextual; stuffing keywords is counterproductive.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.

Free tools Windows power users keep installed

One-click scans. No signup required.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.