You are at sometime going to want to use links within your web page. These may be links to other pages, images, included items and so on. There are two ways of specifying these links, Absolute and Relative. Get them wrong and you'll have some very strange results......
These are absolute server paths, they are relative to your main
(i.e. the folder where your index or default file is held also known as the Root folder.):
/ tells the server to look in the Root folder
/mainpage.html tells the server to find the mainpage
file which is in the Root folder
/folder/mainpage.html tells the server to find the
mainpage file which is in a folder called folder, which is in the
The following absolute path is relative to the world wide web: in other words it tells the server to go onto the internet and find mainpage within your domain
The following example is relative to a file residing in the same folder:
This relative path points to a file which is one folder up:
The absolute path to the main page of a typical web site would be:
A page residing in
that links to your home page would use one of these absolute paths:
The last two examples are absolute server paths, you may think of
the first forward slash in these paths as representing your domain.
Note: Your main page must be named "index" (a few hosts use "default" instead) but may bear any of the following file extensions: index.shtml, index.htm, index.html, index.shtm, index.php, index.cgi..., in each case using the absolute server path : / would send you to the home page.
If your html file is in
/homes/example.html and your
image file is in
/images/example.jpg you can embed the
image into the page
example.html using an absolute path to the file:
A relative path to the same file would be:
With an absolute path, it doesn't matter where the html file
calling the other file resides.
You may place
/pages/example.html and embed the image as:
With a relative path, if you place
/pages/example.html, and embed the image as:
<img src="images/example.jpg"> (a relative path)
then your image file will not load. This is because
is looking for
/pages/images/example.jpg, which does
Paths used in links work in the same manner as those used in
images. For example, imagine
example.html is in
/homes/example.html, and it contains a relative link to
anotherpage.html. This link would appear as:
If you move your
example.html file to some other
folder within your web site then the link will no longer work. This
is because, by asking for a file via a relative link, you are
telling the user agent, the browser, that the file you have created
a link to is located within the same folder as that of the calling
If you are borrowing use of an SSL certificate, such as the one
provided free of charge to Internet Connection customers, when a
webpage changes from http protocol to https (SSL), if you embed any
images by absolute paths without domain names
they will be broken.
If you embed images with full URL absolute paths
(http://yourdomain.com/images/o.jpg), the images will
show up, but the user will get warning messages that the page is a
mix between secure and non-secure items.
On web pages that make transitions between http and https, one should use relative paths to avoid these problems.