Description

If all links (a element) or form submissions (action) are going to the same location, it may be preferable to define the base URL so as not to repeat yourself unnecessarily. As an example, this is the kind of saving that you could have:

I've published my
<a href="http://lloydi.com/travel-writing/">holiday diaries</a>,
including the
<a href="http://lloydi.com/travel-writing/prague/2006/day2.html">
crazy bone church at Kutna Hora</a>, and our recent trip to
<a href="http://lloydi.com/travel-writing/portugal/algarve/day1.html">
Portugal</a>

Given that all the links are in the directory "travel-writing" on the domain "lloydi.com", the base href can be used to reduce the markup as follows:

<base href="http://lloydi.com/travel-writing/" />
…
I've published my
<a href="./">holiday diaries</a>,
including the
<a href="./prague/2006/day2.html">
crazy bone church at Kutna Hora</a>, and our recent trip to
<a href="./portugal/algarve/day1.html">
Portugal</a>

Note the syntax in the a element "href" values begins with "./".

There is a flaw with using the base element for this purpose though. Consider this scenario - you set a base href to be a domain root:

<base href="http://example.org/">

Then, in the document you have a link to a fragment identifier foo, a section within the same page that you’d like the user to be able to jump to.

<a href="#foo">Foo</a> links to foo
…
<h1 id="foo">Foo</h1> here is the desired destination

The problem is that the browser will not jump to that section on the page but will instead load the URL http://example.org/#foo.

So while it may have its uses, you must be careful to avoid a situation like this - using a base href value may be somewhat akin to using a sledge hammer to knock in a nail.