Should Links Open in the Same Tab or a New One?

Posted

I’ve seen it discussed a number of times. When you make a site should links open in the same tab or a different one? To target=_blank or not to _blank. I’ve seen a variety of opinions.

Interactive demo? Sure this link opens in the same tab and this link opens in a new one.

User Opinions

Always open in the same tab

First of all, they are set to open a new tab. Rude.

The most common reason for this viewpoint seems to be that it is very easy to open links in new tabs. Most browsers have some easy shortcuts. Personally I usually middle-click. But CTRL+Click, CMD+Click or long-press may work depending on your browser and device. I’m not aware of any browsers that support the reverse, opening a target=_blank link in the same tab.

I’ve also heard from people who just don’t like having too many tabs open. So opening in the same tab is desirable.

Always open in a new tab

I truly hate when I’m trying to view a link and it navigates me away from what I’m reading.

This viewpoint seems to be less common, but some people like the workflow. New content new tab, keep it simple.

This seems to be a common implementation on websites, and some users agree with it. I think the logic is that each tab should be one site. New sites should open in new tabs.

Recommendation for web developers

My recommendation is to avoid setting target=_blank on your links. Use the default and let the browser do what their user wants (that is the point of the user agent). This provides a more consistent experience for users and allows them to override the option with a convenient shortcut or context-menu option.

Enforcing your choice

Browsers have fairly limited support for enforcing your preference. You could try a userscript that intercepts all link clicks, but you will be racing with the page in many cases.

However, Firefox does have an advanced browser.link.open_newwindow option if you always want to open links in a new tab. It accepts an integer value to select how “new window” requests are handled. (Unfortunately it can’t be use to divert same-tab loads into new tabs or windows.)

browser.link.open_newwindow=1
Open “new window” links in the current tab.
browser.link.open_newwindow=2
Open “new window” links in a new window.
browser.link.open_newwindow=2
Open “new window” links in a new tab of the current window.

Personally I set it to 1 to make all links open in the same window. Overall this works well and makes the web more predictable. However, it can cause some site breakage. Here are the problems that I have seen:

Third-party Authorization Flows

This is the only place where I see major problems. Some sites will open a new window to an authorization provider and attempt to communicate with it via window.opener and postMessage. However if the previous window is replaced the postMessage call will fall into the void, breaking the authorization flow. This is a relatively rare method of communicating (most flows use a redirect URL rather than postMessage) but I do run into occasionally (a few times a month).

Unfortunately there isn’t a perfect solution to this. Firefox uses the browser.link.open_newwindow.restriction option to control this behaviour. You can use 1 to ignore browser.link.open_newwindow (which defeats the whole purpose but can be used for a temporary workaround), 0 to force browser.link.open_newwindow in absolutely all cases (which makes the problem worse) or the default value of 2 which provides an escape hatch. When opening windows with window.open passing the third parameter will cause it to bypass the force.

This means that you can open a popup like this:

open("https://example.com", "_blank", "popup");

Unfortunately if you don’t want a popup window (for example opening in a new tab) it gets tricky. popup=0 doesn’t trigger the bypass and any option (valid or not) implies popup except for noopener and noreferrer.

So we have two options for opening links in a new tab:

open("https://example.com", "_blank", "noopener");
// or
open("https://example.com", "_blank", "noreferrer");

Unfortunately noopener prevents the window.opener property from being available—which is the main reason we need this in the first place—so it is probably not acceptable. noreferrer is more likely to be suitable but some authorization flows will check the referrer to avoid phishing attacks and provide defence-in-depth.

It would be really nice if there was a newwindow option, or popup=0 could be used as a general solution. Also, because this is an advanced option it is rarely used and isn’t really supported, so it can be hard to get sites to support this configuration. That being said in most cases one of noreferrer or popup will work. So if you work on a site I encourage you to add one of these features to your authorization flows if they otherwise break with windows set to a new tab.

The other pain-point is much more minor. Use of javascript-based fake links is prevalent on the web. This is already a bad experience for users (see the linked post for some reasons why) but it can be made worse when forcing new pages into the same tab. This is because there seems to be a correlation between bloated, slow websites and fake links. These sites often open links in new tabs because reloading after the back button would be too slow. These sites also frequently lack good URL state so going back is likely to forget what you were doing (because they try to open links in a new tab they expect their site to be long-lived). A problem of the site to be sure but removing their mitigation can be painful.

For example Google Drive uses fake links and is painfully slow to navigate. I like files opening in the same tab by default (as I often know what file I want) so it is nice to have this setting enabled. However, if you want to open a few documents (common after a search) there is no way to open them in new tabs. This means after waiting for your slow document load you then need to reload the slow search listing which resets to the top every time. I often find myself duplicating the search tab a handful of times to let it load in parallel then open one result per tab. This is far slower than just scanning the list and middle-clicking relevant-sounding results would be.

So while this is technically a wash (half of the time you want same tab and get it while half of the time you want a new tab and don’t) it seems that one the sites where this is most often an issue I do actually want to open links in a new tab. Overall I still find this to be worth it because I try to avoid these sites anyways, so this is rarely a problem in my day-to-day browsing.