Widget: Link

Example

Details

Implementing This Widget

Implementing the Link widget is done to ensure non-anchor links are accessible, whether a regular, span, or image link.

Prerequisites:

You must have a valid URL for each link you want to initialize, and a compelling reason for not using the <a> element.

To implement the Link widget:

  • Pass any non-anchor link elements into deque.initializeLink(); to initialize them.

    This will ignore <a> tags, which the browser already correctly interprets. Your link elements should specify the linked URL either via an href attribute or a data-url attribute.

Expected Operation and Accessibility Features

Each link will have an accessible name that is read by a screen reader, events for handling both mouse and keyboard use, and be a part of the tab order of the page.

Validation and Developer Notes

In order to validate this control, you must verify the non-anchor link element has an accessible name that can be identified with the link behavior and activated with the Enter/Return key.

Notes for the Developer:

Note: If you use Windows, Shift-F10 will open the context menu on a regular link. If you're using a non-anchor tag through this library, Shift+F10 may or may not work depending on your browser. This is one of the many reasons to use anchor tags whenever possible.

Example Implementation Reference

To view an implementation of this widget, see Link widget example.