If you're new to web design then this
can be a bit confusing at first. Basically, Relative Links refer
to files that are "relative" to your site. This means
that they are located somewhere in your web site folder. They can
be in the root directory, or several folders down, but they are
still relative to that particular site.
Absolute Links refer to external files
on someone else's site, outside of your site.
Absolute Link: http://www.cbtcafe.com
Relative Link: index.htm or ../tutorials/dreamweaver.html (where
the two (2) dots refer to the Root Directory.
This exercise should help explain things
I'm going to begin with a page I created for this lesson. It has
a simple nav bar on it.
I'm going to begin by selecting the "Tutorial" button.
We want to link the button "Tutorial" to the html page,
Next, I'll go up to the Properties
Inspector and click on the folder next to the Link option. The
folder is also referred to as the Browse For File button.
And here I'll select "Tutorials.html" and click OK.
Now, in the Properties
Inspector I'll verify that this link is correct. It is and it's
an example of a "Relative Link".
Now, let's pretend this page is really a banner I've had placed
on someone else's site. I would need to have this banner link to
my site and to the specific file.
Let's go back to the "Tutorial" button and select it again.
Remember, the link is currently pointing to "tutorials.html"
on my local site. Well, if this is now placed on someone else's
site, I'm going to need to make this link an absolute link.
This means that no matter where this banner
ends up, the link will always link to my site correctly.
So, going back to the Properties
Inspector again and in the Link area, I'm going to type in the
absolute URL: http://www.cbtcafe.com/tutorials.html.
Check out the Properties Inspector. You won't be able to see the
entire absolute address but you can see the "http://www..."
part and that is what we're concerned with here. Because the http://www...
is there, it is telling the browser to look on the web for the file,
not the local site.
Flash®, Fireworks™, and Dreamweaver® are registered trademarks
of Macromedia, Inc. in the United States and/or other countries
Photoshop®, Photoshop Elements® and Illustrator® are registered
trademarks of Adobe Systems, Inc.
QuickTime® is a registered trademark of Apple Computer, Inc.
Ebay® is a registered trademark