Multiple links have the same programmatic link text but different destinations

Link to Multiple links have the same programmatic link text but different destinations copied to clipboard

link-purpose-unclear-multiple

Rule

The purpose of each link MUST be able to be determined from the link text alone, or from the link text and its programmatic context.

Background

When link text - along with its immediately surrounding content - does not completely describe the destination of a link, people who are blind, and people with mobility impairments, reading disabilities, and low vision may have more difficulty understanding the purpose of a link so they can decide whether they want to follow the link. In order to sufficiently describe a link's destination, the link text and its immediately surrounding content must provide a complete description of the destination. (Note: Whenever possible, provide link text that identifies the purpose of the link without needing to refer to surrounding content.) Meaningful link text helps people choose which links to follow without requiring complicated strategies to understand the page.

How to Fix

Fix this issue by using ONE of the following techniques:

  1. Provide unique link text that conveys the purpose of each link on its own.

  2. Ensure that the link text PLUS its programmatic context conveys the purpose of the link. Programmatic context can be one of the following: same sentence, paragraph, list item, or table cell as the link; in the table header cell for a link in a data table; via aria-label, aria-labelledby, or aria-describedby attributes.

NOTE: aria-label and aria-labelledby will completely override any other link text inside the link, while aria-describedby will supplement (not override) the link text inside the link.

Context taken from surrounding text will be most usable if it precedes the link.

<a href="blog/agile-practices.html" aria-label="Read more about Accessibility in Agile Transformational Practices">Read More</a>

<a href="blog/agile-practices.html">Read More <span class="sr-only"> about Accessibility in Agile Transformational Practices</span></a>

<h2 id="blog-87">Accessibility in Agile Transformational Practices</h2> <p>here are a lot of myths out there ...</p> <a href="blog/agile-practices.html" aria-describedby="blog-87">Read More</a>