Warning Link or button with no accessible text
Why an <a> or <button> with no text, aria-label, or alt-labelled image inside it announces nothing to a screen reader.
The validator flags any <a href> or <button> with no visible text content, no aria-label or aria-labelledby, and no child image carrying real alt text.
Example
<!-- Wrong: icon-only button, nothing for a screen reader to announce -->
<button><svg>...</svg></button>
<!-- Right: labelled -->
<button aria-label="Close dialog"><svg>...</svg></button>
<!-- Also right: an image with real alt text counts as accessible content -->
<a href="/"><img src="/logo.png" alt="Home"></a>Why it matters
Icon-only buttons and image links are common in real interfaces — a close button, a hamburger menu toggle, a logo link — and it's easy to ship one with no text at all, since it looks perfectly fine visually. A screen reader has nothing to read aloud for a genuinely empty control: it typically announces just "button" or "link" with no indication of what it does, or in some cases nothing usable at all. Sighted users relying on the icon's shape never notice this gap, which is exactly why it's a common, easy-to-miss accessibility bug.
Frequently asked questions
Does an icon inside the button count as accessible text?
Not on its own — an inline SVG or icon font glyph has no text content a screen reader can read. You need an aria-label on the button, or an <img> with a real alt attribute inside it, to give the control an accessible name.
What if the button is genuinely decorative and does nothing?
If a control has no function, it shouldn't be a <button> or <a> at all — use a non-interactive element instead. Interactive elements should always have a clear purpose that can be communicated to every user.