When to Open Links in a New Window
When creating links on a website, you can choose to have them open in the same window or a new window. In most cases, you should set links to open in the same window to avoid usability issues.
Usability Issues
Forcing links to open in a new tab or a new window can cause confusion and frustration because:
- The user may not know a new window has opened (especially on mobile devices where the old window is not visible).
- The user can no longer use the browser’s back button to go to the previous page.
Forcing links to open in a new tab or a new window can be especially disorienting for people who are blind or have other vision-related disabilities. From an accessibility perspective, it is recommended to open new windows and tabs from a link only when necessary and give users advanced warning when opening a new window.
Because of these issues, it is a best practice to leave the user in control and let them decide if they want to open a link in a new window.
When Opening Links in a New Window Makes Sense
Opening a link in a new tab or window on our sites can be done with a notification in these situations:
- If leaving the page would cause the user to lose progress on a form
- If there’s information that the user needs to reference to complete a task in another tab or window
Addressing Usability Issues with a Notification
We highly recommend including a notification if you are going to set a link to open in a new window. You can do this by:
- Add text in the link such as “(opens in a new tab).”
- Add an aria-label to the link in the link’s HTML.
However, this will only alert people using screen readers.
Aria-Label Code Example
<a aria-label="Registration form, link opens in a new tab" href="registration.html" target="_blank" rel="noopener noreferrer">Program registration form</a>
How to Set Links to Open in a New Window in Aggie UX Sites
Cascade Aggie UX Sites
When adding a link in the Custom Content component, you can set the link to open in a new window by setting the Target to “New Window” in the Insert Link window. You cannot set links to open in a new window in other Aggie UX components in Cascade at this time.
WordPress Aggie UX Sites
On WordPress Aggie UX Sites, all AUX components that use a link chooser can have links set to open in a new window. To do so, check “Open link in a new tab” in the Insert/edit link window. Components that use a WYSIWYG (such as AUX Custom Content) do not have this option, and will need to be edited in code view to add the appropriate attribute.
Further Reading
Opening Links in New Browser Windows and Tabs
Nielsen Norman GroupArticle discussing the user experience of opening links in new windows and how to decide if you should force that behavior on a given link.
External links: In or Out
DigitalA11Y: Your Accessibility PartnerArticle discussing usability implications from an accessibility perspective for forcing links to open in new windows. Also includes code examples of ways to open links in new tabs that address these concerns.
When to use target=”_blank”
CSS-TricksBlog post discussing good and bad reasons for force opening a link in a new tab and the proper code to do so.
Should Links Open In New Windows?
Smashing MagazineArticle discussing when forcing links to open in a new is a good user experience with a focus on putting the user in control.