Last updated January 13, 2021
This guide explores when and how to have links open in a new tab while prioritizing accessibility.
Accessibility considerations
Having links open in a new tab or window is usually considered inaccessible. Here are some reasons why:
- Links opening in a new tab can be disorienting for people with low vision or who are navigating via screen reader, especially when there is no warning.
- Users might not understand that they cannot use the “back” button to return to the previous page.
Read more about external links, new tabs, and accessibility.
When to open links in a new tab
In most cases, it is more accessible not to open links in a new tab or window. However, there are a few exceptions.
Consider opening a link in a new tab or window in the following cases:
- The link is on a page with embedded playable media. In this case, opening the form in a new tab or window avoids interrupting playback.
- Leaving the page causes the user to lose their work, such as on a fillable form. In that case, we encourage adding a warning message to notify the user of how to save their data.
- There is a checklist or instructions the user must reference in order to complete a task on the new tab or window.
How to include warnings
If you need to set a link to open in a new tab or page, it is best practice to add a warning so that the user knows what to expect. Here are two ways to notify your users:
- You can add “opens in new tab” following the link text.
- You can use the aria-label attribute to add custom link text that will only be read by devices like screen readers.
Note: the aria-label attribute overrides the link text entirely, so be sure that your aria labels contain both meaningful link text AND a warning, e.g., aria-label=”Google search – link opens in a new tab.” More information on writing meaningful link text.
The following HTML is a link to Google search with an aria-label attribute:
<a aria-label="Google search - link opens in a new tab" href="https://www.google.com" target="_blank" rel="noopener noreferrer">Google search</a>
The Center for User Experience
At the Center for User Experience, we are committed to working with you to make digital spaces more accessible, usable and inclusive for all students, faculty and staff at UW–Madison. We help the university follow its Digital Accessibility Policy by offering free evaluation and consultation services to all UW–Madison community members.
Get in touch
- Meet with us: Book a quick chat with one of our team members to ask any questions you have.
- Start a project with us: We support accessible design and development. Fill out our Let’s Connect form to begin working with us on your project or to request an accessibility evaluation.
- Email us: Not sure if you’re ready to meet? Email us to start talking and figure out what to do next.