Image Alt Text Coverage Scanner
Audit your website for missing alt attributes, generic placeholder text, and decorative image compliance to meet WCAG 2.1 Level AA requirements.
How Alt Text Coverage Auditing Works
1. What This Tool Actually Does
The scanner extracts every <img> tag from a page's HTML (fetched live or pasted) and sorts each one into exactly one of four buckets. Good: a non-empty, non-suspicious alt attribute is present. Decorative: alt="" is explicitly set, which correctly tells assistive technology to skip the image entirely. Missing: no alt attribute exists at all, so screen readers fall back to announcing the raw filename or URL. Suspicious: an alt attribute exists but matches a low-quality pattern — generic words, filename-shaped strings, or text over 150 characters.
The overall Coverage Percentage is calculated as (good + decorative) / total images, since both of those categories represent a correct accessibility decision — one supplies real information, the other correctly signals "nothing to announce."
2. How to Use It
- Choose "Scan Webpage URL" for a live page, or "Paste HTML Code" for markup behind auth or generated client-side.
- Review the Alt Text Conformance percentage and the four-category breakdown (Total, Descriptive, Decorative, Missing) at a glance.
- Open the Image Inventory to see every detected
<img>individually with its resolvedsrcand status badge. - Prioritize red "missing" entries first — these are total accessibility blockers — then address amber "suspicious" entries by rewriting the alt text to be specific and concise.
- Re-scan the page after edits to confirm coverage climbs toward 95%+ before considering the page done.
3. The Underlying WCAG Concept
Image alt text exists to satisfy WCAG Success Criterion 1.1.1 Non-text Content — Level A: "All non-text content that is presented to the user has a text alternative that serves the equivalent purpose." This single criterion actually branches into several distinct sub-cases depending on the image's role:
- Informative images (product photos, diagrams, illustrative content) need a concise
altdescribing what the image conveys. - Decorative images (visual flourishes with no informational value) should use
alt=""so screen readers skip them, avoiding unnecessary noise. - Functional images (an image inside a link or button, like a logo linking home, or a magnifying-glass search icon) need alt text describing the destination or action, not the picture itself — e.g.
alt="Go to homepage", notalt="company logo". - Complex images (charts, infographics, data visualizations) typically need a short
altplus a longer text equivalent nearby, since a single short string can't convey chart data.
4. A Worked Example
Paste this HTML: <img src="hero-banner.jpg"><img src="divider.svg" alt=""><img src="team-photo.jpg" alt="IMG_2049.jpg">. The scanner returns three distinct results: the first image has no alt attribute at all and is flagged Missing ("Screen readers announce filename"); the second is correctly marked Decorative since alt="" is explicit; the third is flagged Suspicious because "IMG_2049.jpg" matches the filename-pattern detector — it's technically present but conveys zero real information about the team photo it's meant to describe.
Coverage here comes out to 33% (1 of 3 correctly handled — the decorative one), which is exactly the kind of result that looks alarming in the scorecard but is fixed with two targeted edits rather than a full content rewrite.
5. Who Actually Uses This Tool
- Content marketers and editors: audit blog and CMS media libraries where alt text is frequently left blank by writers focused on publishing speed.
- WordPress theme and plugin developers: verify that theme-generated markup (featured images, galleries, sliders) doesn't hardcode empty or filename-based alt attributes by default.
- E-commerce teams: ensure every product photo has a distinct, descriptive alt string so screen reader shoppers can browse a catalog page as effectively as sighted shoppers.
- SEO specialists: descriptive alt text also feeds Google Images indexing, making this a rare case where accessibility remediation and organic search visibility improve together.
6. Common Mistakes & Limitations
- Semantic accuracy isn't checked: the scanner can confirm alt text exists and isn't a generic placeholder, but it cannot verify the description actually matches the image content — that judgment call remains human.
- CSS background images are out of scope: only
<img>elements are scanned; decorative or informative content delivered via CSSbackground-imageneeds separate review. - Functional-image nuance: the tool flags an image as "good" if any non-generic alt text is present, but it can't tell whether a linked logo's alt text describes the image ("company logo") versus the link's actual destination ("Go to homepage") — the latter is the correct pattern.
- Lazy-loaded images: if alt text is only injected after JavaScript populates a
data-src/srcswap, the live URL scan may see a different attribute state than what actually renders — use "Paste HTML" with the fully rendered DOM for those pages.
Frequently Asked Questions
What is the purpose of image alt text in WCAG 2.1 Level AA?
Alt text provides a text alternative for non-text content (WCAG Success Criterion 1.1.1). It is articulated by screen readers for blind users, displayed by browsers when image downloads fail, and indexed by search engines to understand visual context.
When should an image use empty alt text (alt="")?
Purely decorative images (background flourishes, subtle divider icons, visual borders) that provide no informational context should have alt="" or aria-hidden="true" so screen readers skip them cleanly.
Why should placeholder filenames (e.g. alt="IMG_102.jpg") be avoided?
Filenames provide no meaningful context to visually impaired visitors. A screen reader reading "IMG_4920.jpg" does not convey the subject or purpose of the visual element.
Does this scanner protect against SSRF vulnerabilities?
Yes. All live audits enforce strict SSRF safeguards, blocking requests to localhost, loopback addresses (127.0.0.1), private RFC-1918 networks, and cloud instance metadata services.
How does the scanner decide alt text is "suspicious" rather than just missing?
It checks the alt text against known low-quality patterns: generic words like "image", "photo", or "icon", filename-like strings such as "IMG_2049.jpg" or "DSC_0012", and descriptions over 150 characters (a signal of an unfocused, run-on description rather than a concise one). These are flagged separately from missing alt because a fix requires rewriting content, not just adding an attribute.
Can this tool tell me if my alt text is actually accurate?
No. Pattern matching can catch obviously low-quality placeholders, but it cannot verify that "Golden retriever puppy on a beach" is actually true of the pictured image. Semantic accuracy of alt text always requires a human reviewing the image against its description.
What about background images set via CSS instead of <img> tags?
CSS background-image properties are outside this scanner's scope since it audits HTML img elements. Background images are, by convention, treated as decorative and excluded from the accessibility tree — but if a CSS background image conveys real informational content, it should generally be converted to a foreground <img> with proper alt text or exposed via an ARIA-described mechanism.
Should every product photo on an e-commerce site have unique alt text?
Yes. Generic alt text like "product image" repeated across dozens of listings gives screen reader shoppers no way to distinguish items. Each product image should describe the specific item, color, and relevant visual detail a sighted shopper would notice at a glance.