noRedundantAlt
このコンテンツはまだ日本語訳がありません。
Diagnostic Category: lint/a11y/noRedundantAlt
Since: v1.0.0
Sources:
- Same as:
jsx-a11y/img-redundant-alt
Description
Section titled DescriptionEnforce img
alt prop does not contain the word “image”, “picture”, or “photo”.
The rule will first check if aria-hidden
is truthy to determine whether to enforce the rule. If the image is
hidden, then the rule will always succeed.
Examples
Section titled ExamplesInvalid
Section titled Invalid<img src="src" alt="photo content" />;
code-block.jsx:1:20 lint/a11y/noRedundantAlt ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Avoid the words “image”, “picture”, or “photo” in img element alt text.
> 1 │ <img src=“src” alt=“photo content” />;
│ ^^^^^^^^^^^^^^^
2 │
ℹ Screen readers announce img elements as “images”, so it is not necessary to redeclare this in alternative text.
<img alt={`picture doing ${things}`} {...this.props} />;
code-block.jsx:1:10 lint/a11y/noRedundantAlt ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Avoid the words “image”, “picture”, or “photo” in img element alt text.
> 1 │ <img alt={picture doing ${things}
} {…this.props} />;
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^
2 │
ℹ Screen readers announce img elements as “images”, so it is not necessary to redeclare this in alternative text.
<img alt="picture of cool person" aria-hidden={false} />;
code-block.jsx:1:10 lint/a11y/noRedundantAlt ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
✖ Avoid the words “image”, “picture”, or “photo” in img element alt text.
> 1 │ <img alt=“picture of cool person” aria-hidden={false} />;
│ ^^^^^^^^^^^^^^^^^^^^^^^^
2 │
ℹ Screen readers announce img elements as “images”, so it is not necessary to redeclare this in alternative text.
Valid
Section titled Valid<> <img src="src" alt="alt" /> <img src="src" alt={photo} /> <img src="bar" aria-hidden alt="Picture of me taking a photo of an image" /></>
How to configure
Section titled How to configure{ "linter": { "rules": { "a11y": { "noRedundantAlt": "error" } } }}