identical-links-same-purpose

Description

You must ensure that links or functional components that share the same visible text or accessible name also share the same purpose or destination.

When users encounter a repeated link, they anticipate the same outcome every time. If a link labeled “More” takes the user to one destination on Page A but a completely different destination on Page B, you confuse the user, especially those who rely on screen readers.

The identical-links-same-purpose rule aligns with WCAG Success Criterion 2.4.9 (Link Purpose (Link Only)), which requires that components with the same functionality within a set of web pages are identified consistently.

Examples

In the following example, the link text “Read More” is used on a set of web pages, but each instance directs the user to a different type of content, violating the rule.

In the following corrected example, you provide additional context to the accessible name using aria-label or make the visible text unique. This ensures that assistive technology announces a unique and meaningful purpose for each link.

How to fix?

To fix violations of the identical-links-same-purpose rule, follow these steps:

• Audit Links: Identify all links or functional components that share identical visible text or have the same accessible name (e.g., derived from alt text or aria-label).

• Verify Functionality: Check the destination or action of each identified component.

• Ensure Consistency: If the destinations or functions are different, you must make the links’ accessible names unique.

• Prioritize Visible Text: Modify the visible link text to include the necessary context (e.g., change “Details” to “Product Details”).

• Use aria-label: If you cannot change the visible text for design reasons, provide a unique, descriptive accessible name using the aria-label attribute. This name replaces the visible text for assistive technologies.

Reference

• WCAG Success Criterion 2.4.9 (Link Purpose (Link Only))

• G197: Using labels, names, and text alternatives consistently for content that has the same functionality