Accessible Web Content 6: Accessible Links and Buttons
This article is written as part of our Accessible Web Content series.
The importance
Labeling links and buttons correctly is one of the most important things you can do on your website to improve accessibility.
To quickly navigate, those who use screen readers often have the links of a page read out loud in order. If we have correctly written links, they do not encounter 33+ links that are ambiguous and hard to figure out where they go.
Another reason is for voice recognition/control software. If we have links that are incredibly long, have hidden text, conflicting labels, or unique characters, it becomes difficult or impossible for the link to be found.
Quick tips
- Do not use only “learn more” or “read more” as the label.
- Keep labels as short and concise as possible.
- Use only alphanumeric characters and punctuation.
- Avoid repetition, try to keep all links on the page (mostly) unique.
Links
In paragraphs, it’s best to add a link to the relevant piece of text instead of adding generic new text to create a spot to link. We want the link to get to the point straight away, be pretty unique to the page so the destination is clear, and be easy to speak out loud.
Examples
- Good: In our exploration, we encountered a panda bear.
- Bad: In our exploration, we encountered a panda bear. Click here to learn about the panda bear.
Buttons
Buttons are (usually) links too, and should follow the same principles as links. However, we want the labels to be even shorter. Aim for only a few words.
Examples
- Good: About Us
- Bad: Learn More
WCAG Compliance
WCAG compliance is not the end-all be-all of accessibility. Even if your website is 100% AAA WCAG compliant, it still won’t be accessible to everybody. That said, it’s a great tool to use to gauge needs and how to move forward.
Relevant WCAG Criterion
For more detailed information straight from the source, visit the following page
If you found this post helpful, consider subscribing to our newsletter for monthly updates and posts about digital design and development.
A Certified B Corp, Mangrove is a woman-owned website design and development company with a diverse, talented team distributed around the globe. We’ve been building websites since 2009 that amplify the work of change-making organizations and increase the competitive power of businesses owned by historically marginalized people.
If you found this post helpful, subscribe to our monthly newsletter for notice of future posts and other news from us.
