What is the difference between 'relative' and 'absolute' URLs?

911paramedic

Diamond Member
Jan 7, 2002
9,448
1
76
yup, what they said^^^^

relative just means in relation to your current position or location

absolute means the entire direction to a given resource

Remember what Albert says, everything is relative. :D

notfred, you snuck that in before me, I have to start typing faster, lol
 

b0mbrman

Lifer
Jun 1, 2001
29,470
1
81


<< Always use relative when you can if you ever want to archive the webpage. >>


Yep...I learned this the hard way :(
 

Viper GTS

Lifer
Oct 13, 1999
38,107
433
136


<< Always use relative when you can if you ever want to archive the webpage. >>



Relative also makes it MUCH easier to move pages around within a site, it can be a real PITA searching & replacing absolute links.

Viper GTS
 

Gorgonzola

Golden Member
Nov 22, 1999
1,300
0
76
thanks for the speedy replies everyone :)

thats what i thought it was, but i wanted to double check.
 

kgraeme

Diamond Member
Sep 5, 2000
3,536
0
0
To add to the discussion, there is root-relative and document-relative. A root-relative URL always starts at the root of the server, but doesn't include the "http://www.server.com" part. A document-relative URL starts at the document and moves up or down the directory structure from there when linking. Here are some examples:

Absolute: http://www.mysite.com/directory/file.html

Root-relative: /directory/file.html

Document-relative: ../../file.html

As was mentioned previously, using relative URLs will help for the portability of the site. But why would you use root vs. document relative URLs? In part it's preference. Most people find document-relative URLs easy to learn and use because they start out on fairly flat, simple sites (very few directories). But when you start getting into lots of files in lots of directories and possibly spanning servers of different configurations, sometimes root-relative can be very useful.

Look at the two relative URL examples above. With the root-relative URL, we know the location of the linked file. It's in "directory". But with the document-relative URL, we don't know the location, we just know that it is two directories up from the file it's being linked from. Both work fine with the files where they are, but what if we move the source document we're linking from into a different directory on level up? In the document-relative example, we would have to change the URL in the HTML code:

From: ../../file.html
To: ../file.html

In the root-relative case, we don't have to change the URL in the code because the root hasn't moved and therefore even if the the source file has moved directories. That saves us modifying the HTML!

Now lets say that both the source file and the target file are in the same directory in the site and that directory is three levels deep. Look at the code needed to link in each case:

Root-relative: /directory1/directory2/directory3/file.html
Document-relative: file.html

Which would you rather type?

As I've shown, both types of relative links have their advantages. So what should you use? Maybe both! For links in the body of a document, I often prefer to use document-relative links to save on typing and to keep that set of pages easy to work with. For site navigation though, I often prefer to use root-relative links. That way I don't have to change the links for the navigation for the different files at different folder levels and I can just copy-past the navigation code to any page at any level of my site and it will work.

Another reason often cited for the use of document-relative urls over root-relative is that they are more portable. If you move your site, you can put it at a different level on the new server and everything still links. So say you have a geocities account, the root of the server domain isn't the root of your site. (www.geocities.com/myhome) So every root relative link would have to start with "/myhome/". Then if you get your own domain (www.mysite.com), then suddenly the root IS the root. All your links are broken. Or maybe not if you used "base href" in the header. You can put 'base href="http://www.geocities.com/myhome"' in the header of your document, then when you move it to your own domain, you just do a search-replace on all your files to change it to say 'base href="http://www.mysite.com"' and all your files work again. The biggest caveat to using "base href" is that you are stuck using only root-relative urls for your site since all the links will be based off of the "base href".

I know that this all sounds confusing, but if you can get it down then you have nailed one of the fundamental pieces of knowledge needed for being a professional web developer. After this, it gets really confusing.