Hypertext links (usually referred to just as 'links') are one of the most basic elements of HyperText Markup Language (HTML). Ensuring hypertext links are accessible is a fundamental aspect of web accessibility.
Well written link text plays an important part in helping users navigate your content and perform tasks. If links are clear and accessible it helps build trust between you and your users and gives them confidence in your content. All editors working on the University of Dundee website should follow this guidance.
What is a link?
You might be familiar with a link as a simple underlined bit of text you see on a page. While this is the most common usage, links are used in other ways too.
Navigation
The navigation at the top of most websites is a group of links. These links might be styled to look different from a standard link, but they will work in the same way.
A visitor with a disability or impairment will rely heavily on navigation being easy to discover, understand, and use.
Breadcrumbs
Many websites use ‘breadcrumb’ links to help visitors understand where they currently are and where they have been. Breadcrumbs provide a link back to the homepage and any ‘parent’ pages that sit a level above the current page.
When a website has a lot of pages, breadcrumbs help visitors, including those with additional access needs, find their current location within the hierarchy.
Skip links
Skip links allow visitors to jump over (or skip) chunks of your web page. Some visitors, such as those who rely on a screen reader, want to skip past the navigation to read the content.
A ‘Skip to content’ link means visitors don’t need to cycle through all the individual links in a navigation menu. A screen reader will read each link individually, which can be time-consuming and irritating without a skip link.
A ‘Skip to navigation’ link will direct visitors straight to the navigation, past any branding or other content that sits before the navigation on a page. This can help people who navigate using only a keyboard or an assistive device find the right page in your navigation.
How do people use links?
When creating links, we need to think about all the different ways our visitors might interact with them. Not every visitor will be using a desktop computer or a laptop with a mouse or trackpad to click the links in your content.
Keyboard navigation (tabbing)
Not everyone can use a mouse to click on a link. Our visitors must be able to navigate to and select each link using the keyboard alone. In most browsers, the Tab key allows users to jump from link to link, and the Enter key allows users to select a link. If the only way to access a link is with a mouse, the link is unusable for people who cannot use a mouse.
In the past, website developers defined access keys for links so visitors could use a keyboard shortcut to focus on an individual link. For example, a developer might use Alt + H as the access key for a 'Home' link in their navigation. However, this approach is now considered bad practice. Visitors will often have their own predefined shortcuts and will not expect a website to have programmed custom shortcuts for them. It also creates an additional requirement for you to provide an explanation of your access keys.
Screen readers
A screen reader enables blind or visually impaired people to use their computers to access our website and consume our content. It's a form of assistive technology that renders text and image content as speech or braille output.
Visitors who use a screen reader to access our content can't see the links on our page. Instead, they rely on their screen reader to read the link text aloud to them. They rely on us to create link text that makes sense.
Screen reader users will typically skip through content from one interactive element (links and buttons) to another or skip through content using headings and links.
Most screen readers say "link" before each link. So, for example, a "research themes" link would be read as "link research themes" by the JAWS screen reader for Windows.
Tapping
The majority of our visitors now use a mobile device. They tap their finger on a link to interact with it and reach the destination page.
Links must be distinctive enough to be visible on small mobile screens, especially when visitors are outside in direct sunlight, which can adversely affect their experience. Links must stand out from other content too.
Links that are too short are more difficult to spot when scanning through a page, especially on smaller screens. Likewise, links that are too long take more time to read and understand; they can span across two or three lines on mobile devices, which is not ideal.
