altTexts
Reports elements that require alt text but are missing it.
✅ This rule is included in the jsx logical preset.
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
Section titled “Examples”<img src="foo.jpg" /><img src="foo.jpg" alt /><area href="#" /><input type="image" src="submit.png" /><object data="movie.mp4" /><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
Section titled “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
Section titled “Further Reading”Equivalents in Other Linters
Section titled “Equivalents in Other Linters”- ESLint:
jsx-a11y/alt-text - Oxlint:
jsx_a11y/alt-text
Made with ❤️🔥 in Boston by
Josh Goldberg and contributors.