Next: Part 10, More about linking.

We've already learnt to link to web pages (and indeed any other file on a web server) in part 3. There are a few more things that can be done with the humble <A> element.


Linking to part of a document: Sometimes we want to link to a point in a web page other than the start. This is easy so long as we're the author of the document.

<A HREF="myfolder/myotherpage.html#bookmark">...</A> will link to the point in myotherpage.html marked with the following code: <A NAME="bookmark">...</A>. Note that the link needs a hash sign #, but the corresponding NAME does not.

This code can even be used to link to points within the same document: <A HREF="#bookmark">...</A> will link to the point in the current document marked with <A NAME="bookmark">...</A>.

The value of the NAME attribute is up to you and you can have as many as you need in any web page. For instance in my Star Trek pages (e.g. http://steve.pugh.net/fleet/twenty_fourth.html) I have links at the top of the page that take the user to all the main sections lower down the page. NAME values should be composed of alphanumeric characters only, with no spaces.

A link can have both an HREF and a NAME attribute, <A HREF="myfolder/myotherpage.html" NAME="bookmark">...</A>, making it both the start and end point for links.


It's possible to link to an e-mail address via the following syntax: <A HREF="mailto:steve@pugh.net">...</A>. Note the inclusion of the MAILTO, this is vital to the working of these links.

Also note that these links only work if the user has some sort of e-mail software set up on their machine and if the browser knows about it. Users of shared machines, internet cafés, etc. will therefore not be able to use these links. For this reason it is better to use a feedback FORM for important communication channels.

It is possible to extend these links to pre-specify the subject line or body contents of the e-mails initialised by these links. However many older browsers and/or e-mail programs do not understand the required syntax so it is best to avoid these for now. If this sort of additional information is critical then you really should be using a FORM of some sort.


If you move your mouse over this link you may (depending on your browser) see a small tool tip with a short message. I created this by using the TITLE attribute: <A HREF="index.html" TITLE="Index page for these tutorials">this link</A>.

Example of tooltip for anchor element

The TITLE attribute can be added to almost every element, but its use on the anchor element has better support amongst slightly older browsers. As it may or may not be displayed and may be displayed in a number of different ways (tooltips are common but others, such as using the browser's status bar, are possible) it should not be used to display vital information but rather to add supplementary information about the element in question. In the case of links it should be used to provide some additional information about the linked document.


Next: Part 11, A touch of style.