Relative URLs

URLs, as I mentioned earlier, are used to locate anything, anywhere. Since their scope is so large, they often get very long. It is often the case that we can abbreviate URLs in the form of relative URLs.

All the URLs we've looked at until now were absolute URLs. They identified a resource independent of their context. The URL https://WebReference.com/html/ identifies HTML with Style whether it's typed into your browser, scribbled on a napkin in a bar for a friend or just remembered in your head. Relative URLs are a way to identify a resource relative to their context.

To give a rough analogy, if you're in your house with some friends and someone asks where your next-door neighbor Mark lives, you'll probably say "Oh, he's next door." You probably wouldn't say "On a planet called Earth, in the United Stated of America, in Acmetown, on 32 Foobar St." if this conversation is taking place in the living room of 31 Foobar St. For one thing, it's a waste of breath.

Relative URLs are something like that; they're the equivalent of saying "down the road, turn left, walk on for a few blocks, you can't miss it." They only make sense if they are given within a certain context. And this context is called a Base URL.

As we mentioned earlier, relative URLs can only be used with generic URLs like the ones described by the http scheme. The reason for this is that all generic URLs, like those defined by the http scheme, have a pathname. The Base URL of a resource is everything up to and including the last slash in its pathname. Here are some examples:

Now, say that in the document https://WebReference.com/html/about.html, I want to refer to the document https://WebReference.com/html/links.html. What I would do is use the relative URL links.html. This will be added to the base URL to form the URL that I want to match.

In most cases, figuring the absolute URL from a relative URL is just a matter of concatenating the base URL and the relative URL, as in the example above. There are, however, a few special cases:

A directory called .. (two periods) in a relative URL indicates the parent directory, essentially stripping off everything up to the previous slash in the the Base URI. Note that this only has meaning inside the pathname, so you cannot use this notation to go up higher than the root directory.

A directory called . (one period) refers to the current directory.

A relative URL that begins with / (a slash) always replaces the entire pathname of the base URL.

A relative URL that begins with // (two slashes) always replaces everything from the hostname onwards.

These notations are best illustrated by example, in the following table. The table shows relative URLs which are all assumed to have the base URL https://WebReference.com/html/, and the absolute URLs that they translate into:

Also note that a relative URL that is empty (consisting of no characters) points to the resource in which it exists.

Previously, I mentioned that relative URLs save time typing. Indeed they do, but that is not the reason for their use. There are other ways to save time if you're that lazy, such as editors with shortcut features. But relative URLs are much more important than that: they point to a resource relative to their context. This is very important, because URIs may not always be used in the same context. But we'll explain that later on after we've explained hyperlinks.

But before we do that, we'll take a look at a few other commonly used URL schemes.

Produced by Stephanos Piperoglou

All Rights Reserved. Legal Notices.

URL: https://www.webreference.com/html/tutorial2/3.html
Created: June 11, 1998
Revised: June 11, 1998