Anchor links1 may have a target attribute which controls what happens when that link is clicked. One of the possible values of that attribute is _blank, which tells the browser to open a new window (or tab, if that’s the user’s preference) when that link is clicked.
This used to be “invalid” in HTML (maybe only XHTML?) but people used it anyway since it worked. It’s now perfectly valid in HTML5. But are there good reasons to do so?
A Bad Reason: Because you like it that way.
Like it or not, target="_blank" is a change in default behavior. Links opening within the same page is the default behavior (as if the link had target="_self" on it).
Perhaps you’ve developed a personal taste for opening all links in new windows/tabs. That’s wonderful for you, but it is safe to assume most users are most comfortable with the default behavior. And thus less comfortable with your forcing of a different behavior.
If it’s an internal tool just for you, do whatever you want. If other people use the site, leave it be.
It is also worth noting that users can force a link to open in a new window/tab by [Meta Key]-clicking a link. That means both behaviors are available to them for links. That also means that if you like opening new tabs, you can, and you don’t have to impart that behavior on anyone else.
By using target="_blank", only that behavior is available.
A Bad Reason: Just because you want users to never leave your page.
Branding branding branding! Eyeballs baby. Metrics. ENGAGEMENT.
Other sites should have normal-style links, but our site is special. Our site is more important and should never be left behind.
A Bad Reason: “Internal” links and “External” links are different.
We’ll have “internal” links (links that point to our own site) behave normally, but “external” links (links that point to other sites) open in a new window/tab.
This is related to the above two reasons, only perhaps worse. You understand that normal style links are ideal, but if that means a user leaves your site, you’re willing to break that ideal.
I’ve heard from a lot of people that this is “a convention.” As in the way it’s supposed to be done. It’s not.
A Bad Reason: The link is to a PDF
Or any other type of non-web resource. Why should that be so different? You can still use the back button to come back from it. If you want to help users download it without actually opening it, that’s a worthy UX goal but can be approached differently. For starters, using the download attribute.
A Bad Reason: My client wants it that way
I get the “I don’t want to pick this fight” thing, since we only have so much energy. But it’s weird this has to be a fight at all. If they don’t trust you with this, what do they trust you about?
I might approach it like this:
The default behavior is for links to open normally. There are some reasons why we might want to break that behavior, and we can go over those, but for most links, we don’t. We don’t want to force our desires on users and potentially frustrate them for such a small thing. We want our users to feel good about us.
And hopefully, your calm and educated approach will help your client feel good about you.
A Bad Reason: It’s on an infinite-scroll page
Infinite scrolling is tricky. It can be good UX in one sense because it can deliver content without interruption. It can be bad UX if not handled well. Coming “back” to an infinite scroll page should take you to where you left off in most cases. Handling that tricky problem is your job. Just forcing links to open in new tabs so that problem never comes up is avoiding your job.
A Good Reason: There is user-initiated media playing
For instance: music, video, a podcast…
The user started it. Moving pages would stop it. At that point, either have links open in new tabs or ask them if they are sure they want to leave the page. At that point, you are trying to do right by them and have them not leave their place.
We’ve covered this idea before here. If the media is playing, handle links in a special way. When the media isn’t playing, links are in their normal state.
Although as I say that, I check YouTube, and they don’t bug you about it2 when changing videos.
A Good Reason: The user is working on something on the page, that might be lost if the current page changed.
Perhaps a user is writing something. Or arranging something. Doing any kind of work. Clicking a link and changing pages can be a heart-pounding, awful moment on the web. Did I just lose everything I was doing?
Even if you do something to ensure they don’t lose that work, putting someone through that panic may as well be avoided.
I think of CodePen where users are often writing code. We do several things to help:
- Links that go to other pages that are explicitly “learn more” style links (e.g. [?]), that you only see while interacting with the editor, open in a new tab.
- Normal links (e.g. links in the footer) have normal behavior, but we detect if you have unsaved changes in the editor and prompt you to save them before you leave.
- If you do leave to another site (or your browser crashes), we save the state of the editors in localStorage so you don’t lose work.
Checkout is another case here. Of course, you don’t want to lose customers during their checkout process. A link to something like “shipping information” should be openable without them losing their place in checkout.
“Reading an article”, in my opinion, doesn’t qualify here. Since it’s (generally) so easy to get back to (most browsers even scroll down to where you were), there is no risk of real loss, and readers are really skimmers anyway.
A Good Reason: Some technologically obscure point
I’m building an email where people in Outlook Kangaroo 2009 Enterprise Edition need to open it but links need to have target="blank" on them otherwise they open in the sidebar viewing panel and …
Fine.
Tech
In case you have to…
Forcing user to verify they want to leave page:
window.onbeforeunload = function() {
return "Two buttons will be below this message asking if the user wants to stay on this page or leave.";
}Correct HTML
If you are going to do it, not only do you need the target attribute for the functionality, you need to rel attribute for security.
<a href="http://website.com" target="_blank" rel="noopener">Link Opens in New Tab</a>Read more about the security issue.
Drama
I realize I’ve been pretty opinionated here. This is one of those topics where everyone has an opinion. Feel free to share those opinions of course but let’s keep things cool and focus on situations, solutions, and data if we can.
1 <form>s can have target="_blank" too. I would think it’s a more uncommon use case, but the same type of thinking in this article would hold true.
2 If you choose another video you go right to it. But in that case, I wonder if that was a UX choice or an advertising choice. If you’re half-way through a video, click to another video (say by accident) then click the back button right away, your place is lost (well, YouTube actually handles this pretty well these days, but you can see how it could be problematic for video sites in general). Perhaps having as little friction transitioning from video to video is important for them, but it would be nice if they offered a bit of help there. Perhaps a small arrow beneath the timeline that was like a “You’ve watched this video this far before” link.
Might aswell throw this out there as well since the question will surely come up. Target=”_blank” vs. target=”_new” http://www.russellheimlich.com/blog/target_blank-vs-target_new/
That’s just weird! I guess some very specific split-window cross-reference thing could be a use case?
What’s so strange about it? That’s the expected behaviour.
You can use any name for the target (except for those few reserved) and it will open in that same window/tab (unless forced to open in a new one).
This is probably more legacy than relevant for current development. I’ve i.e. seen it in old forum softwares that manage attachments in separate windows (because triggering a new window each time the user opens the attachment manager from the original page wouldn’t be a good idea) which one probably would do with JS on the same page nowadays.
I was just going to ask about
target=new– but, silly question: what’s with the underscore? I’ve always writtentarget=new, nottarget=_new, and always in place oftarget=_blankbecause (stupid, self-presumptive reason) “new” seemed more semantic lol. Thanks for the post.Thanks for your given link where discussed about the link behavior of target-blank and new. It is obviously, important to user to have their desired link page on a same window instead of opening new window for each click.
You mentioned not wanting users to leave your site as a bad reason. This makes the assumption that the goal of the site is to provide the best possible user experience. It would be a great user experience to let customers know your competitor is having a sale this week. The site has a reason for existing and all techniques should support that end.
@Michael: The difference is that
target="new"opens a link in a tab/window named “new”. If no such such tab/window exists, a new one will be created. But if there’s already a tab/window named “new”, it will be reused.target="_new"on the other hands opens a new tab/window every single time. See also my other comment.C’mon people! We’re Web Developers here!! I’m honestly disappointed in all of you. Let’s get this crap straightened out — now, and hopefully next time: let’s start here: MDN Reference
Russell’s article is wrong.
_new, as a value of the target attribute, has no different meaning thanstickybuns349would.Talk about playing telephone. Let’s take it from the top:
_self:[default] – Loads the page into the same “HTML5 browsing context” (tab, or window — browser/user preference I guess) as the current one._blank:– Loads the page into a new, unnamed browsing context. Always opens in a new tab/window.There are two more values that have to do with frames:
_parent:– Loads the page into parent browsing context, and if there isn’t one, behave the same way as_self. This means, it loads the new page to the parent frame._top:– Loads the page into the top-level browsing context, which means “the whole page” in a situation where you have nested frames.If you specify
targetto anything that isn’t one of those four values, it will open the page in a new tab/window who’s name will be your target value. If a tab/window already exists with the same name, the page will be loaded there.Haha, VERY timely. As I got the email I was debating in my mind whether I should remove or keep a target=”_blank”. Thanks as always :)
Can you please share your idea, weather to keep or not. I tried to read and still am confused that weather I need to used it or not on my website Santosh-shah.com
Spot on.
As I replied on Twitter, another bad reason is that some devices (i.e. Kindle) fail to open a link if target=“_blank” is specified. For example, the Kindle has a single-tab browser and instead of ignoring the attribute and open the link in the current tab, it simply throws an error.
To me this does not qualify as a good reason to avoid using
target="_blank"so much as an example of poor programming on Kindle’s part. Considering the prevalence oftarget="_blank"it seems a sort of gross oversight on their part. Avoiding its use to indulge this seems like it’s catering more to lazy developers than to a better user experience.Very well spoken, Robert.
I agree with you 100%.
Chris,
Good read. You definitely made some solid points that I hadn’t considered. However, I still feel like this is one of those age old “rules” that is always brought up as a best practice, that really doesn’t present much of an issue for a majority of visitors the way it is portrayed.
So long as target=”_blank” is used sparingly and in a consistent manner that does not interrupt normal use of your website, I think you’re going to be okay. By and large, I’ve not had many complaints with opening new windows (I generally prompt users first) for external site links.
This is exactly my view. I haven’t made the sites I work on responsive yet, so my view may change. But my feeling is very much as Paul says that target=”_blank” is a bit of a shiboleth that “really doesn’t present much of an issue for a majority of visitors”.
That said, this article has prompted me to start a straw poll of everyone I know to find out what people actually think.
I’ve been a web developer for 15 years, always arguing these exact points. But until this day, I’ve never had a client that didn’t report external links without _blank as a “major bug”, and since most browsers these days open in tabs by default it doesn’t aggravate me as much anymore… I’ve given up :p
Both of the (real) “Good Reasons” don’t seem to support using target=_blank. They *do* both support the use-case of opening links in new tabs/windows, but not through markup. Breaking it down: both “Good Reason” use cases depend on the user initiating some action (be it media or something that needs saved) where blindly leaving the page is suboptimal. So it follows that *prior* to the user’s action, links should open normally. That is, when the page first loads, all the links should be normal and the link behavior should only be modified when the user initiates some action which shouldn’t be interrupted by following a link. So how then would all the links be converted to target=_blank? When the user hits play, would you add target=_blank to every link in the page? Why? It would be easier at that point to add the beforeunload handler, as mentioned at the end of the post. Or, better yet, use an event-delegated click handler that checks the status of any media (or potentially lose-able state) and open in new/current tab accordingly.
So, in summary, the only good use cases for target=_blank would be better served with JS handlers; therefore target=_blank should never be used.
Agreed!!
A very nice approach to the problem. I totally agree with you, never use target=_blank
Personally I take the “Internal” links and “External” links are different approach myself, not only for my personal web projects and portfolio but for the multi-million pound e-commerce site which I maintain on a daily basis.
Unfortunately in the latter scenario, the opinion of the Directors and their wishes far outweighs that of the front-end dev!
While I do understand that forcing a user’s browser to behave a certain way might be considered slightly annoying, I wouldn’t consider it invasive or wrong.
As the developers, we set the ideals and conventions for our users, it’s not about considering our sites special or better than the rest – but about using the tools available to us to create the experience for everyone and unfortunately it’s a constant struggle to retain the attention of users, leading them away from the site is not a good idea – in my humble opinion. ;-)
I almost feel like CMD (or CONTROL on Windows) to open a link in a tab is so conventional for most users that the decision a new tab should almost always be left up to the user.
Great post Chris!
I have not used target=”_blank” since probably the early 2000’s simply because of popup blockers and it was deprecated in XHTML anyways. I find no good reason to use it, instead opting for Javascript in several ways.
Method one (onclick event):
Some website
Method two (listen for event using jQuery, preferred way, especially for external links):
<a href=”http://www.somewebsite.com” class=”externallink>Some website
$(document).ready(function(){
$(‘.externallink’).on.(‘click’, function(event){
window.open(this.href);
return false;
});
});
This logic seems backwards. The primary purpose of popup-blockers is to stop window.open(). They generally leave target=_blank alone.
XHTML was a stillborn baby that everybody claimed to use, but almost no one really did (and by that I mean really sending the page as
application/xhtml+xmland not astext/htmlwhich got parsed as HTML (and invalid one because of that :).So why throw in JS (let alone jQuery) for such basic stuff as opening a link in a new window is? Let alone that, as Jason already pointed out, pop-up blockers chew on
window.open? :)(well, nowdays it works a bit smarter, when an
onclickevent is involved beforewindow.openbrowsers generally let it be)I’ve never seen a pop-up blocker that blocked windows opened by
target="_blank":)My experience was that popup blockers were blocking target=”_blank” and so I discovered window.open(this.href) and haven’t looked back.
As for XHTML, I didn’t know anyone who wasn’t using it. Different experiences, I suppose.
Of course, now the Doctype is much more simple and I still won’t use target=”_blank”. I generally use JQuery in a function nowadays.
Hmm…I have exactly the opposite experience, weird :)
Well, you didn’t understand me :) The doctype set in the (X)HTML code has nothing to do with how the browser will parse the code (don’t confuse it with page rendering modes: standard/quirks mode & all that good stuff) – the mime type sent by the browser is all that matters.
All IEs before IE9 could not parse such page and prompted a download dialog instead and that’s why nobody really used real XHTML, because it just wouldn’t work in IE :)
http://caniuse.com/#search=xhtml
Ugh…my post got messed up…
The first method is onclick=”window.open(this.href);return false;”
One more bad :
Because so much dumbasses will ask me for the 666th time why it doesn’t open in a new window, that I’m really stressed up with explaining the 667th time why it IS MOTHERFUCKER STUPID !
(sorry, I had to say it :) )
Disagree with external links not opening a new browser window if there is a visual cue or title attribute suggesting the different behavior. Links should behave the same if they look the same.
This is an interesting article. I have been taught to open external links (to a different domain) in a new window. When I put myself in the shoes of the user, I would actually prefer to open new domains in a different tab. When I’m reading a long article that links to a different domain (and I wish to continue reading the article), I find it much easier to use a simple control-W keystroke to close a tab than trying to navigate back to the article I was reading. It’s just faster and makes more sense to me. You don’t have to reload the original page, or worry about losing your spot. Thanks for breaking down the use of target=”_blank”!
I actually agree with you here. I honestly don’t know a single person who clicks a link when they’re in the middle of an article and doesn’t become frustrated when it doesn’t open in a new tab. Thus, losing their spot in the reading. I always thought it was logical to do it this way.
The point is not that you think users prefer to open external domains in a new tab. The point is that opening a new tab is already possible in the browser without any extra markup (ctrl+click in windows for example) and if you apply target=”_blank” in this instance you are removing control from the user.
If user A wants a new tab and user B does not want a new tab, applying target blank will only appease user A while not applying it will give both users the option to do as they please.
Personally I enjoy external links opening in tabs for 2 reasons.
As stated above, I can continue reading the article uninterrupted, and when I’m ready, go over to the new page.
If a user leaves your site, reads the article you linked to and closes the tab, they aren’t coming back to your site. By using “_blank” you are ensuring that if the user is bored with the page you linked to, at least your page is still open in their browser.
@Mazurka You are also assuming that user know they can (ctrl+click). I guarantee 7/10ppl do not know you can do that.
Exactly. We still use “target=_blank” for external links, mostly because it’s been a requested behavior from our site visitors and internal directors. I know from experience that at least some of our site visitors do not know how to manually open a link in a new tab and I’ve heard from a few who were dismayed when they were taken out of our site when they wanted to view another site linked on ours. Especially since we have a lot of directory functions that link out to other websites, as well as references to federal guidelines and forms hosted on federal government sites.
Yeah, I would never assume that people know how to open links in a new window.
@ryan you are assuming they don’t. The point remains that implementing target blank takes away control from the user. I still agree with chris that this method has it’s uses but is generally overused.
Kate, I agree with you completely.
Google Search and Bing open links in the same window, and Yahoo Search opens them in a new tab. It must represent a philosophical difference. Yahoo seems to be more aggressive at retaining users in general. Their search page has a message “Please try the full Yahoo experience at Yahoo.com”. It also tries to set it as the default browser on my iPad automatically. Both of these features I find irritating. Though, what is irritating for me as a user may benefit them. They must think so.
Modifier keys == power users
Missing from this conversation are the accessibility concerns. For example: for those with limited hand function or vision impairments, dealing with new windows opening unexpectedly require extra effort to close and to navigate back to the original window. Opening a new browser window can also be disorientating for very novice web users and for those who are visually impaired.
I’m surprised that there’s only one mention of accessibility in this discussion.
New windows can also be confusing for those with cognitive disabilities. Navigating along a page, click on a link, try to click the back button – oh wait, it doesn’t work. Why not?
WebAim’s take on new windows – if you’re going to use them, let the user explicitly know that the link that they’re going to click on will open in a new window.
But isn’t there scope for relying on browsers/accessibility aids to give the necessary feedback around what’s happening?
@Adam Wills’ comment about warning the user needn’t only apply to the visually impaired (e.g. hidden text for screen readers), but visual cues for other users (e.g. :after pseudo elements for target=_blank links) can prepare for the effects of selecting links.
To answer your first question: The XHTML 1.0 Strict (and 1.1 and 2.0) DTD had the
targetattribute deprecated as the whole idea of XHTML pages was that they were single viewport applications where you don’t open a new one ever (think kiosk mode). This is why everybody used XHTML 1.0 Transitional instead where you could use thetargetattribute so they could get around this so-called limitation.I say everybody, but only those who deemed it necessary that a non-JavaScript user (possibly visually impaired considering the time this implementation happened) be forced to have another window open when following a link. I just looked for
rel="external"on a link and opened a new window via script on click instead so I didn’t have to muck about with the Transitional DTD (transitional from HTML 4.01) in the first place…Mmm…. I still belive that external links should be treated different form internal ones. It seems to me a usability matter: different sites = different windows/tabs. Or not?
I use
target="_blank"for all external links. Not every user is tech-savvy enough to know how to open a link in a new tab (trust me) and will be lost clicking the back button to find their way back to where they came from. Opening a new tab on behalf of the user for external links means they won’t get lost. It’s helpful.Power users hate blank
target="_blank". Normal users need a helping hand, IMO. And it’s only a new tab. If it’s really a problem for the user, they can always close the opening website’s tab with a single click.Interesting factoid: Both Twitter and Facebook use
target="_blank"for all their external links. I think this makes sense, given that sharing links to external sites is a big feature of social networks.Oh my god Neave! I loved your games :D and your magneticNorth stuff.
I didn’t know that about Twitter and Facebook.
I agree entirely, target=”_blank” needs to have a very good, very specific reason to be used. It’s a fight I’ve had to have several times (though thankfully always managed to win). As well as respecting default behaviour there’s the issue that as a user I can easily choose to open in a new tab with a middle click, but I can’t easily choose to make _blank open in the same window (even if I knew in advance I’d have to do so).
On a related note I’ve started noticing several sites doing the opposite and not respecting middle clicks opening a new window (hello Twitter, external links on BBC News).
With email html design, several experts are advocating target=”_blank” because GMail users may be accessing their email via the browser and find it an inconvenience to lose their email page. Perhaps this is one of the exceptions but I think I agree the user should know how to open a new tab or window by now.
The principle behind that is quite compelling, but I do want to point out that Gmail affixes
target="_blank"to all of the URLs within an email. So principle, good. Experts building the argument around Gmail, not so much (or at least grossly out of date).Have you really been watching “normal” web users ?
I can’t count the times someone closed the window/tab thinking it would return him/her to the previous page, only because the new page was on another website (visualy different) or a PDF …
I agree that the default behavior (self) should be used as it’s always possible to choose to open the link in a new tab, and that _blank can’t be manually prevented.
But watching novice users really showed me that most of the time it will save them time and frustration to use a _blank …
So is UX a matter of what’s best in an ideal world, or what’s best for our real users ?
Exactly, my experience as well.
When you’re reading a book, it sometimes refers to an index on one of the last pages. You keep your finger at the current page and use your remaining fingers to search the other page. Once you’ve found it, you let it all go except the finger you used to keep track of the page you were reading initially.
That’s exactly what I’m doing with links. As a blogger, I regularly add links to other pages like Wikipedia and CodePen for additional information or a demo obviously. So as you’re reading, I’m referring to an other source. To me, the current tab acts like your tracking finger so I want to open that additional information in a new tab.
Perhaps the user impulsively clicks a link on that other site and gets lost in a paradox of meme’s and cats across the net. That’s usually what happens to me and I hate it to find my way back to whatever I was reading. Maybe I shouldn’t reflect my personal preference on my users.
In my defence, several major social media, which happen to deal with links often, opens links in new tabs too. Facebook, Twitter, Google+, they all do it. I’m pretty sure each of them have well educated people running around that think choices like these matters a lot, and they chose to open links in new tabs.
Many of the points you mention are no good reason to open links in new tabs though, I’ll give you that.
Why do you get to decide? How do you know? Maybe I’ve gotten what I wanted from your article and am following the thread of what I really want somewhere else. Your reason is really just one of the aforementioned bad reasons.
@ChrisCoyier I totally want to agree with you and in theory it makes practical sense. But, @TimSeverien makes an excellent point. Facebook, Twitter, Google+ and other major social outlets use _blank linking as the default behavior. Has the prevalent use of _blank already changed what the “regular user” expects? These users spend a large amount of time on Facebook using _blank for every external link they click.
@Nate I don’t think Tim is saying he is making the decision. I think he is saying it was already made by Facebook and the like. If this is true, then us deciding to not use _blank for external links goes against what Facebook, Twitter and Google+ do and against what the “regular user” would expect.
Disclaimer: I am a taboholic and these opinions may/may not be influenced by my addiction…
Speaking of UX in this decision, I’d like to see data on what users expect when clicking a link that is obviously going to leave the site. Not that designers should do something “wrong” to appease users, but if it defies majority expectations it’s worthy of revaluation. Personally, I feel external links should open in a new tab. I think that makes sense, many of the points have been made. After reading the post and comments, one current thought is to maybe do so for larger devices only.
I’ve always stuck with the internal/external usage of
_blanktoo. I’ve been struggling to fully write down my reasoning why, but here is my best attempt.I have grown up using the web with the impression that external links will open in a new tab. Whether or not it was right for that to be tradition in the first place is a different discussion, but as it stands I expect external links to open in a new window. I can only assume most other web users expect this behaviour too.
Most of us are aware of the tab click in one of its forms, be it the middle click, ctrl click, cmd click or what have you. But anytime I have seen a non tech-savvy person using a browser; they either don’t know it exists or forget to use it at reasonable times.
For your average user, browsing the web is second nature. You know when you want to open a page in a new tab, and you know how to do it too. If something unexpectedly opens in a new tab, you are very aware of it… The back button gets disabled, all your tabs shift slightly and those senses you’ve developed from thousands of hours of web use let you know that there was definitely a
_blankon that anchor. So what do you do? You just close the other tab. Minimal effort*.Now for that non-savvy user, the one who expects internal links to remain on the same page and externals to be in a new tab. What do you think happens when they’re done browsing that external site and want to go back to the page they were on? They close the page they’re on expecting to see their previous page open on the old tab. Why do they close the page they were on? If there’s one thing they think they know about the web, it’s that external links will open in a new tab. They know that because they have been made to look the fool many a time while trying to figure out how to go back to the page they were on after a page opened in a new tab. They learn it at the same time they learn there’s a tabbing system in whatever browser they use.
I’ve seen it happen many a time, with my own eyes no less.
When that non-savvy user closes that window, they lose that whole session**. Now that user has to fish around their history trying to remember where they were. It ends up being a lot more of an inconvenience that it would be for your adept user to just close the previous tab.
I’ve probably gone on too long, congratulations if you made it this far. I’d be interested to hear your response.
*Assuming that
_blankis only found on external links, chances are you’re not going to run into that issue too often on a single site.** Yes I know there’s cmd + shift + T, but do you think someone who doesn’t know about the tab-click knows that?
Right. I see this as a “know your audience” decision, much like support for older browsers. Some sites can toss out support for IE8, for instance. I can’t. 8.25% of my employer’s site visitors are on IE8. 12% are on Windows XP. Many of them are not what I would consider tech savvy users. Many are retirees. They log onto our site and from there often reference state or federal websites and forms. In my experience, from user feedback and user research, they want these external links to open in a new tab. So that’s how we do it. If they didn’t want it, we would get rid of that behavior.
This right here is exactly how I feel on the subject. I am an experienced web user and I know a great many fancy key commands, but even I find myself closing tabs and wondering where the hell what I was looking at before went. Why? Because I clicked a link to a full screen image, a cat video, or a different site altogether. It just makes sense that those should be in new tabs.
Now, we can argue till our faces turn blue about what the situation should be, but take a look at what your users expect and build your UX around that. I suspect you’ll find that a large majority of the web will expect the internal vs. external differentiation.
Given how prevalent
target="_blank"is; I don’t see “My client wants it that way” to be a bad argument whatsoever. As many have already pointed out, this mechanic is arguably considered an industry standard. Clients are going to see links on other sites behave in this manner and then ask why their own links are not.I could give the most eloquent technical answer in the world; but at the end of the day it boils down to arguing that everyone else is doing it wrong. Stepping away from the expected can be beneficial, but I think this would be a hard argument to win and frankly, not worth the hassle in most cases.
Now if more sites adopted this mentality it would be another story. That won’t happen without convincing evidence that users find links opening in a new tab to be as you stated above: a nuisance, breach of trust, etc. I am assuming that this article is based more on opinion than polling but if I’m incorrect on that I’d love to read more about said polling; what users like/hate is always fascinating.
I don’t agree, opening new windows for external links or any page that does not have your site’s navigation is not only preferred by most users, its expected.
Recently, I have noticed that more and more sites are following the W3C’s suggestion to not use _blank and I find it annoying.
Not to be rude, Chris, but I think most of your clients are tech savvy, therefor, your opinion/experience may be a bit skewed towards users who know what they are doing. In my experience the average user doesn’t know how to do anything extra or special. Users don’t use the back button nearly often enough and they prefer to be helped along in their user experience. They don’t want to have to do or know anything they don’t have to. They like being hand held through a process. So if its better for your bottom line to open new windows because users tend to prefer it or are more likely to continue on your site, why wouldn’t you do so?
Further, the history of a browser window is linear, but in most cases when opening an external link you are going on a tangent. Users often get lost in the new content and forget or never go back to where they came from, unless of course you leave the original content open. Most external links are provided as an extra source of further information and do not flow with the content you are currently reading. If the link does directly flow with the content then you would either end with the link or the content would be within the page rather than somewhere else.
Using a single window for external links is like reading the first chapter of a book, coming to a sentence that references the second chapter, and then jumping to the second chapter without finishing the first. The external link is meant to provide additional information not void or displace the information you are currently reading.
I would agree that on browsers/devices that do not support tabs, new windows are far more annoying. However, that is why browsers created tabs in the first place to give the user a better visual of whats open and running and an easier way back to the original window/tab. Expecting a user to know their browser history, which is unseen, and remember where they came from is just silly.
Do you browse in a single tab all the time, no, no one does users open tabs for their tangent thoughts/content. I understand that you know how to navigate exactly how you want to, but most users don’t and helping them out and giving them a better user experience doesn’t seem wrong to me.
One comment said that browsers don’t allow the user an easy way to undo or force a single window click. Maybe that should be taken up with the browser rather than the developer, just like you are proposing that a new window should be defined by the browser/user rather than the developer.
In chrome at least, control + click opens a new tab, shift + click opens a new window, alt + click saves the link content, maybe they should add control + shift + click to open a link within the same window to override default behavior. Giving the developer the ability to program for the average user while still allowing the special case to do as they please.
I agree, and re-thinking the default would be my main point: the default behaviour came about in times before tabbed browsing, and if it wasn’t for tabs, then probably the perceived convenience of one way or the other would be very different. I would be interested to know if the “average” user is the savvy or non-savvy one (ie., the one who knows about ctrl-click or doesn’t), but I’d wager the proportion of non-savvy users is significant either way. Expected behaviour is a big UX factor that can’t be ignored for the sake of the intentions of the initial default behaviour from when browsers were different and anyone who regularly used the internet had above-average tech affinity.
That said, all points made about forcing behaviour onto users are completely valid, it’s just no use to try and battle reality with ideology. The best way to address the issue may well be to change the default to _blank and allow for filtering to use _self for internal links (developer side), non-tabbed browsers or a user’s accessibility settings (client side). This way the element of choice doesn’t get lost by catering for expected behaviour, and all the important use cases for _self can be addressed.
Today’s default behaviour is tomorrow’s history. Yesterday’s deprecated attribute is alive and well today- is it not so?
Thanks to the poster who mentioned target=”_new”, as that would work for me and seems the better alternative. Not likely anyone will want to keep two references from the page they’re reading open at the same time, and browser tab proliferation I believe to be a nuisance for most of us.
I would like to read more about accessibility and these practices. How does a screen reader respond to a new browser tab opening, for example?
Another good reason: you are trying to make your website/webapp to play nicely with Firefox OS when running in ‘chromeless’ window.
We went through this trying to submit liftie.info to Firefox marketplace.
They (Mozilla) want external links (as in links that take you outside of the web page domain) to open a new window since there is no back button (software or hardware) to get back to your app otherwise. They even suggested using: https://github.com/digitarald/chromeless-external-links-snippet
On the other hand Amazon store has a very different policy: they need to be convinced each _blank link is really external ;-)
If you want your site to “work like an app” then _blank is a pragmatic reality to avoid breaking the illusion.
Imagine if clicking a link in outlook opened IE and closed outlook.
Even though the back button is in theory your breadcrumb trail back, you’re SOL if you wander down a rabbit hole, end up on a site that aggressively redirects, find a site that hijacks the history, or ever accidentally close the window or tab.
The other way to look at this is along the spectrum of how reputable the links may be.
On one end of the spectrum, the links placed there by the site’s creators are exactly as reputable as the site itself. _new is totally the right choice.
On the other end, links in youtube comments are super suspect. _blank is a much better option.
Other user generated content will be on that spectrum somewhere. The Probability-of-my-mother-landing-on-a-Russian-porn-site index should guide your choice.
Exactly, except using _blank half the time is even worse than not using it at all. Now users wont know which links on your site will open _blank and which wont.
That is why it is best to open all external links in a new window, for consistency across your site and all sites.
Since all the big sites do it, do you really want to fight them simply because the developer community, maybe (definitely, not the user community), prefers it.
As others have mentioned, if all the big sites do it there has to be a good reason, whether its because users prefer it, its better security, or simply its the way all major sites do it so they just follow suit.
The time to not follow the crowd is when not following the crowd produces a better result, in the long or short run. I don’t see not using _blank ever producing a better result to your bottom line, traffic, user interaction, etc.
Here is a good community question. Using target=”_blank” on pages that are in the same domain but serve a different purpose like (Support) would it make sense to put target=”_blank” or not for pages such as that.
Bad idea, imo. Before configuring my browser to ignore the target attribute, clicking through support jungles usually left me with 10 open tabs.
Here’s an example in the wild that uses the
blankvalue for everyone to discuss:http://developer.vimeo.com/player/js-api#universal-with-froogaloop
Click the link that says “Github page”
It’s worth mentioning that people who use screen magnification software, and people with certain cognitive difficulties, will find pages that open in a new browser window confusing. In both cases the person may be unaware that the new page/tab has opened, and that can have some unexpected consequences. The back button appears to be broken for example.
You’re advice to use _blank sparingly makes sense, and from a UX point of view the use of a notification or warning that a new page is about to open is a good approach.
I would think notifications would have the potential of being even more confusing? The scenario I am envisioning is as such:
User (difficulties, special needs not being considered here) sees a link he or she wants to visit. Link is pressed. Users EXPECTATION is that the link will be loaded. This does not happen. Instead, the user is presented with a dialogue about how this link will open in a new tab. Some sort of action is then required to remove the alert and begin the process of forwarding the user on toward his or her original expectation.
Breaking this down we have a couple of additional headaches.
1.) This is done for all links that open in a new tab. Each time the user clicks on of those links they get the same alert box.
2.) The dialogue has an option for hiding the notice in the future. Now we are asking the user not only to interrupt their expectation once, but to interact with the dialogue box in an entirely different manner so that they can indicate just now unnecessary they feel the box is.
3.) Regardless of 1 or 2 the presence of a dialogue in lieu of the expected event may simply CONFUSE the user. They may assume something is wrong because they clicked a link and the link did not do what they thought it would.
… I do not mean to dissuade or dismiss that someone with special needs may find these tools helpful; but rather to illustrate how cumbersome this could be if implemented regardless of the users specific needs.
I don’t know Chris, I take your point, but I’m not convinced :)
BTW, I don’t see anyone here mentioning the right-click-then-click “Open link in new tab” method, which is what I used to use for YEARS, not realising about the middle-click method, until I observed someone else doing it. Kind of like double-clicking on a word to quickly highlight that entire word, rather than highlighting it from beginning to end: one of those shortcuts you think are a bit weird until you actually use it a few times, then discover it’s awesome. Point being: do users know that they can open in a new tab or window if they desire? Several years of closely observing users during training sessions has shown me that:
1) many users don’t right click, ever (so would never see the context menu in their browser)
2) most users don’t know about middle-clicking or Ctrl-clicking or [Meta-key]-clicking a link
3) many users are pretty comfortable hitting the “Back” button in their browser, but are also pretty comfortable closing a window or tab, and get pretty confused when they occassionally close a window or tab at the inappropriate time (when target=”_blank” was not used)
At the end of the day target=”_blank” is so widely used that I’m not planning to change :) At the same time, I’m not going to scream if someone wishes to do it the other way, for the reasons Chris mentioned.
The only thing that I believe should always be avoided, is what Russell mentioned: using target=”_new” or target=”whateverYouLike”, as it had, and has, a tendency to cause a really bad usability problem (“why is my window not opening” / “why is nothing happening when I click the link???”…. “oh, it opened correctly, but in another window that I already had open, in the background, and it’s behind this window, so I couldn’t see it”).
Another reasonable use for
target="_blank"is when webpage viewer kind of expects the content to open up in another tab. For example with online store button “procceed to checkout”, many buyers still expect to be transfered to another tab. That “mini heart attack” for them (especially old people) when they think lost everything they were doing, gosh.. :)You forgot one of the main reasons why the
targetattribute exists. Rememberframes, or nowiframes. You can target a link on your page to refresh the content in a targeted frame via itsid. In my opinion,_blankbeing used for external links is fine. As Chris said…Can’t reading be considered work? I understand that the back button will take them back to the page and scroll position they were on prior to leaving that page, but most people have short attention spans and can easily get lost down a rabbit hole clicking on every link that interests them. Good luck using the back button at that point.
There is also something called the Doorway Effect or Event Boundary. Just like when you walk through a doorway and forgot why you went into that room in the first place. Users can easily forget that they were reading an article in the first place and never find there way back.
What about ads? When would you ever want an ad not to open a new window/tab. I can also see how a link to an external site can sometimes be categorized as a self-serving ad.
I have a basic rule of thumb I like to use… when changing context, new window. This solves both the rabbit whole and doorway effect situations.
Power-users and programers seem to be the ones with the most to say about this issue. Most people probably have very little to say about this if anything at all. Especially now that we have tabs.
One of the reasons we have this problem is because there is no best practice. How can we preach about how much it shouldn’t be done if Google, Facebook and Twitter all do it. As long as the ‘Big 3′ do it, it will never change. The reason they do it has nothing to do with best practices by the way. Their reasoning is just as bad as the worst clients’, they want your eyeballs. If it was up to them, we would never leave their platforms and all browsing would be through their social networks.
Agreed
Great opinion, Josh. Completely agree with you. Especially here:
What if I told you that most end-users have no idea they can open a new window with right click or middle click?
Wel, IMHO, if i’m reading an article and it has an link for further reading in a subject, it should open in new window. Most of blogs and sites i visit don’t do that, and i find really pain in the ass having to go back with the browser, specially if it is an ajax based with no pushed history website……
I’m not convinced either.
There are three reasons why I always use target-blank on external links OR why I hate when websites open everything in the same tab:
1) Most users are dumb (considering non-techy people here browsing non-techy websites), usually they don’t even know there’s a possibility to open a link in new tab, therefore we have to guide them; otherwise they might never get back to our page from an external article.
2) I personally hate using the back button and wait til the page loads again and find the part where I was earlier. It’s much easier to open everything in a new tab, then simply close it, and having the original page back in the state where it was before.
3) Nowadays with that JS-overkill we see on web pages, with several 3rd party JS, too – I just don’t want to waste my time stepping back and forth in the history and waiting the pages to load and build up everything properly every time. Side-notes (referred articles, PDFs, etc.) belong to their own place off-side, and should not replace the original webpage.
I actually find some sites that don’t use target=”_blank” really irritating, particularly if they have very heavy pages and lots of comments (particularly if the comments are loaded through ajax). If I accidentally click the link, rather than ctrl+clicking, then I have to wait for the entire page to be rendered again, and lose my place in the comments. It used to drive me crazy on Smashing Magazine. And imagine how irritating twitter would be if links didn’t open in a new tab and you completely lost your place.
Opening in a new tab is actually quite user-friendly behaviour in the right circumstances. It shouldn’t be done everywhere, but the idea that it’s always, or nearly always, bad behaviour is simply wrong.
I’m currently working on a single page portfolio site, and I decided to put the links to the list of websites in a
target="_blank". My thought process was, since each website is a full fledged website on it’s own, sending someone there and having them click all around will make them forget where they came from. I think you’ll agree that this can be one of those good reasons (correct me if I’m wrong, I’m willing to listen to constructive criticism)…It’s unfortunate that no browser to my knowledge has chosen to support the guidelines for the ‘target-new’ property from the CSS3 Hyperlink Presentation Module, W3C Working Draft 24 February 2004: http://goo.gl/UbQn1a . (Yes, a decade ago.) If support had been implemented, a CSS solution would exist:
* { target-new: tab ! important }ora { target-new: tab ! important }.Whether visitors would have the knowledge & piece of mind to right-click a link to enable choosing a new tab or window in which to open a link, or whether as developers it’s our responsibility to force user experience by implementing behavior intentions via coding is perhaps a larger question.
Should a visitor opt to click a link while engaged in user initiated activity (media in play, a partially completed form, etc.), I do see value in preserving that activity. However, if we’re going to implemented a coding solution, I’d suggest using
target="tab"rather thantarget="_blank".target="tab"does validate in HTML5 on both Validator.nu Living Validator: http://validator.nu and the W3C’s Markup Validation Service: http://validator.w3.org .When I observe older demographic clients using an internet browser there is usually a case of tab-itis (the distant relative of div-itis I guess). They may have 10 tabs open from the same websites because they don’t understand the concept of tabbed browser navigation. When links are forced to open in a new tab, they’ve told me they feel robbed of their ability to go “back”.
For certain demographics, _blank targets can be a poor user experience.
I guess it all comes back to the preferences. Just something that I read a long long time ago (not quite sure the source), leave to the defaults. If the user doesn’t want to leave your site, they will open the link in the new tab themselves. Don’t force it on them
We use _blank when when users are in a conversion funnel and we have links for something, so that we don’t lose the user if they do click on an external link. If you have, say, a review site, you might want the users to be able to click on product links that open new windows so you can keep them on your site if they close the product links.
I think it is good for articles, references and social media.
Example – you’re reading an article and it references another article, I think that the linked one should open in another tab, so I can read it then close it without losing my place in the original article.
Often is the case that I will simply press Ctrl+click just to make sure it opens in another tab.
Where is the “Super like” button !
This should be managed by the user and the site designer should have nothing to say about. Sites that put me on the same page or another for any reason makes me browse their way and I don’t give a shit of their way. I prefer new tab on external site, and for me subdomain is a site change, and it should be manageable in the browser as a standard configuration point…
Dat moustache!
Great article, Chris
Why would the “good reasons” be any different. As the author points out, they can be handled (much better) by asking the user if they are sure they want to leave (and tell them about the consequences, like losing work, media stopping etc). There is still no need for opening links in another window/tab — doesn’t make any sense to me. Apart from that I totally agree while I know it is hard to argue this point even with clients.
I think
target="_blankis useful if you need to read a page (maybe a long page) with links for further informations, but you don’t want to exit the page you are still reading, because if you click the link and you change page you break your read-flow.If think is useful for the demo page in a tutorial or similar case.
I always find myself having an internal debate and probably end up doing neither choice consistently.
Thanks once again for clarity in this world of mayhem ;-)
My site, my decision – your site, your decision.
I love the target=_blank attribute.
I have sites with A LOT of external links and my sites are the threads which tie them all together. Someone else may see that differently, but as these are my sites, it’s my decision.
Every site I reference, references a lot of other sources in turn and so on.
Easy to get lost. Sometimes impossible to get back.
As I do not have control over what these referenced sites do and how they guide their visitors I consider it vital that I exercise all the control I have to keep guiding my visitors.
A user may want to consider to delve deeper into a thread, daisy-chaining a lot of sites. Making him pressing the back button a gazillion times then is supposed to be a good UI decision? You can’t mean that!
One step aside maybe OK, but what if they are 5, 10, 20 steps away?
Most likely they don’t remember where they came from, but it matters to me. Visitors easily get side-tracked.
As I cannot possible know whether a user wanders of 1 or many more steps, I have not choice but to use the target=_blank attribute.
I say it again: I love the target=_blank attribute.
So the user gets no say?
You’re funny. Of course the user has a say.
If the visitor doesn’t like my sites, he’ll leave anyhow. But it will be a conscious decision on his part and not an accidental leave by being sidetracked.
All the more reason to not facilitate unintentional departures.
The only scenario in which I currently use
target="_blank"is in a business application, where menu items link out to the corporate site and social networks.The decision was made to send them to a new window so that the user’s session isn’t interrupted, and so they don’t see a message triggered by
window.onbeforeunload.I do not second this opinion at all.
1) External links should be opened in new tabs becouse it leads to a different “application” or different “service”. Opening it in the current tab destroys the working session. It does not matter if a media is playing or am editing something or not.
2) Infinite scroll is a horrible thing, except in a very few places. Thats the real problem not the new tab thing.
3) Changing the link behaviour based on a media state (playing or not) is also a horrible idea. The user will not know why the site is changing constatnly.
I like to code without target but in the agency most of the customers expect a external page on a new tab. some people that are not into computers and web and do not organize their tabs and articles in new tabs for gathering informations for the near future. and complain about “uuh, how do i come back to the page is was before”. that topic is very hard to handle.
Basically I keep normal when interlinking my own page but when i link any external source then i use target=”blank”, my intention behind this is very clear that readers should not leave my page.
Two points:
As a user, it really annoys me when external links don’t open automatically in a new tab. Then I have to hit the back button and find where I was. Also, when reading blogs, I’ll often open the links I want to while reading, then go to those tabs after I finish the article.
As far as PDFs are concerned, I’m 50/50 on that one. I have had many instances in mobile devices and legacy browsers where using the back button was no longer an option. Personally, I don’t see any reason why opening them in a new tab is a bad idea.
But, these are my opinions, and you know what they say about opinions.
Great article, thank you! I wholeheartedly agree with all of your arguments.
That said, since you brought it up… search results links on this site open in a new window/tab — it’s something that’s always bugged me. Why do you have it that way?
Chris,
You should start a church for those conforming to your ideological reasoning.
For myself, I will ignore your “Bad Reasons” since I’d rather close a tab than hit the back button.
BTW, websites that over rely on javascript for navigation are losing eyeballs.
-Gary
P.S. I do like your blog, though. Very nice. Thanks.
It used to be a recommendation to leave links the default blue color as well, because the default was ostensibly what users expected. (Jakob Nielsen argued this vehemently.) But I’ll bet you’ll be hard-pressed to find a site built in the past decade with default blue links.
I’ll admit that for years I did my best to persuade clients to follow default behavior when it comes the target attribute. But my nearly 14 years of agency experience have taught me that clients and users (at least the ones that I deal with) simply expect so-called off-site links to open in new windows, whether I like it or not, and no amount of good reasoning will convince them otherwise.
Chris, you are totally right. Jakob Nielsen (you all know who he is) is telling the same things since the first release of his book: web usability. A bible.
Well said!
I just don’t want to ignore the impacts that others left on this page. May be we can be using a simple jQuery to add target=”_blank” to all the external links of our pages adding (+1) and (-1) values to a specific link. Also it can add rel=”nofollow” attributes to external links
Here is my blog post with detailed guide how the snippet works?
Automatically add target _blank attribute to external links using javascrip
We still use _blank quite often for a lot of reasons you named “bad”.
Please consider, that maaaaaany (way too far) people don’t know the “Back” button! Seriously! How many still think that the Google searchfield, that is so prominent in the middle of a newly started browser, is the place where to enter urls (“The addressfield? – What do you mean?”)
All the folks that are not into webdesign are more and more confused about the tons of different navigation philosophies, layouts, gimmicks, stuff that looks just great on our chromes and safaris but simply do not work at all in IE (newest versions).
My neighbours often drop by to ask my stuff about surfing and I learned a lot of them because I had to admit “yeah,…. I understand your confusion – consistency and clarity is missing”.
I have been back and forth with this and, in the end, decided to keep target=”_blank” for external links. My clients and a LOT of internet users are used to it. Including myself. Basecamp used to have images open in the same window. My client and even I would close the window, thinking it was new, and then get kicked out of basecamp. Basecamp has since changed that, probably due to a lot of complaints. When I’m on a site like siteinspire.com or http://mediaqueri.es/ or any sort of showcase site, I am expecting that when I click to view the website, it will open in a new window. Siteinspire does, mediaqueri.es does not. And it’s frustrating when I forget what the latter does.
In conclusion, I feel that all site pages should target self, but if linking to external page, it should open in a new window. The reason being because it has been this way for so long that so many non-techie internet users are accustomed to it. And I really don’t see it doing any harm to anyone.
But, to each his own…
For general purposes I have to agree with you, but I do think there are very rare exceptions.
I worked on a web application before that allowed you to read textbooks online and take notes on them. In these textbooks there were links to other parts of the book and links to external webpages.
Not being able to modify the look of these books at all (publishers) there was a problem with internal and external links looking exactly the same. This caused a problem with users leaving the application unexpectedly. Which was extremely frustrating.
Our solution to this, which was well appreciated, was to make all external links use
target="_blank"and internal ones use the default behavior.I think the requirements for making a decision like this are very narrow. It should come as a final solution, not an immediate or even secondary one. Often the features like this pop up entirely for business goals, but when it comes from negative user experience I think it is valid.
Chris, thanks very much for this article. It’s great to have the use cases laid out so clearly.
I’ve done usability testing on sites that have links that open in new windows or new tabs where participants get totally blocked because they doesn’t notice that a new window/tab was opened. On realizing they have landed on the wrong page they head straight for the Back button—and nothing happens. I’ve had to intervene and unblock participants in order to continue the testing. This has happened with sighted and screen reader users.
The important point for me is that users can’t not open a new window/tab if it’s set to do that programmatically. But users can open a new window/tab on their own if they choose to. I once did a usability test where the participant opened every link on the page in a new window. That’s what worked for him, but it was his choice, not the designer’s.
How much testing have you done? I was wondering if anyone had any evidence (empirical or anecdotal) in either direction. I haven’t sat through many UX tests myself but I think they’re incredibly useful for trying to figure out the ‘average user’ quirks that developers tend to overlook.
Tom, these are observations from usability testing sessions focused on other tasks (so, anecdotal). I agree—there’s nothing better than observation for learning about how people work!
We’ve had this discussion around the office- I was in the mindset of ‘metrics metrics metrics’ that was mentioned in the article. I’m swayed partially by the idea of not taking the control away from the user, but at the same time I can’t shake the stereotype that most users probably don’t even know they have the option.
I don’t quite see why my preference (as a user!) is an invalid one. Nothing annoying me more than people telling me I want the wrong thing.
In reality, it is not easily possible to force external links to open in new windows (it’s not a browser setting), and it is also not really easy to open a link in a new window, especially on a laptop where I have no middle click, so I need to either use both hands or two clicks.
That’s user inconvenience for me and I don’t see why that isn’t valid. That holds true for the client as well. If the client wants it, and especially if user testing shows it’s useful, that’s a perfectly valid reason to do so.
And loosing context (scroll position), either on infinite pages or just longer pages, really doesn’t matter that much, seems a perfectly good reason for me.
And I also don’t think that media playing is a better reason than scroll position – if you do it in the case you’re playing media but not when you’re not, I daresay that makes for a very confusing user experience.
Some user testing would be in order – and a nice jquery plugin to make it a sitewide setting too.
Interesting – we were just talking about this in the office this past week. I had sort of always been taught the internal/external method of thinking; nice to read an opposing viewpoint (and it makes sense). The “Good Reasons” section is solid one I think we’ll be implementing from now on.
I have to disagree with most of the bad reasons listed here. External links should open in a new window. PDFs, new window. I wouldn’t want users to leave my clients’ site. In a business point of view – you wouldn’t want your clients to lose leads, would you? You can’t also assume that all users know the ctrl-click. And the Back button? Come on.
That’s your point of view. And it shouldn’t matter much.
What should matter is the users’ point of view. For them, it’s just one Web, not your client’s site or somebody else’s.
Right on, Chris.
“Opening up new browser windows is like a vacuum cleaner sales person who starts a visit by emptying an ash tray on the customer’s carpet. Don’t pollute my screen with any more windows, thanks.” —Jakob Nielsen.
And in case you want to open a link in a another tab/window, it does not have to be a new one.
target="myTabName"will do in order not to open new tabs/windows every time, but to reuse that tab/window.No. target is not an HTML vs. XTHML issue, but Transitional vs. Strict.
target is valid in both HTML 4.01 Transitional and XHTML 1.0 Transitional, and is invalid in both HTML 4.01 Strict and XHTML 1.0 Strict.
@Gunnar. This.
Glad someone brought out the Nielsen quote. He got a bad rap recently for his take on mobile but don’t let that fool you—most of his stuff is dead on, especially this.
I get the premise, agree with most of your points, and totally respect having an opinion. But, does no one have any actual data on this? It seems like it’s always just another opinion, and I’m just as guilty.
We should have a way to validate the assumption that “users” don’t like something opening in a new window in certain cases.
Yes, we need actual data on this.
I feel we need data in both directions: some people here are saying that users get confused about new tabs/windows and therefore we shouldn’t use them; other people here are saying that users get confused by the back button and/or by situations where a link does not open in a new tab/window when they had expected it to.
Which of those two scenarios is creating more confusion for users than the other? Are they both creating confusion equally?
Do we need to completely standardise the way we use new tabs/windows, across the web? Is standardisation even possible, given the division of opinions presented above (or will developers keep doing it the way they personally feel is right)?
Will this discussion / debate still be ongoing five years from now?
I don’t understand if somebody say “I use target=’_blank’ because he will lose Clients.
Every Onlineuser knows how he can open Links in a new Window. And every time, a new Tab opens in my Android-Browser its very difficult, because you can have only 15 new Screens.
I’m not presenting this as a “good” example but it has or used to have millions of users. Facebook uses target=”_blank” on all external links. This is a good thing because people (my self included) tend to open 5-6 links before the read them, while skimming the “news”.
Also one can never be sure that the page the user navigates into doesn’t have some really bad javascript that messes with the back button, or if the user closes the tab after he is done reading “that thing he clicked”. Of course there is history but can we really afford all that confusion?
This whole conversation is stupid.
You guys who are arguing for people not to use it, are talking like it should be a topic brought up at the UN.
Different horses for different courses. If someone wants to use it – who cares?
I really don’t see why this has to be such a personal mission for some of you to let people know how much you hate us using target=”_blank” if it is valid and works.
User experience is so unique to an individual. I neither condone nor disagree with it’s use. And I’m not going to waste my time arguing about it.
DOH! There’s five minutes of my life I’ll never get back.
I think you all need to go outside, build a bridge, and just “Get Over It!”.
It seems like a lot of people are new to website design.
Opening links in new windows/tabs has been a usability concern since at least ’99. (See Nielsen’s Top 10 Mistakes in Web Design for reference.) I don’t think having browser tabs changes anything. I see people all the time when testing websites where they don’t realize a new window/tab is opened and they didn’t realize and they try to use the back button.
If anything, iOS makes it even more cumbersome since you need to click in 2 different spots to get back to where you were. Don’t blow up the most commonly used navigation item because you think your users are just like you—they aren’t.
Want something in a new tab? Let your users ask for it.
I usually use this argument when discussing whether to use a new window:
There are two types of internet users – people who don’t know or care anything about their browser, they probably just click on the ‘e’ or the little fox to get to the internet. Then there’s people like the people who read this blog.
The second type all know how to use cmd or whatever to open a new tab, and do so with abandon.
The first type get very frustrated when their back button stops working, because they don’t know how to get back any other way.
For both types of user, forcing a new window is therefore bad, as a rule.
Typically I would agree with that, except that our user testing didn’t go that way. Most of our users, who I would put in the category of people who don’t know or care anything about their browser, expected certain links to open in a new window and put in feedback complaining when it did not behave that way.
So at what point do you overrule your own user research because of a desire not to use a particular technique?
That’s interesting Jason, and of course specific case user testing will always override general principles.
I have just noticed what wasn’t discussed in the original article, and that is being able to identify the different behaviour of internal/external links via some kind of UI cue, like a different cursor or icon :pseudo element.
If only there was a standardised symbol for launch in a new window…
The act of making links open a new tab/window is maybe the most annoying thing I encounter while browsing because my computer just did something I didn’t want it to.
This is why I will keep using Firefox over Chrome. In Firefox you can change the settings so that links always open in the same tab, unless you choose to open the link in a new tab.
iCab Mobile on iOS gives you the same control.
I’ve had to deal with some of these in the past and always argued for just letting the user decide.
Come to think of it, I haven’t used target _blank in a long time. I’ve only had maybe one or two clients that were picky about the link target. I tend to open links in a new tab or window in the browser when I want to.
I am for the target _blank because I naturally hate when I am closing a tab and realising too late that I lost the page where I came from…
Sorry but my natural UX experience is to have a new website per tab and when I m done with a subject I close all tabs. Very easy and clear for me.
In most browsers you can always undo closing a tab, for example in Chrome shift+cmd+t in Safari it’s cmd+z
It seems like a lot of people are new to website design.
I agree entirely, target=”_blank” needs to have a very good, very specific reason to be used. It’s a fight I’ve had to have several times (though thankfully always managed to win). As well as respecting default behaviour there’s the issue that as a user I can easily choose to open in a new tab with a middle click, but I can’t easily choose to make _blank open in the same window (even if I knew in advance I’d have to do so).
Opening links in new windows/tabs has been a usability concern since at least ’99. check this for reference I don’t think having browser tabs changes anything. I see people all the time when testing websites where they don’t realize a new window/tab is opened and they didn’t realize and they try to use the back button.
As I have lot of external links in every post, I prefer to open them in new tab for ease of access and less distraction.
First off, great article.
A lot of this argument seems elitist in its approach. Best practice comes down to UI/UX. As a few commenters pointed out, we can’t control what an external site is going to do with a user.
For example, people often go off on a tangent clicking links on the new site. What happens when an external site has links to another piece of content/site and that page uses java script to hijack the back button or onpageload with redirects? This is frustrating for users who just can’t get back via the back button. It’s easier to just close that tab. And voila, our site is still there.
Don’t assume the rest of the web is going to play nice just because your intentions are laudable.
It comes down to if you are designing a site to present the best possible user experience and branding of the client/company, or are you designing a site to show how much you know about compliant design and code.
If you don’t like that my site opened a new tab as you were intending to leave my site, go ahead and close my tab. But in my experience when a user clicks a link to an external site, they expect a new tab, and automatically close that tab when they are finished with the external content. More user experience issues are caused when people close a main window thinking it was a new tab, than the situation of back button embarrassment due to a new tab opening.
More user experience issues are caused when closing a main window thinking it new tab than back-button embarrassment due to new tab opening. <- 140 char (it’s a tweet!)
När jag använder min telefon jag mycket hellre gå med fram och tillbaka i stället flytta flikar hela tiden.
I totally agree with this reasons. No one seems to think about the ux and behaviour on the smartphone?
How do you feel with target=_blank when you are using a mobile device? In some models you can only have a certain amount of tabs, when you open new sites your old tabs gets “overwritten”.
If your phone handles more tabs then it’s just very hard to find and keep track of your tabs.
When I use my phone, I would much rather navigate back and forth instead of looking sometimes tabs all the time.
Having started reading this thread and agreeing with Chris, I now find myself at the end and thinking the opposite. There are some real usability issues when it comes to reading content and clinking links within. I would expect that most people (generalising) would want to keep the article they are reading and see the new one. The benefits of a new tab, especially if the user wanders off to a new site and digs down into it are that they are only ever one click (close tab) away from getting back to where they came from, rather than a series of ‘back buttons’ to get there.
The only people who know about Ctrl+Click to open a new tab are probably the people commenting on this thread so I think I’m going to change my mind and go with new tab, although I can appreciate that some of the Good Examples at the top still stand the test.
and for anyone interested, here is a good article to balance Chris’ views.
http://uxmovement.com/navigation/why-external-links-should-open-in-new-tabs/
That UX Movement article is garbage. I read it looking for a counter argument related opening sites in a new window. There’s not one good shred of evidence in there. They’re claiming tabs have changed the game which isn’t true at all.
Hardly anyone in this thread has even mentioned mobile. Opening a new tab in iOS sucks, for example, and it’s super time consuming. To go back I need to physically tap twice—in 2 different spots.
The problem with designers is they need to let go of control. The user is in control, not you. Do no try to save the user from himself by “outsmarting” him or thinking you’re anything like him. I noticed new designers get into that trap of thinking “well I like to open tabs in new windows so it must be helpful.” It’s not.
Bottom line: don’t break my back button.
I’m not sure garbage is quite fair. The example of desktop users having several tabs open and being able to find something they want or were looking at a few websites ago is quite striking. I would suggest that most people’s browsing habits are like a pyramid, starting in one place a rapidly spreading outwards (IYSWIM?), in that instance, the back button becomes a burden. The linear progress of the back button can be awkward in this instance.
As for mobile, I think you make a fair point, I still can’t work out Safari on iOS7. Browsing habits would probably be slightly different on a mobile though and I guess no-one is advocating a different experience ;)
Again, you’re assuming most users are like you—and I—who like to have more than one tab/window open. Test some other less computer savvy users and you’ll find they quickly can get flustered when their back button doesn’t work. There’s no such thing as “back button fatigue.”
They might as well go on record saying clicking too many times you get “mouse fatigue” and that you should disable the user’s mouse randomly so users are forced to use the keyboard more often.
Smashing Mag did a nice recap on this back in 2008 but reading it over, the research is still valid today.
http://uxdesign.smashingmagazine.com/2008/07/01/should-links-open-in-new-windows/
I actually accidentally replied to Dani’s comment thread, with stuff that was more intended for you two, Dave and Peter ;)
For balance on our assumptions, having watched my parents and father-in-law, they’re both able to switch between tabs with ease as the tabs clearly say “Cheese website” and “Ham website”. When you start saying “Go back”, they get flustered by going back so far they hit the Chrome startpage. Mouse fatigue is probably a bit extreme (unless you’re arthritic!).
Having said that, I would concede that there is possibly some doubt over which tab to go back in.
It seems everyone here is discussing which is more “wrong”, new tab or same tab. That doesn’t seem to be the point of the article, though – it’s about the default behaviour and forcing the non-default onto the user and restricting options, which I think it’s easier to agree on as “that’s wrong”. The follow-up thought of “therefore the current non-default is bad behaviour” seems ideological rather than concerned wit the user.
Data on this would indeed be interesting, but the fact is, as it seems, that both behaviours have their pros and cons, and both user preferences exist. We can’t predict or prescribe how a user learns their way about the web, or which behaviour they find more convenient or confusing. Even if it’s as clear as an 80/20 split (which seems unlikely), making the web less accessible to the 20% is impractical.
Whether the default from the pre-tabbed-browsing age still makes sense, whether we could do without a default, how to use or provide various settings to produce the optimal UX for any taste or opinion, without limiting or forcing, that is a discussion that would be worth having. “I like my back button but my grandpa gets confused” is great for identifying situations, but it’s not useful to judge from that which one is the better user or developer.
So…any ideas how to cater to all scenarios with sensible defaults and unrestricting settings?
Well let’s be fair; this is of no fault to any developer.
Why does opening a link in a new tab break the back button? What the hell? I know where I came from, so how did the browser lose track?
The back button, even in a new tab, should close the tab and take you back to where you came from. If the tab you came from isn’t there anymore, it should just work like the regular back button. Easy peasy, right?
As for squabbling about all this internal-vs-external link preference — that is what is garbage. Neither way is the solution — we’re not going to be changing the web or the expectations of 100% of users any time soon.
The real solution, is for browsers to allow users to enforce their own personal preference — similar in concept to how they can enforce their font-size preference.
What should developers do with their links?
Make an educated guess towards what the user’s preference would probably be, in the particular situation.
Do you guesstimate that most of your users will appreciate that PDF opening in the same tab? Will most users probably appreciate that a source citation link will open the cited article in a new tab, leaving the current article intact?
It’s the developer’s decision to make, and the user’s decision to override.
PS — I just opened an external imgur link from my girlfriend in a GTalk chat window… wouldn’t you be mad if your entire Gmail/chat session was lost? How dumb would that be? Blanket rules are not the solution here.
It should follow the use scenario. We used target=”_blank” to support the user in reading our technology radar report: http://radar.spree.de
If the user is interested in a specific technology and clicks the link, she or he will not lose the reading position and gets additional information in parallel.
I was using target=”blank” . Because of this pages are not opening in new window or tab. Thanks for this post. I fixed it after reading this article.
I always use target=”_blank” !
I hate having to hit the back button. I mean, it just makes sense to open in a new tab, doesn’t it?
I hate it when web developers get preachy and get bogged down in discussions about “the right thing”. It reminds me of the pointless debate with strong vs. bold (of course, after wasting everybody’s time now bold and italic are back in HTML 5).
It’s a personal decision whether to use _blank or not, it has nothing to do with the craft of web development. The only thing we need to know is that in XHTML 1.0 strict links wouldn’t validate if they had target=”_blank”. Luckily, that XHTML is now dead, so _blank is perfectly fine.
I completely agree with Paul Neave above. I always use target=”_blank” for external links, simply because not every users knows how to open a link in a new tab and it is convenient. You don’t have to go back yourself, the tab you were on stays open, and you can continue browsing if you want to.
There’s no good or bad in this case, if you ask me.
But whats wrong in keeping the visitors on own site? Though i dont use Taget=”_blank” but i was thinking to go for it. But now i wont do it. Thanks for clearing the clouds of confusion.
When it comes to web/app usability questions, we need to make a distinction between business objectives and user experience; between research-based decisions and personal opinions; and between user needs and personal motive. Keeping in mind these distinctions can help us develop a solution that keeps both users and website/business owners happy.
I hesitate to implement UI elements/behaviors based on how I want to browse the web or, worse, how I “think” people browse the web. We need to be aware about what people expect when they interact with a UI element. Web designers/developers take for granted what they know about browsers. The majority of people, even the most savvy, don’t know everything we know about browsers and all its capabilities. So if we’re going to change default UI behaviors that people have been accustomed to using for years, we better have some good data to back that up, otherwise bad user experience will result in unmet business objectives.
For anyone’s interest:
A short study I performed for myself on the use of _blank targeted anchors between countries.
The Curiosity of Blank Anchor Tags
I find it interesting that China and Taiwan choose to publish content so rampant with _blank’d targets. Is it the Chinese web-devs preventing the public mass’ habit of ctrl-clicking?.. or the other way around?
I think there is one subtle point in the argument against using “_blank” that is getting overlooked. If you leave it alone, it’s up to the user whether or not they want a new window. If you make that decision for the user, you stand to make some people annoyed at you.
Doing nothing is keeping with the expected behavior of the browser, and therefore the default behavior of the internet (from the user’s point of view). They can’t really get mad at YOU for losing their place if they click something. In the second case (using “_blank”) you are making a decision for the user, and if they get mad – they get mad at YOUR SITE.
Users are going to get annoyed if they’re going to get annoyed, who they get mad at is most important. I find a lot of users that don’t want to learn keys to make things work better are always half way annoyed anyway that they’re even looking at a screen.
But, I think having new windows in some cases is ok. Not across the board every external link on a site. Unless you’re facebook, but you’re not facebook. If you’re doing a social media type thing where people are posting links all the time, it makes sense to have them open in a new window. And in a shopping situation where you might lose valuable information, but a lot of that can and maybe should be handled with JS.
All this logic sounded reasonable to me until the responsive site we are building hit a snag opening a new windows on windows mobile. this is not allowed and open in the same tab. So we were trying to save state on the page for user input and just have learn links on the page but this cannot be done using _blank .. so i am searching for alternative options *sigh*
If you come to my house (or my store), I have certain expectations regarding your behavior. If that annoys you so much that you feel unwelcome, you probably are. If I go to your website, and you expect me to open a link in a new tab, do I get annoyed? No. Do I know how to open a new tab for myself? Sure. I also know how to close one.
Besides, you can set up your browser to ignore target=”_blank” tags on links anyway, so it’s not like “oh noes I want to open in this tab for the site’s owner won’t let me!!1”.
The web is our own, we do what we want. Always. I don’t have time for “your” stupid target=”_blank” tags: my mouse has three buttons!
A good reason: my client wants it like that.
And as usual, the client is dumb as bricks.
and you are probably one of those assholes who thinks everyone gets to play and everyone wins. So you want the visitors to like you, fucking rubbish. Your article makes me want to use the target = “_blank” more than ever. Here’s to hoping you get to drop by.
One other use case that I think is always ok would be for links using the mailto protocol -for users that have a web handler for mailto links, this will open the mail compose window in a new tab, which is definitely what I would expect to happen, and for other users the behavior will be unchanged. What do you think about that @chris?
Simple and best reason, I don’t want people to leave my content in half (that is why it is built for) ;).
I use target =”_blank” for external links. That, especially with tab browsing on all major browsers, anyone would not see that to be the most logical approach is fascinating. I also dislike when sites don’t use it. Then I have to go back and right click to get the new site in a different tab.