Should We Open Links in a New Tab?

AccessibilityPosted on

2 min read

The short answer is mostly no; we shouldn’t. Opening a link in a new window is acceptable in some cases, but otherwise, we neglect the user’s choice.

If we want, we can use the target=”_blank” attribute and value on any link to open a link in a new tab.

Opening something in this way is confusing (specifically for those who have difficulty perceiving visual content). Also, by opening a new tab or window, we overwrite the default expected behavior (opening in the same window), which is never a good idea from a UX point of view. So why do we do it?

We do it because:

  • Someone somewhere thought it was a good idea because the user doesn’t navigate away from the page (our page). The user wanted, but we tricked them. 🥳 And along the way, many people saw this technique and started to adopt it without any question.
  • We have a compelling reason for it, and we do it in the right way because we know what we are doing.

Why Not Open a Link in a New Tab?

  • The user knows what they want. If they’re going to open a new link, they can use the middle mouse cursor (on Windows for sure) or right-click and click on the open in a new window menu item.
  • It unnecessarily confuses the user. Not just someone who has some who use a screen-reader but someone who is older or has less digital experience.
  • Just because everybody does it doesn’t mean it is a good idea.

When To Open a Link in a New Tab?

Open a new tab only when the user is interested in it. A good example is a form with a GDPR (General Data Protection Regulation) checkbox at the end (💗 EU). A user may want to use your privacy policy for more information, and if you open the link in the same tab, they may lose the already filled data.

BUT it is still a good idea to inform the user. Although the previous scenario is widespread today, we should still mark the link to make it predictable. The simplest method is to write it out in parenthesis (open in new window) at the end of the link.

<a href="/our-privacy-policy/" target="_blank" rel="noopener">Privacy Policy (open in new window)</a>

Depending on your situation, you can also create a fancier solution with automatically attached icons and aria-label attributes for screen-reader users.

Appendix

Need a web developer? Maybe we can help, get in touch!

Similar Posts

More content in Accessibility category