Basic Of HTML & XHTML Lesson 7

Relative and Absolute Links

A Web site framework can become quite complex with multiple directories, folders, and subfolders. Creating a harmonious existence between the three can be a cumbersome task without the knowledge of relative and absolute links.

After completing this lesson, you should be able to:

Specify relative and absolute links to other Web pages
Determine the situations which would require relative or absolute links
Create active links to remote Web pages



Linking Local Pages

You can link pages that are on the local disk but contained in different directories or folders on that disk. When you specify just the filename of a linked file within quotation marks, the browser looks for that file in the same directory as the current file.

This is true even if both the current file and the file being linked to are on a server somewhere else on the Internet; both files are contained in the same directory on that server. It is the simplest form of a relative pathname.


Relative pathnames point to files based on their locations relative to the current file. They can include directory names, or they can point to the path you would take to navigate to that file if you started at the current directory or folder.

A pathname might, for example, include directions to go up two directory levels and then go down two other directories to get to the file.








Absolute Pathnames

You can also specify the link to another page on your local system by using an absolute pathname. Absolute pathnames point to files based on their absolute locations on the file system.

While relative pathnames point to a page by describing its location relative to the current page, absolute pathnames point to the page by starting at the top level of your directory hierarchy and working downward through all the intervening directories to reach the file.




Absolute pathnames always begin with a slash, which is the way they're differentiated from relative pathnames. Following the slash are all directories in the path from the top level to the file you are linking.





Relative or Absolute Pathnames?

If you have a set of files that link only to other files within that set, using relative pathnames makes sense. On the other hand, if the links in your files point to files that aren't within the same hierarchy, you probably want to use absolute links.

Generally, a mix of the two types of links makes the most sense for complex sites. A good rule of thumb is that if pages are part of the same collection, use relative links, and if they're part of different collections, use absolute links.





Create a link



Remote pages are contained somewhere on the Web other than the system on which you're currently working. The HTML code you use to link to remote pages on the Web looks exactly the same as the code you use for links between local pages.

You still use the tag with an href attribute, and you include some text to serve as the link on your Web page. Rather than a filename or a path in the href, however, you use the URL of that page on the Web: