Addressing

The most important part of any link is the path to the file you're linking to. This can be quite hard to understand at first, but it's easy once you get the hang of it.

Generally, links fall into one of two categories. An internal link pointing to a file within your own site, or an external link which points to another site altogether. Let's take external links first, as they're much more straightforward.

External Links

The path to any external site is simply its URL - the thing beginning with "http://" - that's important. Don't just start with "www" as it won't work. Some examples:

http://www.bbc.co.uk
http://www.bbc.co.uk/news/
http://www.bbc.co.uk/news/politics/story2.html

No, they're not all actual links - the point I'm making is that you can link to the site, or a specific page within the site. Put simply, just copy whatever you see in the address bar of your browser (unless the site uses frames). And that's your path - dead easy.

Internal Links

For internal links, things can get more complicated. You could use absolute addressing, in which case you put the full path (starting http://) to the page on your site. For example, if your site is at http://members.aol.com, you might have a link to "http://members.aol.com/username/files/download/game.zip".

You can also use paths starting with "/", which represents the root directory of your site. So the path to this page would be /warrior/tutorials/links/1.php. All we're doing is ditching the domain name - in this case http://www.code-warrior.co.uk.

This type of addressing will work, but I would advise against it. Instead, use relative addressing - this is where the path to the file is relative to the file you're linking from. The advantages of these paths are that they are shorter and allow you to test your site offline, without uploading it to your web space.

So how do you do it? I'll try to explain (it's one of those things that are 10 times easier to do than to explain!).

Look at the directory structure on the left - it's actually the layout of this site. This file is located in the "links" directory, which is within the "tutorials" directory. First, let's imagine I'm linking to another file within this directory. In that case, the path is just the file name, for example "myfile.html" - make sure the extension is there as well.

That's easy, but what if you need to change directories? The image shows the "css" directory files not the "links" directory files. To go down a level, just put the directory name, then a / and then the file name (or more directories and more /'s if needed). So if a file in the "tutorials" directory needed a link to a file in the "links" directory, the path would be "links/myfile.html". If I were in the root of the site (the "html" directory), the path would be "tutorials/links/myfile.html".

To escape a directory (also known as going up one level), you use "../" (as many times as needed). So if I'm in the "links" directory and I need to link to a file in the "tutorials" directory, my path is "../myfile.html". If the file is in the "html" directory, it's "../../myfile.html".

You can of course go up a level and then into another directory. Say I was in the "links" directory and wanted to link to a file in the "css" directory - the path for that would be "../css/myfile.html".

Hopefully that all made sense - now you should be able to link to any page you need. In the next section we'll find out how to put this path into action, but there are a few other types of path.

E-Mail Links

If you've got an e-mail address you want to advertise on your web site you can make it into a link which launches the visitor's e-mail program and opens a new message addressed to you. To do this, just put "mailto:" followed by the address, for example:

mailto:

You can even have the subject field filled in - for example:

mailto:

To see how it works, .

NB: that this only works when the browser is set up with an e-mail program - always include the email address itself (not just "Click here to e-mail me") in case the link doesn't work. For AOL members though this will work just fine as the email and web browser are all part of AOL itself rather than separate programs.

Other Sources

You probably won't use these very often, but you can link to FTP site locations, Telnet servers or newsgroups. To do that, just put ftp://, telnet:// or news:// followed by the server or newsgroup name. For example, to link to the newsgroup alt.html.tags the path would be:

news://alt.html.tags

Exactly how the browser responds to these paths varies depending on what software the visitor has installed.

Now you've got your path, it's time to actually make a link.