Home :: Learning HTML :: Links :: URLs
There are two kinds of Uniform Resource Locators:
Absolute URLs are a resource's complete "address." Relative URLs describe a resource's address relative to the current document, and are used when two documents are on the same server.
An absolute URL, in general, consists of these three parts:
Here are some examples:
The document you're reading right now is at
http://www.madison.k12.wi.us/webpub/basics41.htm
http, or HyperText Transfer Protocol (the rules used to
transfer documents on the Web).
www.madison.k12.wi.us -- this is the name of the
District's server.
/webpub/basics41.htm -- for
our purposes, the path is basically the same as the folder(s) the file is in,
plus the file name.
Yahoo is at http://www.yahoo.com
http. This will usually be the protocol for
your absolute URLs.
www.yahoo.com
www.madison.k12.wi.us),
default pages are given the name index.htm. So, when you go to
http://www.madison.k12.wi.us, the document you're getting is really at
http://www.madison.k12.wi.us/index.htm
You can also link to files on FTP sites. For example, we have a program for making
image maps for Windows computers at
ftp://ftp.madison.k12.wi.us/pub/mpths110.zip
ftp, or File Transfer Protocol, which is used to
transfer files between computers.
ftp.madison.k12.wi.us. MIS has a special place
just for transferring files, so it has its own name.
/pub/mpths110.zip which means that the file, called "mpths110.zip", is in
the public directory, called "pub".
Unless you're familiar with working in a Unix or DOS environment, relative URLs can be a bit tricky. In order to understand them, we're going to have to do a little imagining.
A key point to understanding relative URLs is that resources (HTML files and/or
graphic files) in the same directory (folder) as the document you're working on
are referred to just by their name. So if you're working on "index.htm" and you
want to link to a file you've made called "life.htm", and it's in the same directory,
the relative URL is life.htm. That's pretty easy, eh?
The tricky parts come in when you'd like to link to other files on the same server, but in different directories. Here's an example "file tree" (listing of directories and files) -- directories are underlined, their files and sub-directories are listed under them.
/ (server's root directory)
| index.htm |
| |
east images
| index.htm blueball.gif
| calendar.htm
_______|_______
| |
social images
index.htm redball.gif
Notice how each directory can have a default file ("index.htm"). This is the "home page" of each directory. So, the address to the home page of the "east" directory could either be "http://www.madison.k12.wi.us/east/index.htm" or "http://www.madison.k12.wi.us/east/" - both would get you to the same document.
The root directory is where all other directories and their files "sprout" from,
hence "root." So, the District's home page is represented by the file called
"index.htm" at the top of the example. Let's imagine you're working on the home page
of the "east" directory -- /east/index.htm. If you wanted to link to the file
"calendar.htm", its relative URL would be calendar.htm. If you wanted
to use the graphic "redball.gif" on "index.htm", its relative URL would be
images/redball.gif.
Now let's say you were working on the home page of
the "social" directory -- /east/social/index.htm. If you wanted to link back up
the tree to "calendar.htm", the relative URL would be ../calendar.htm.
../ means "up one directory." If you wanted to use "redball.gif" on this
page, the relative URL would be ../images/redball.gif -- this basically means
"move up one directory, then go into the 'images' directory, then find the file called
'redball.gif'." You could also use the absolute URL, which would be
http://www.madison.k12.wi.us/east/images/redball.gif. Finally, if you
wanted a link from the home page of "social" to the district's home page, the relative
URL would be ../../ (which is the same as ../../index.htm).
What would the relative URL of "blueball.gif" be, if you were working on the home page of "social"? From "calendar.htm"?
Home:: Learning HTML :: Links :: URLs
Home |
Policies |
HTML |
FAQ
Publishing |
Booklet |
Tools |
Links