jsx-a11y/img-redundant-alt

A screen reader already says "image" before it reads the alt text. With alt="Photo of a lighthouse", the person hears "image, photo of a lighthouse". Describe what the image shows and leave the rest out.

The rule looks for whole words, in upper or lower case, in strings and in the fixed parts of templates. "Photography" isn't reported. An img with aria-hidden isn't checked.

Configure#

Off by default. To turn it on:

bunfig.toml

[lint.rules]
"jsx-a11y/img-redundant-alt" = "error" # or "warn"

Every option, set to its default:

bunfig.toml

[lint.rules]
"jsx-a11y/img-redundant-alt" = ["error", {
  components = [], # list of strings
  words = [], # list of strings
}]

Examples#

example.jsx2 problems

const cover = <img src="/lighthouse.jpg" alt="Photo of a lighthouse" />;
const avatar = <img src={user.photo} alt={`Picture of ${user.name}`} />;

example.jsxNo problems

const cover = <img src="/lighthouse.jpg" alt="A lighthouse at sunset" />;
const avatar = <img src={user.photo} alt={user.name} />;
const course = <img src="/course.jpg" alt="Photography for beginners" />;

Options#

Option	Default	What it does
`components`	`[]`	Components to check like `img`.
`words`	`[]`	More words to report, in addition to `image`, `photo` and `picture`.

example.jsxwith { "components": ["Avatar"], "words": ["icon"] }2 problems

const avatar = <Avatar src={user.photo} alt="Photo of the author" />;
const trash = <img src="/trash.svg" alt="Trash icon" />;