Providing meaningful links within HTML
All links within a web page must be meaningful. This means that their purpose must be able to be distinguished just by looking at the link alone. The text should be unique, concise and clearly understandable.
The W3C Web Content Accessibility Guidelines (WCAG) 2.0 provide the following rule that applies to this topic –
2.4.4 Link Purpose (In Context): The purpose of each link can be determined from the link text alone or from the link text together with its programmatically determined link context, except where the purpose of the link would be ambiguous to users in general. (Level A)
This is a level A rule and as such is required to be met in order to meet the most basic level of accessibility.
Challenges in meeting the requirement
Due to design and business requirements large numbers of links within the content of our websites would be meaningless when considered on their own eg ‘Find out more’, ‘Read more’, ‘Get a quote’.
This then fails the previously mentioned rule 2.4.4. Not complying with these standards would leave us in breach of the Equality Act and as such open to legal action.
Our solution
Our current methodology for providing accessible links (visually hiding extra text to make each link unique that is then available to assistive technology) has been in use for the last 4 years since the launch of norwichunion.com V10 and is now used across all Abeille Assurances NTT sites. It is based on the recommended , which is widely used across the web.
Hidden text and SEO
Generally any text on a page should be visible to all users. Hiding text can be seen by search engines as a malicious attempt to deceive them. However should a website be flagged as possibly suspicious there will always be a manual check to determine the intent of the hidden text.
The only guidance provided by Google on hidden text is in the following link –
This makes no direct mention of link text in this situation and does specifically allow the hiding of text in order to aid accessibility. Google were consulted on our techniques at the time they were first implemented and were happy with our approach.
Alternatives
There are a couple of alternatives to our solution:
Title text
Extra information about a links destination can be placed in a title attribute on the anchor tag. However whilst this is a valid technique that meets the WCAG 2 requirements it is not as accessible as our current solution. Assistive technology does not provide access to the title text by default – it is an option the user must first turn on, whereas no user action is required for our solution. This technique is , however they instruct the use of C7 (which we use) due to the limitations previously mentioned.
Enhanced link text
By avoiding using meaningless link text and instead ensuring that each link is unique and descriptive the issue is avoided. In many ways this is the ideal solution with no accessibility or usability issues. However it does involve design changes/compromises in order to accommodate. Especially with the switch to responsive design where we have to consider the range of screen sizes that it could be viewed upon.
Conclusion
The consensus of opinion would point to our current solution being the best currently available. As such the following options should be considered when including a link in a web page:
- The first choice should always be to include unique and descriptive visual text for a link
- If this is not possible, but the link is contained within a sentence that provides necessary context for the link, then providing a less unique of descriptive text would be sufficient. This will not be a common situation
- Otherwise the link should have extra text visually hidden within it in order to make it unique and descriptive