Web Accessibility at the University of California

Inform Users When a Link Opens a New Window

• About
• Guiding Principles
• Recommended Standards
• Guidelines
  • Content Developers
  • Web Developers
  • Writers and Editors
• Technical Topics
• Tools and Testing
• Campus Assistance
• Training for Developers
• Other Resources
• Policy
•  
• Resources Home
• Initiative Home

The Challenge
When people view Web pages, they have no way of telling if a link will open in a new browser window. After the fact, they observe that a new window has opened and know to close it if they want to go back to the original site. However, screen readers generally don't alert people that a new browser window is going to open or has opened. This means that when someone using a screen reader attempts to use the "Back" button, nothing happens because there is no browsing history in the new window. In fact, they may find they've opened many new windows and don't know how they got to the latest one. Users with cognitive disabilities also may get confused when presented with multiple browser windows. People should be informed when a link doesn't open in the current window or leads to an external Web site.

Solutions

• As a general rule, avoid opening new browser windows.
• If you must open new browser windows or send people to an external site, do one or more of the following:
  • Include an alert in parentheses at the end of the link:

    Web Accessibility in Mind (link opens in new window)
    and
    World Wide Web Consortium (links to external site)

    If this feels too clunky, apply a CSS style to the parenthetical information to "hide" it from sighted users while allowing screen readers to read the text as part of the link.

  • Use a title attribute in your link so that sighted users will see a "tool tip" when hovering over the linked words.

    <a href="http://www.webaim.org" target="_blank" title="Link opens in new window">
    or
    <a href="http://www.w3.org/" title="Link to external site">

  • Add visual cues to convey link information. WebAIM recommends that an icon with a page and an arrow should denote that a link opens in a new browser window, while an icon with a globe and an arrow should indicate that a link goes to an external Web site. The icons are usually placed at the end of the link.

Additional Information

• WebAim article on links to new windows and external web sites