Skip to content

noRedundantAlt

诊断类别:lint/a11y/noRedundantAlt

¥Diagnostic Category: lint/a11y/noRedundantAlt

自从:v1.0.0

¥Since: v1.0.0

来源:

¥Sources:

强制 img alt prop 不包含单词 “image”、“picture” 或 “photo”。

¥Enforce img alt prop does not contain the word “image”, “picture”, or “photo”.

规则将首先检查 aria-hidden 是否为真,以确定是否执行该规则。如果图片被隐藏,则规则将始终成功。

¥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

¥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 $&#123;things&#125;} {…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

<>
<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" />
</>

¥Related links