Let’s just take a moment to revisit how to best write URLs to other pages in your site, as well as the images, style sheets, and external scripts that each page uses. This demonstrates how valuable good relative URLs can be. Say you have already built a site and you want to create a new version of it. You might want to test the new site on the web server, but it will have to be in a separate folder, and therefore it will have a different URL than your current site if that is to remain live. For example, you might test the new site in a folder called newsite, so the home page might have the following URL:
http://www.example.com/newsite/index.html
But when you are ready to make the switch to the new site, you are going to want it to appear here:
http://www.example.com/index.html
If you are using relative URLs to link to all of your other pages, images, script files, and so on, then moving a site to a new folder or even a new URL will not be a problem. However, if you hard code your links using items such as your logo onto your front page using an < img > tag like this:
< img src=”http://www.example.com/newsite/images/our_logo.gif” alt=”Our Logo” / >; this image would not be loaded when you move the site to a new domain or a different folder. It is better to use something like this:
< img src=”images/our_logo.gif” alt=”our logo” / >
Now, as long as the images folder is within the directory that this page lives in, the image will be loaded, no matter where the site is moved.
