- Linking to Another Web Page
- Linking Between Your Own Pages
- Addressing Web Pages
- Opening a Link in a New Browser Window
- Linking to Google Maps
- Adding Links to a Practical Example
- Summary
- Q&A
- Workshop
- Exercises
This chapter is from the book
This chapter is from the book
This chapter is from the book
Opening a Link in a New Browser Window
Now that you have a handle on how to create addresses for links, I want to share one additional little linking trick that is somewhat controversial. You’ve no doubt heard of pop-up windows, which are new 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 web page is opened in a completely new browser window. I don’t encourage you to use this technique too much because most people don’t enjoy new browser windows popping up everywhere. One scenario where 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!
Now that I’ve shown you the easy way to open a page in a new browser window, I have to break the bad news to you. In an effort to discourage web designers from using the new window trick, the W3C removed 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.
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.