Follow

Links

Screen readers will read links out of context.

  • They need to be clear <a> elements.
  • Try to avoid using different link text to refer to the same destination.
  • Provide a valid link destination in the href attribute to ensure links function properly even with JavaScript turned off. In particular, you should avoid href="" or href="#". The "#" symbol is used as a "fragment identifier separator", which means its intended purpose within the href attribute is to precede a string of text that identifies a fragment within the page (a named anchor or an ID on the page). The use of "#" as the hypertext reference essentially means the anchor points to nothing. In some browsers this may "point" to the entire document or to the top of the page, and this will cause an unexpected shift in focus.
  • New windows (target="_blank") can be confusing to assistive technology users because they cause an unexpected browser action. They can be especially problematic to users of screen enlargers — who view only a small portion of the screen at a time — because the new window may open off of the viewable area and can cause the user to scroll the viewing area to find the new window. If a new window must be opened, notify the user that the new window is about to open.

 

Good Examples

<a href="http://tinyurl.com/c3z77jt">resident microbes in the human body</a>
<a href="http://www.deque.com/training"onclick="window.open(this.href); return false;">Deque training (opens new window)</a>
<a href="http://www.deque.com/training"onclick="window.open(this.href); return false;">Deque training <imgsrc="images/template/new-window.png"width="13" height="13" alt="Opens in new window" class="noborder"/></a>

 

Bad Examples

<a href="http://tinyurl.com/c3z77jt">click here</a>
<a href="#">Here</a>

 

Was this article helpful? 0 out of 0 found this helpful

Have more questions? Submit a Support Ticket