altTexts

Reports elements that require alt text but are missing it.

✅ This rule is included in the jsx logical and logicalStrict presets.

Alternative text provides a textual description for images and other media. Search engine crawlers and screen readers use this text to describe the element to users who cannot see it.

Elements like <img>, <area>, <input type="image">, and <object> must have appropriate alternative text through alt, aria-label, aria-labelledby, or title attributes.

This is required for WCAG 1.1.1 compliance.

Examples

❌ Incorrect

<img src="foo.jpg" />

<img src="foo.jpg" alt />

<area href="#" />

<input type="image" src="submit.png" />

<object data="movie.mp4" />

✅ Correct

<img src="foo.jpg" alt="A foo" />

<img src="foo.jpg" alt="" />

<img src="foo.jpg" aria-label="Foo" />

<area alt="Click here" href="#" />

<input type="image" alt="Submit" />

<object aria-label="Video" />

When Not To Use It

If you’re not working with images or media elements, or if you use a framework that automatically injects known good alt text for those elements, you can disable this rule.

Further Reading

• WCAG 1.1.1: Non-text Content
• WebAIM: Alternative Text

Equivalents in Other Linters

• ESLint: jsx-a11y/alt-text
• Oxlint: jsx_a11y/alt-text