Forcing Links to Open in New Tabs • Pretty Content • Vintage-inspired brand and web design

Forcing Links to Open in New Tabs

There’s one thing I’ve heard over and over again in my life as a web designer. One thing that makes me cringe inwardly no matter how many times I hear it. One battle that I’ve had over and over year after year. One thing which makes the perfect beginning for my Access & UX series.

“Can you make that link open in a new tab?”

No. No, I cannot.

Well, okay, I could.

The ability to add target=”_blank” to a link to force it to open in a new window or tab is probably as old as HTML itself. But, like the <marquee> tag (which will cause your content to scroll across the screen – no, don’t leave this post and go use it) just because something does exist, doesn’t mean that it should. Or at the very least, it should be used sparingly, in legitimate use-cases.

If you don’t want to read this whole post, the take away is this: don’t use target=”_blank” as it is bad for accessibility.

Now, I’ve mentioned this to people in the past and have had people look at me as if I’ve sprouted 3 heads. People seem to think that this radical notion is something that I’ve invented to inconvenience them. But, in fact, it’s been stated time and time again, not least from the father of web usability Jakob Nielsen himself.

Beyond him are the thousands of other usability and accessibility experts who dedicate their lives to ensuring a set of standards are followed that allow the Internet to be used by the greatest number of people. Web developers (such as myself) follow these standards.

Why not open links in new tabs?

We could be here all day if we discussed the nuances of why we do or don’t do something in web dev. These accessibility guides are meant to be geared toward the average user so I’m going to make a simple list. If you are interested in elaboration, a quick Google can bring up the articles of the aforementioned experts who have made accessibility their life’s work.

  • It breaks the functionality of the browser by rendering the “back” button useless. The built-in functionality of the browser exists for a reason. Not everyone understands the nuances of using a computer but most people can understand that the back button will take them to the page they were previously on. Opening in new tabs can be confusing for users who are new or casual users of the Internet.
  • Screen readers may not be clear about links being opened in new tabs. For people with visibility tools, a screen reader is essential to browse the web, but not all screen readers are foolproof and not all people can afford the latest technology. Some screen readers may announce the link has been opened in a new tab (however, only after it has been opened). Some may not. Some may have their words blurred in with whatever else they’re reading (it is a computer, after all, not a human that picks up on these sorts of differences).
  • Switching between open windows and tabs can be a struggle. For people with mobility issues, moving a cursor around a screen to close an annoying or unexpected pop up isn’t easy. By forcing a link to open in a new tab, you are forcing the user to eventually need to close the tab, which could be causing physical strain or discomfort to those who cannot easily grip or use a mouse or trackpad.

When can I open a link in a new tab?Of course, with every rule, there is an exception. In this case, open in a new tab if:

  • the link is a document such as a PDF (most browsers do this by default with their in-browser PDF viewers, so still, just leave the link alone).
  • the link is to a printable version of the site.
  • the link is for documentation to be used alongside the site (such as Terms of Service when filling out a form).
  • the user is doing something on the page (such as watching a video or listening to audio) which they have explicitly asked for (i.e. they clicked the play button) and clicking a link would remove them from the site and kill the video/audio.

Of course, in these situations, you want to be sure the link is properly labeled so users know it will open in a new tab.

The common arguments for wanting to open a link in a new tab

I’ve heard it all when people are presented with this bit of usability and accessibility information. And most often their reasons for opening a new tab are:

“I prefer when things open in a new tab”

Of course, everyone has a personal preference. But that’s why browsers give you a choice. Opening a link in a new tab is as simple as holding Command/Control down as you click a link. This keeps you in control of your browsing experience at all times. You will know when something is going to pop up in a new tab because you’ve demanded it. In the web, everything that happens to a user should be the result of an implicit action.

If you prefer links to open in a new tab, you can do it yourself.

However, if I prefer links to open in the same tab and you’ve coded the link to open in a new tab, I have absolutely no say in the matter. There’s no shortcut to allow me to ensure the link opens in the same tab.

Never hijack someone’s Internet experience.

“What if people leave my site and don’t come back?”

Back to point one of the first section of this post: people know how the back button work. Even the most casual of users can use a back button. Users who are more familiar with browsers will know to use a shortcut to open the link in a new tab should they wish to keep them separate to return to later.

But, really, what you should be striving for isn’t tricking your user into staying on your website. You should want the user to stay and return on their own accord. And to do this, you need to have compelling content and you need to provide value for your user. No amount of link trickery is going to trap someone in your site forever.

Again, never hijack someone’s Internet experience.

Other resources

Don’t believe me? You wouldn’t be the first. However, accessibility is part of my job, and more than that, it is an area that I am especially interested in. Still, here are some other great resources on why you should not open a link in a new tab:

  1. Links Should Open In The Same Window by Michael Shofield, Library User Experience Co.
  2. When to use target=”_blank” by Chris Coyier, CSS Tricks
  3. Beware of opening links in a new window by Neil Turner, Webcredible

Disclaimer: All examples of disability in this post are acquired via research and are a generalisation of the sort of obstacles web users face. I am not personally affected and therefore may have overlooked nuances of certain disabilities. Web accessibility is something I am passionate about and am constantly learning about, so if you wish to share your personal experience, I’d love to chat in via email or on Twitter

Hi, I'm Aisling!

I’ve spent over a decade working in agencies and startups, designing for different mediums; coding responsive, user-friendly web experiences; and converting customers into loyal audiences. Now, I am so excited to bring those years of experience to your project, and to share some of my insights on this blog!