What is an href?

HTML stands for "Hyper Text Mark-up Language". The primary feature of the language is the ability to link pages together on the Internet. The links are created by placing an anchor tag (<a href="...">...</a>) around the clickable item. The href value tells the browser where to go when the clickable item is clicked.

Types of hrefs

The href value can take three forms

• full URL
• absolute path
• relative path

Full URLs

A full URL includes the protocol name (usually "http://"), a domain name (like "www.webmaster-showcase.net"), and a path (like "/building/index.html"). [It may also have parameters tacked on (like "?s=php") but this is just "HREF 101". Take a higher level course to find out about those. :-)]

Full URLs must be used when referencing a page that is not on the current website. Full URLs may be used for pages on the current website but usually should not be used for that purpose. Read on.

Absolute Paths

The href value may be shortened. It may only include the path. If the path starts with a slash, the path is absolute. Usually it is the same as the directory path from the home directory down to the file being requested. The absolute path version of the above example is:

Relative Paths

This version is even shorter (usually). The relative path is the path to the file being accessed relative to the location of the current file. Relative paths do not start with a slash. This may sound a little complicated but this is the best choice for href values if the target file is in the same directory or a sub-directory. The above example, written as a relative path would be:

You may even address files that are in directories above or in sibling directories by using "../". For example, the index.php file in the "php" directory on this website can be addressed as ../php/index.php. I recommend you use this with care since it can make re-organizing your web site more difficult.

Why are relative paths best?

There are a couple reasons to use relative paths: (1) they are shorter (in general) and, if you decide to move your website from one hosting platform to another or move a directory within your website, most of the links won't need to be changed.

Why are absolute paths the worst choice?

At first glance you may think that absolute paths are better than full URLs because they are shorter. The problem is that absolute paths will not always work correctly if the file is addressable in more than one way. For example, if the file is in a sub-directory and you decide to point a sub-domain at that directory, absolute paths in hrefs will address different locations depending on whether the file was accessed via the main domain or via the sub-domain. To illustrate the point, this page may be accessed either as http://webmaster-showcase.net/building/href101.php or as http://tips.webmaster-showcase.net/href101.php. If you use the first method for accessing this page then this link will show the page at "/dirpath.html". If you use the second link to access this page then that link shows the page at "/building/dirpath.html". So the same link shows different files depending on how the page with the link was accessed. Try it!

I arranged to have files with the same name in both of those directories so, no matter which way this page was accessed, the link always shows a valid page. If you use absolute links and then create sub-domains to access parts of your website, those absolute links will probably not always work and, if they do "work" they may not get to the originally-intended page.

So the best rule is: