Skip Navigation | Groups
RxS Enterprises Logo

This site uses cookies- for more information see the Cookie Policy | Continue

Relative and Absolute Links

Tags: General HTML
2001082601 Email to Ronx
 
 
 

Relative and Absolute Addressing

This shows the differences between absolute, virtual and relative addressing


Absolutely Relative Addressing

First, a definition:

Site Root folder: The top level directory in your site. This can be located anywhere on the server. In a Unix environment the path may be similar to (but not exactly like) c:/apache/users/example/pub
In IIS the path could be similar to
E:/hosting/username/websitename/wwwroot

This tutorial will use two web sites:

  • Site 1 is www.rxs-enterprises.org
  • Site 2 is www.example.com/~rxs.enterprise/

Note that site 2 does not exist in real life, but represents a site using space "donated" by an ISP to a user named rxs.enterprise.

Up to a point both sites have the same file and directory structure. This short tutorial will consider the location of three files on each of these sites, using three different methods of referencing them.

The files are named index.html, privacy.html, and blorulec.gif located in each sites' root, mainpage, and images directories respectively.

1-Absolute Addressing

Absolute addressing specifies not only the location on the server, but the server itself. Notice that the addresses are unique to the servers, and are not portable. Absolute addresses also include the protocol in use. (for example, ftp://example.com/ may be a different server to http://example.com , or a different folder on the same server [just to confuse])
Use Absolute Addressing to link to other sites.

Site 1 http://www.rxs-enterprises.org/index.html
http://www.rxs-enterprises.org/mainpage/privacy.html
http://www.rxs-enterprises.org/images/blorulec.gif
Site 2 http://www.example.com/~rxs.enterprise/index.html
http://www.example.com/~rxs.enterprise/mainpage/privacy.html
http://www.example.com/~rxs.enterprise/images/blorulec.gif

2-Relative Addressing

(This example is relative to the site's root directory)

This mode of addressing is portable - it will work at any location on any server.
Use relative addressing to link to pages and files within your web site.

Site 1 Site 2
index.html index.html
mainpage/privacy.html mainpage/privacy.html
images/blorulec.gif images/blorulec.gif

3-Relative Addressing

(relative to mainpage directory)

This is the same as above, but from a different starting point - again totally portable

Site 1 Site 2
../index.html ../index.html
privacy.html privacy.html
../images/blorulec.gif ../images/blorulec.gif

Note how the ../ goes up one directory level, similarly ../../ will go up two levels, and so on. In effect, climb up the directory tree using ../ as rungs on a ladder, and slide down using directory names.

Exercise 1

In the following example:

<script type="text/javascript"src="../_themes/rxsprogs.js"></script>

What is the absolute address for the .js file?
Using the same .js file, what would be its relative address on the page
www.rxs-enterprises.org/mainpage/privacy.html
(Answers at the bottom of this page)

4-Relative Addressing

(relative to server Root)

This method of relative addressing is similar to the previous method - except the starting point is specified as the server root. This method of addressing is only portable if you have your own server (or virtual server) and you are are porting to a similar setup. If sharing a server, as with BT Internet, Freeserve and some other ISPs (as opposed to dedicated Hosts or WPPs ) the method is not portable. Addressing method 2 is often easier, but if the server root is the site root, this method eases the strain of wading through multiple levels of ../

Site 1 Site 2
/index.html /~rxs.enterprise/index.html
/mainpage/privacy.html /~rxs.enterprise/mainpage/privacy.html
/images/blorulec.gif /~rxs.enterprise/images/blorulec.html

The expression /~rxs.enterprise/mainpage/privacy.html may not operate correctly. BT Internet, for example, seems to use many levels of hardware and software URL aliasing and redirection, and working relative to the server root may lead to unexpected results

Exercise 2

What is the address relative to the server root for that .js file that goes on the same page in exercise 1?
(Answer below)

Answers

Exercise 1
absolute: http://www.rxs-enterprises.org/_themes/rxsprogs.js
relative: ../_themes/rxsprogs.js   (relative to the mainpage directory)
Exercise 2
relative to server root /_themes/rxsprogs.js