Roger Johansson discusses the target attribute which tangentially relates to the practice of using JavaScript in new windows.
A lot of people got confused and even a little upset when the target attribute was deprecated in strict doctypes. They saw the decision as arbitrary and limited. In fact, the censure makes perfect sense.
Think about all the style-based attributes that were deprecated. They were dropped because they have no semantic value. They describe how content should be displayed, not what it means. It’s the same with the target attribute. It describes how a link should behave, not what it is. In that sense, it’s the polar opposite of semantically meaningful attributes like rel and rev.
Style should be handled by CSS, behaviour should be handled by a scripting language like JavaScript. Style and behaviour should not be specified in a markup language.
Now that that’s out of the way…
Suppose you do want to open a link in a new window. What’s the best way of doing it?
You could use a bit of DOM Scripting (setAttribute) to add a target attribute, but that’s just passing the buck. You might as well just stick it in your markup to begin with.
It makes more sense to use the open method of the window object; the Browser Object Model in other words. You’ll want to do this unobtrusively of course, so you’ll need some way of specifying which links should open in a new window.
A lot of people suggest making use of a rel="external" declaration in the a element. The problem with that technique is that it presupposes that the behaviour of activating the link should be defined by whether the link is off-site. In fact, as Richard points out, the most useful examples of opening links in new windows are log-on screens and contextual help. In most situations, neither of those would be off-site. The idea that any off-site link should open in a new window, whether the user likes it or not, harks back to the late-nineties mindset of the internet as a collection of “sticky” walled garden websites.
That’s why I didn’t use the rel="external" declaration in the example I talked about in the book (it’s in the sample chapter). I just used a plain old class attribute.
That said, the class name I chose, “popup”, isn’t very semantically meaningful. It’s not much better than assigning class names like “big” or “red”. If anybody has any better ideas for a class name for the links, I’m all ears.
A nice addition to scripting links to open in new windows would be to make the behavior more obvious. Using a simple bit of DOM Scripting (createTextNode and appendChild), you could add a piece of text like “[opens in a new window]” to the existing link text.
But DOM Scripting will only get you so far. The real challenge is to figure out if and when you should be opening new windows at all.
In today’s browser world, the target attribute and the window.open() method both seem somewhat parochial and old-fashioned. They both presuppose that the user-agent is capable of spawning more than one application window (not true of most mobile devices) and that a whole new window is the only way of having more than one URL open a time. Tabbed browsing put paid to that idea. I wouldn’t be surprised if browser makers began to extend the window.open() method (perhaps by adding another parameter) to allow the spawning of new tabs.
It could be a whole new world of intrusive advertising: pop-up and pop-under tabs.
Posted by Jeremy on Wednesday, March 29th, 2006 at 12:33pm
Comments
Jeremy,
I understand all that, but I am working with a Web application that uses frames in the window. The content in one frame has links that are intended to bring up new content in another frame. This is, of course, done using the target attribute on the links. However, to avoid having to include the target attribute on every link in a page (which could be several), it was convenient (and more efficient) to use the tag. With that deprecated how can it be accomplished without adding the target to every link individually?
Thanks, Gerry Hornik http://www.cognistar.com/
# Posted by Gerry Hornik on Wednesday, March 29th, 2006 at 3:32pm
Addendum:
In the penultimate sentence, the tag I was referring to is the "base" tag with a "target" attribute that sets the default target for every link on the page.
Gerry Hornik
# Posted by Gerry Hornik on Wednesday, March 29th, 2006 at 3:34pm
Hmm…
class="window" class="link" class="external"
You could also use multiple classes, "new window", "external link"…
# Posted by Douglas Clifton on Wednesday, March 29th, 2006 at 7:30pm
IMHO, there are absolutely no valid use cases for using popup windows and they must not be used under any circumstances. As for choosing the target attribute or window.open(), the target attribute is better for at least 2 reasons:
- It’s easier to configure browsers to ignore the target attribute when it would open a new window (there’s a option in the options dialog in Firefox). It is possible with window.open() as well, but not as easy (it requires setting a few hidden prefs in about:config).
- Users can be alerted to the use of the target attribute, such as through a user stylesheet, which allows them to make an informed choice for each link. That’s not possible with window.open().
# Posted by Lachlan Hunt on Wednesday, March 29th, 2006 at 8:20pm
I’m not a fan of popups either, but how is a class of "popup" any different from the target attribute, doesn’t it "describe how content should be displayed, not what it means"?
# Posted by Tanny O'Haley on Thursday, March 30th, 2006 at 2:53am
Tangentially, the latest Firefox has a setting to force all new windows into new tabs instead. One of the best things that ever happened to me!
Humbly, and not to be so "oh-please-see-me!", a mention of where the discussion originated (this time around) would’ve been nice… :-)
(at http://www.robertnyman.com/2006/02/13/how-evil-is-the-target-attribute/)
# Posted by Robert Nyman on Thursday, March 30th, 2006 at 6:30am
I can’t belive no-one has mentioned this but isn’t it the most logical thing for contextual help to have rel="help" set? It correct, it’s semantic and you can attach a window.open to every link that has rel="help" set …
I have a small test ready: http://slipsnisse.se/examples/datevalidation.php
# Posted by Mats Lindblad on Thursday, March 30th, 2006 at 9:55am
>hat said, the class name I chose, “popup”, isn’t very semantically meaningful. It’s not much better than assigning class names like “big” or “red”.
How about "OutOfTheWIndow"
# Posted by Sean-E on Thursday, March 30th, 2006 at 11:25pm
Hmmm,
class="windowWorthy" or class="newWindowWorthy"
I’ll have to think more about the significance of all this as I still set target to blank via javascript for rel=external on my site. I wasn’t aware I was being naughty in doing this. I’ll probably just end up agreeing that new windows shouldn’t be enforced, I think.
# Posted by Catherine Donaldson on Sunday, April 2nd, 2006 at 2:50pm
OK deprecating ‘target’ on a tags is fine. But what about on form tags. Other than ‘target’ how can you make a form submit open the action in a new window? I hope this wasn’t deprecated?
# Posted by JohnO on Sunday, April 9th, 2006 at 12:18pm
Sorry. Comments are closed.