When creating links in your web page, you should use a relative link whenever possible. Use a relative link when linking to another web page in your own site and use an absolute link when linking to a page in a site that is not your own.

The main goal for a user is to be able to see a single web page. The difference above is that an absolute link has a full address to the page or file. There is no confusing what site that page is part of. When a user types in an absolute link, or a web publisher puts an absolute link in a web page, the browser knows exactly where to go to find it. The browser knows to look out on the internet at some web server for that page.

In the second example, relative links are a little different. The part of a relative link that is implied is from "here". Here is wherever the web publisher already is. When a web publisher uses a relative link, the browser knows it does not need to go out on to the internet and search for the site, but instead just goes back to where it came from. If my site is www.brown.edu/index.html and on that page I simply link to faculty.html, when the user clicks on that link, the browser knows to just go back to where it knows index.html is.

This makes web sites faster and will make your web site portable if it needs to move to a different address or file structure.

Rule of thumb: if you're linking to a page in your site, use a relative link. If you're linking to someone else's site, use an absolute link.

Advanced link information
Use this picture for reference:

The "www" represents your home directory. Your home directory is what comes after www.brown.edu. For example, the space that the home directory for Web Pub Central refers to is /webmaster/webpublishing.

index.html and faculty.html are web pages in the home directory.

images/ and people/ are subdirectories.

header.jpg, student.jpg and laboratory.jpg are files in the images directory

adams.html, barry.html and charge.html are files in the people directory

Here are some examples of using relative links:

Using header.jpg in index.html, my html code for that would look like this:
<img src="images/header.jpg">
Notice there is no slash before images

If I want to create a link from index.html to adams.html, my html code would look like this:
<a href="people/adams.html">Adams</a>
Again, no slash in front of people.

Now, getting a little tricky. If I want to create a link from adams.html to index.html, my html will look like this:
<a href="../index.html">Index</a>
That is two dots, then a slash and then the file name. The two dots and the slash mean to get the file from one directory up. Relative to where adams.html resides, index.html is one directory up.

If I want to use laboratory.jpg on charge.html, my html code looks like this:
<img src="../images/laboratory.jpg">
This code says to go up one directory from where you currently are, then go into the images directory and use the laboratory.jpg file there.

The Confusing Slash

A very common mistake that people make is including the slash in the beginning of a relative path when it shouldn't be there. A slash ( / ) means to look in the server's "root" directory. If you put a slash in the relative path, the server will look for your file immediately after www.brown.edu, and unless you're Brown's webmaster, your files are probably not there. Here are some examples of the use and mis-use of the slash.

If my web site is http://www.brown.edu/webmaster/webpublishing and in that last directory, I put html code that looks like this: <a href="/index.html">index</a>, then that slash in front of index.html will tell the server to look in the topmost directory and it will give back the page: http://www.brown.edu/index.html. If I want the server to send back http://www.brown.edu/webmaster/webpublishing/index.html, I just need to leave off the slash, or more specifically: <a href="index.html">index</a>

However, there are places where its perfectly acceptable (and actually required) to put the slash, and that's if you include the path from the point. If my html link looks like:
<a href="/webmaster/webpublishing/index.html">index</a>
That will work perfectly fine, because that is the full path to my file. It would actually be incorrect if I were to leave that slash off, because leaving the slash off means to look in the current directory where the page is. So if my html code reads:
<a href="webmaster/webpublishing/index.html">index</a>
Then the page I would get back would be:
http://www.brown.edu/webmaster/webpublishing/webmaster/webpublishing/index.html and I'd get a File Not Found Error.

The best thing for you to do is to try this out. Set up your directory with some subdirectories and try creating pages that link to each other. You can even put subdirectories inside of subdirectories! If you get the hang of it, try out the slash. See if you can discover when to use it and when not to.