Hyperlink Accessibility
A hyperlink's destination is important to users who browse a website.
Screen readers often tab from link to link to scan the page, so users depend on links for information about page content.
Add the focus pseudo-class to an a:hover style
To add a pseudo-class to aid users who tab to hyperlinks rather than mousing over thems o that the link changes when users tab to it as well as when users mouse over it.
- Add a:focus pseudo-class to the a:hover style,
a:hover,
a:focus,
a:active
{
background-color:#ffffcc;
color:#990000;
}
- put distinguishing information at the beginning of the link, so the screen reader can decide whether the link is worth clicking.
- The screen reader announces links,
- do not need to use the word "link"
- Some screen readers announce destination of links (e.g., "same page link" ).
- It is helpful to announce the file type of the link destination (e.g., Word, PDF, etc.).
top
TargetAlert
- Firefox users can download TargetAlert
- this tool displays an icon after each link to identify the type of link, whether it is on the same page, on an external Web site, opens a new window, etc.
- After installing TargetAlert, you can see icons by clicking Tools>Extensions and selecting TargetAlert.
- Screen readers may be able to list links on a page alphabetically, so it helps if you use standard link names, such as "contact" or "checkout" so the user can browse more efficiently.
- Avoid extremely long links (usually generated by databases) because screen readers may give up listening to them.
- Try to avoid very small hot spots (one letter hyperlinks) because they are hard for people to click.
- make sure all functions are available by tabbing from link to link and do not require a mouse
- Make sure all functions are available from the keyboard, which responds to voice activation.
- Provide a way to skip lengthy, less important sections of web page.by using hidden links that become available when the user tabs to them.
- Put a separator such as | or use unordered lists to separate hyperlinks that are otherwise adjacent.
- Break long lists of links into sections, separated by section headers to make them easier for those with cognitive disabilities to understand..
Resources
Readings and Links for Accessibility
top
