logo logo

How to connect Two HTML pages (Establishing Document Relationships)

Normally, the browser fills in the blanks of a relative URL by drawing the missing pieces from the URL of the current document. You can change that with the <base> tag.

The <base> tag must appear only in the document header, not its body contents. The browser thereafter uses the specified base URL, not the current document’s URL, to resolve all relative URLs, including those found in <a>, <img>, <link>, and <form> tags. It also defines the URL that will be used to resolve queries in searchable documents containing the <isindex> tag.

The href attribute

The href attribute must have a valid URL as its value, which the browser then uses to define the absolute URL against which relative URLs are based within the document. For example, the <base> tag in this document head,

<html>
<head>
<base href="http://www.kumquat.com/">
</head>
...

tells the browser that any relative URLs within this document are relative to the top-level document directory on www.kumquat.com, regardless of the address and directory of the machine from which the user had retrieved the current document.

Contrary to what you may expect, you can make the base URL relative, not absolute. The browser actually forms an absolute base URL out of this relative URL by filling in the missing pieces with the URL of the document itself. This property can be used to good advantage. For instance, in this next example,

<html>
<head>
<base href="/info/">
</head>
...

the browser will make the <base> URL into one that is relative to the server’s /info/ directory, which probably is not the same directory of the current document. Imagine if you had to re-address every link in your document with that common directory. Not only does the <base> tag help you shorten those URLs in your document that have a common root, it also lets you constrain the directory from which relative references are retrieved without binding the document to a specific server.

The target attribute

When working with documents inside frames, the target attribute with the <a> tag ensures that a referenced URL gets loaded into the correct frame. Similarly, the target attribute for the <base> tag lets you establish the default name of one of the frames or windows in which the browser is to display redirected hyperlinked documents.

If you have no other default target for your hyperlinks within your frames, you may want to consider using <base target=_top>. This will ensure that links that are not specifically targeted to a frame or window will thereby load in the top-level browser window. This eliminates the embarrassing and common error of having references to pages on other sites appear within a frame on your pages, instead of within their own pages. A minor bit of HTML, to be sure, but it makes life much easier for your readership.

Using <base>

The most important reason for using <base> is to ensure that any relative URLs within the document will resolve into a correct document address, even if the document itself is moved or renamed. This is particularly important when creating a document collection. By placing the correct <base> tag in each document, you can move the entire collection between directories and even servers without breaking all of the links within the documents.

You also need to use the <base> tag for a searchable document (<isindex>) if you want user queries posed to a URL different from the host document.

Note that a document that contains both the <isindex> tag and other relative URLs may have problems if the relative URLs are not relative to the desired index processing URL. Since this is usually the case, do not use relative URLs in searchable documents that use the <base> tag to specify the query URL for the document.

The <link> Header Element

Use the <link> tag to define the relationship between the current document and another in a Web collection.

The <link> tags belongs in the <head> content, nowhere else. The attributes of the <link> tag are used like those of the <a> tag, but their effects serve only to document the relationship between documents. The <link> tag has no content and no closing </link> element.

The href attribute

As with its other tag applications, the href attribute specifies the URL of the target <link> tag. It is a required attribute, too, and its value is any valid document URL. The specified document is assumed to have a relationship to the current document.

The rel and rev attributes

The rel and rev attributes express the relationship between the source and target documents. The rel attribute specifies the relationship from the source document to the target; the rev attribute specifies the relationship from the target document to the source document. Both attributes can be included in a single <link> tag.

The value of either attribute is a space-separated list of relationships. The actual relationship names are not specified by the HTML standard, although some have come into common usage as listed in 7.3.1.5. For example, a document that is part of a sequence of documents might use:

<link href="part-14.html" rel=next rev=prev>

when referencing the next document in the series. The relationship from the source to the target is that of moving to the next document; the reverse relationship is that of moving to the previous document.

The title attribute

The title attribute lets you specify the title of the document to which you are linking. This attribute is useful when referencing a resource that does not have a title, such as an image or a non-HTML document. In this case, the browser might use the <link> title when displaying the referenced document. For example,

<link href="pics/kumquat.gif"
  title="A photograph of the Noble Fruit">

tells the browser to use the indicated title when displaying the referenced image.

The value of the attribute is an arbitrary character string, enclosed in quotation marks.

The type attribute

The type attribute provides the MIME content type of the linked document. Supported by both Internet Explorer and Netscape, the type attribute can be used with any linked document. It is often used to define the type of linked style sheets. In this context, the value of the type attribute is usually text/css. For example,

<link href="styles/classic.css" rel=stylesheet type="text/css">

bottom

No Comments »

No comments yet.

RSS feed for comments on this post. TrackBack URL

Leave a comment

bottom