Please refer to previous entries in the "Creating a Web Page" series:

• I: Getting Started
• II: Learning HTML
• III: Text

Ordinary links

While this tutorial doesn't assume any prior knowledge of HTML, it does assume that you've done at least a little websurfing. In that time, you've probably come across hundreds of links (sometimes called "hyperlinks"). They can be either text or an image that you click on to take you to another page. The tag for links looks kind of strange:

< A HREF="http://www.h2g2.com"> Hitchhiker’s Guide to the Galaxy < /A>

"A" stands for "anchor". You'll see later on that there are other types of tags that require an anchor. The anchors act as bookends to show how much of the text you want to be affected by the tag. In this case, it’s the words “Hitchhiker’s Guide to the Galaxy”. When you put in a link in your HTML, the browser will automatically underline it and change the color (unless the setting is changed in the preferences). Later on you'll see how to specify what color the link is changed to.

Opening a link in a new window

Making a link in a new window can be convenient- it allows people to view another site without losing yours. Note: you do actually type in the word BLANK, it's not just an example.

Sample HTML:

Here is the < A HREF="http://www.h2g2.com" TARGET="_BLANK"> H2G2 site< /A> in a new window.

Result: Here is the H2G2 site in a new window.

Targets

So far these links have taken you to other pages, either another page within your site or someone else's page. For a really long page, you can create a special kind of link called a "target" that will jump to another part of the same page. Targets come in two parts. The first part names the target, the place that the link will jump to. The target name should be short but descriptive ("top", "end", "section1", etc). The target tag goes around a word or a clump of text. For example, a target named "top" could go around the first header or even just the first word of the first paragraph. Since the anchor is just "naming" the text, marking the spot for later use, you won't see any difference in the text- the browser won't highlight it.

< A NAME="top"> Once< /A> upon a time...

To link to your target, you do something a little different: instead of saying "http://", you just type # and the name of the target:

Sample HTML:

...and they lived happily ever after.
< A HREF="#top"> Back to the top!< /A>

Click here to go back to the top of this entry

If you ever get an extensive list together, say of your favorite links, it could be handy to put in alphabetical targets. Also, if your text has several subheadings, you could create a target for each heading, then a menu at the top that would allow visitors to skip directly to a subheading instead of scrolling through everything that comes before it.

Email addresses and Usenet groups

Ever seen an email address that looked like a link? And when you click on it, it tries¹ to open up a blank email message already addresses to this person? With just a slight modification of what you've just seen, you can make a link do this, too:

Note that instead of "http://" and a web site address, you put "mailto:" and an email address. That's all there is to it!

You can also make a link to a Usenet group open up your default newsreader in a very similar fashion:

• V: Formatting Text and Lists
• VI: Tables
• VII: Colours
• VII.5: Images
• VIII: Sound
• IX: Promoting Your Website
• X: Design Tips