R I S K M O N I T O R

Loading

Intelligent Cybersecurity Check for vulnerabilities now

Accessible Link Purpose: Ensuring Clarity in Identical Links

Rule ID: identical-links-same-purpose
Ruleset: axe-core 4.10
User Impact: Minor
Guidelines: WCAG 2.1 (AAA), WCAG 2.0 (AAA)


How to Fix the Problem

Ensure that links with identical text or accessible names lead to the same destination or share the same purpose. If multiple links contain the same label such as “Read more,” but direct users to different pages, this creates confusion—especially for screen reader users who may navigate using a list of links.

To fix this issue:

  • Make link text unique when destinations differ: If links lead to different resources, the accessible name (text or aria-label) must reflect that difference.

  • Use aria-label to add context: Maintain visual simplicity while ensuring that assistive technologies provide meaningful differentiation.

Working Examples

  1. With aria-labels for clarity:

    html
    <a href="taxhike.html" aria-label="Read more about Seminole tax hike">[Read more...]</a>
    <a href="babymayor.html" aria-label="Read more about Seminole's new baby mayor">[Read more...]</a>
  2. Unique and descriptive link text:

    html
    <a href="routes.html">Current routes at Boulders Climbing Gym</a>
  3. Using descriptive alt in image links:

    html
    <a href="routes.html">
    <img src="topo.gif" alt="Current routes at Boulders Climbing Gym" />
    </a>
  4. Link with icon and descriptive text:

    html
    <a href="WMFP.pdf">
    Woodend Music Festival Program
    <img src="pdficon.gif" alt="PDF format" />
    </a>
  5. Block-level link (HTML5):

    html
    <a href="news.html">
    <h3>Budget Debate Continues in Parliament</h3>
    <p>Read more</p>
    </a>

Tips:

  • Avoid vague links like “Click here” or “More.”

  • Provide enough context through visible text or accessibility attributes.

  • If using the same link text in multiple places, ensure each links to the same destination or function.


Why it Matters

This rule supports navigational clarity and user confidence, particularly for:

  • Screen reader users who view a list of links out of page context.

  • Keyboard-only users who rely on meaningful tab navigation.

When identical link texts lead to different destinations, it creates confusion and inefficiency, making it hard for users to decide which link to follow. By differentiating link purposes clearly, you uphold accessibility principles and improve usability for all users.

Additionally, Success Criterion 3.2.4 (Consistent Identification) stresses the importance of consistent labeling for similar functionality. This ensures a predictable, understandable experience.


Rule Description

Links with the same accessible name must serve the same purpose. If their purpose or target differs, the accessible names must be different to reflect that.


The Algorithm (in Simple Terms)

This rule checks:

  • True if a native or ARIA link has an accessible name and leads to a consistent purpose.

  • 🚫 Undefined if:

    • The link has no accessible name.

    • The accessible name is only symbols or emojis.

    • An ARIA-based link has no text description.

The rule ensures that identical link names aren’t misleading by leading to unrelated content.

Leave A Comment