Opening a Link in a New Browser Window

browser windows that are opened and displayed without the user's approval. Although pop-ups have been used maliciously by some aggressive advertisers, they still serve a valid purpose in some instances when you want to present information in a separate web browser window.

When a linked page is opened in a new browser window, the original page is left open in its original window. To accomplish this feat, you can include an additional attribute in the <a> tag called target. You must set the target attribute to blank for this nifty little trick to work, as the following example shows:

<a href="../zoo.html" target="_blank">return to the zoo.</a>

When someone clicks the linked text in this example, the zoo.html I've found it useful is when you link to a page that isn't located on your site. This can be a helpful way to keep your site active in the background so you aren't forgotten when the link is followed!

the target="_blank" feature from XHTML. So, you can't use the code I just showed if you want your pages to be valid XHTML documents. But there's a workaround.

By the Way The W3C was a bit aggressive in throwing out the target="_blank" attribute setting entirely. There has been a lot of debate about whether web designers should force a link to open in a pop-up window. I think as long as you use pop-up windows sparingly for links that the user clicks, they are perfectly acceptable; a pop-up should never appear that isn't prompted by the user.

The workaround to the pop-up window restriction involves using a JavaScript script to sneakily set the target attribute of all the links on a page. You could argue that this workaround goes against the intentions of the W3C, and you'd be right. But the fact remains that pop-ups can be used effectively in some situations. You find out about one of these situations when you see a new version of the Music City Mafia hockey player web pages later in the lesson.

If my mentioning of JavaScript scared you, don't worry, because you don't need to know anything about JavaScript or programming to use an existing script. The script in this case is stored in a file named external.js. I won't even bother showing you the script code because this book isn't about JavaScript. What I will show you is how to use the script in a web page. The first step is to import the external.js script into the page, which is accomplished with a single line of code in the page header:

<script type="text/javascript" src="external.js"></script>

With the script imported into the page, all you then must do to create a link so that it opens in a new window is add the rel="external" attribute to the <a> tag for the link. The script looks for this attribute and then doctors the link appropriately so that it opens in a new window. The end result is a link that is opened in a new browser window but that is still compliant with XHTML.

By the Way The rel="external" code sounds a bit cryptic, but what it actually means is that the relationship between the link and the current page is external. In other words, the link should be opened externally, as in a separate browser window.