The A Tag

The A (standing for Anchor) tag is probably one of the most used in HTML, and it's certainly one of the most important. It's the tag that creates any kind of link - and now I'll tell you how it works.

You've probably already worked out that the A tag is going to need some attributes, as just putting <A> in your code isn't telling the browser much. The important attribute is HREF, which is where you put your path that you've just painstakingly learnt how to create. Here's an example:

<A HREF="../myfile.html">Click here to link</A>

As you can see, after the A tag you put the text you want to act as the link followed by a closing /A tag. The result is this:

Click here to link

Whatever type of path you've got, it works in exactly the same way. Bung the whole lot in quote marks, stick an A HREF= in the front, add a description and you're away. Just make sure you close the A tag, or weird things will start happening.

Understanding Targets

Another important attribute of the A tag is TARGET. This tells the browser where to open the file specified by HREF and is most commonly used in sites with frames. I'll explain more in the Frames guide, but there is one thing you might like to know.

By specifying a target of "_blank", the file will open in a brand new browser window. For example:

<A HREF="../myfile.html" TARGET="_blank">Click here to link</A>

Click here to link

You can also open a new window and assign it a name. This means that you can then open other files in that new window, rather than yet another one. Just put whatever you want to name the window as the target:

<A HREF="../myfile.html" TARGET="Window2">Click here to link</A>

A Quick Trick

OK, seeing as this section is fairly short I'll squeeze in a quick trick for you. Have you noticed on some sites that when you hover over a link some text appears in the status bar as opposed to the usual path. You can do this with the following code:

<A HREF="../myfile.html" onMouseOver="window.status='Replace with the text you want to appear in the statusbar'; return true;" onMouseOut="window.status=''; return true;">Click here to link</A>

Click here to link

Technically this is JavaScript, but you don't really need to understand exactly how it works. Beware though - some people don't like their status bar being tampered with, so you might want to avoid this unless it's really useful.

Automatic Linking

There may be times when you want to automatically link to another page after a set amount of time. To do this, insert the following code in the HEAD section of you HTML page:

<META HTTP-EQUIV="REFRESH" CONTENT="5; URL=http://www.newsite.com">

In the CONTENT section, replace the 5 with the number of seconds you want the browser to wait until the redirection, and specify the URL to go to (in the example, http://www.newsite.com). You can use relative or absolute addressing.

It is advisable to provide a link to the new page anyway, in case this tag does not work (although it should in most modern browsers).