• June 26, 2025

Avoiding Redundant Alternative Text in Images

Rule ID: image-redundant-alt
Ruleset: axe-core 4.10
User Impact: Minor
Guidelines: Deque Best Practice

How to Fix the Problem

Avoid using the same descriptive text in both the image’s alt attribute and the adjacent visible link or button text. When a screen reader encounters such a pattern, it announces the text twice—causing unnecessary repetition and confusion.

For Link or Icon Images

If an image is part of a link or button and there is already visible text adjacent to it that describes the link’s purpose, the image’s alt attribute should be left empty:

Bad Example:

Fix:

For Image Buttons

When using images as buttons (<input type="image">), the alt attribute must describe the function of the button, not the image itself:

Good Example:

Tips for Writing Effective Alt Text

• Describe the purpose, not the appearance.

• Imagine describing the function to a user without sight.

• Don’t use file names or general terms like “image” or “icon”.

• Ask: “What does this image do or convey?” or “What would I say instead of showing this image?”

Why it Matters

Screen reader users rely on alt attributes to understand visual content. When the alt text duplicates adjacent visible text—like in buttons or links—it results in the content being read twice. This repetition can create a frustrating and confusing experience, diminishing the usefulness of assistive technology.

For example, hearing “Home Page Home Page” when tabbing through a navigation menu is not only redundant but can interfere with understanding the interface’s flow and purpose.

Ensuring concise, non-repetitive alt text improves user experience and maintains meaningful, efficient communication for users of screen readers.

Rule Description

This rule checks whether the alt attribute of an image used within a button or a link unnecessarily repeats the same text that is already presented adjacent to the image. Redundant labeling decreases accessibility by cluttering the auditory experience for screen reader users.

The Algorithm (in simple terms)

• If an image is inside a link or button and the text next to it conveys the same message:

  • Then the image’s alt text should be empty (alt="").

• If it’s an image button (<input type="image">), the alt attribute must describe what the button does—not what the image looks like.