Links

✎ Technique: Content on hover or focus

Make it easier for users to interact with added content. Tooltips, drop-down menus, and popups are examples of added content. This new content is usually made visible when you put your mouse pointer over a "trigger" item such as a button or link. It can also display when an item receives focus. Some people have difficulty keeping the mouse pointer over the trigger item. Also, the new content will sometimes obscure existing content. The three requirements of this success criterion, as outlined below, help make the added content more operable.

Dismissable

When using magnification, tooltips or added content can display on top of other information. Unless the newly visible content is displaying an error, the user must be able to dismiss that content without moving the mouse or changing focus. The easiest way to implement this is by providing a keyboard command, such as pressing the escape key, to close the content. The developer can also include a close button within the added content.

Hoverable

Often the new content only displays when the mouse pointer is over the trigger element and disappears when the mouse moves off of the trigger. It can be hard for people with tremors or limited movement to keep the mouse over the trigger element. To remedy that situation, the content must stay visible as long as the mouse remains over the trigger or the mouse moves onto and remains over the new content.

Persistent

This rule combines the previous two. The content must remain visible until the user dismisses it, the hover or focus trigger is removed, or the information is no longer valid.

✎ Technique: Writing link text

Link text is the text you select for a link that describing what happens when a user activates it. So it needs to clearly and accurately convey the link's purpose. Commonly, link text is the name of the linked page or document. When a link leads to a document that's not a web page, such as a PDF or Word document, that should be clarified in the link text. Avoid overly terse, ambiguous link text, and avoid reusing the same link text within a page for links that lead to different destinations.

Good link text helps all users...

Read more about ✎ Technique: Writing link text

✎ Technique: Consistent layout

Consistency is one of the cornerstones of good usability. Although it is possible in advanced CMSs to create radically different page layouts according to content type, it's important that areas outside of the page’s content area remain consistent across the site for wayfinding purposes. This can be controlled through carefully designing and implementing page templates.... Read more about ✎ Technique: Consistent layout

✎ Technique: Visited links

In long lists of links, it's helpful to show users which links they've already followed so they can focus on unseen content. Browsers do not tend to let you style visited links with anything but the color property.

Examples

Good example

With link styling, as with many aspects of web-interface design, you can aid comprehension by capitalizing on convention. By default, browsers style unvisited links with a #0000EE...

Read more about ✎ Technique: Visited links

✎ Technique: Site and page navigation

It's important to provide consistent navigation regions to navigate between a site's pages and—where there is a lot content on each page—between sections of pages.

Clear, logical and consistent navigation tools reliably help people find their way to the content they need and recover quickly when they are in the wrong place. This helps everyone but particularly people with visual, cognitive, or motor impairments who might otherwise find it time-consuming to locate the information they need.

...
Read more about ✎ Technique: Site and page navigation

✎ Technique: Managing focus and inactive elements

Visually indicating which element has focus is important for effective keyboard navigation. It's also important to ensure that only those elements that are available visually for interaction are focusable. If an active element is intended to be unavailable in a particular state and it’s hidden from view, it should not be able to receive focus.

Having to tab through invisible controls to reach visible ones is arduous and potentially confusing for sighted users navigating the page by keyboard. Also, screen-...

Read more about ✎ Technique: Managing focus and inactive elements