Head Elements Without the Headache | WebReference

Head Elements Without the Headache

Front Page12345

Head Elements Without the Headache

The elements that go into the document head are few and easy to understand, mostly. Let's start with what we know: the TITLE element.

NameTITLE
UsageThe document's unique title.
ContextMust be contained inside a HEAD element.
ContentsMay contain only text.
Start-tagRequired
End-tagRequired
language attributes

Every document must have a title element in its head. The title should be as unique as possible, as I have mentioned before. It is incorrect to have more than one TITLE element.

In the previous tutorial we examined the LINK element, used to define document-wide hyperlinks.

NameLINK
UsageDocument relations with other resources
ContextMust be contained inside a HEAD element.
ContentsThis is an empty element
Start-tagRequired
End-tagForbidden
Attributes:
element identifiers
element title
style directives
event handlers
language attributes
frame target
HREFURIURI of linked resource
RELLink TypeForward relation of linked resource with document
REVLink TypeReverse relation of linked resource with document
MEDIAMediaMedia for which the resource applies
HREFLANGLanguage CodeLanguage of linked resource
TYPEContent TypeAdvisory content type of linked resource

In the previous tutorial I introduced the idea of a base URL. Normally, the base URL of a document is figured out from the location of the document itself, but some times we might want to fix the base URL of a document so that it is the same no matter where it is found. This is done using the BASE element. There can only be one BASE element in a document.

NameBASE
UsageDefines base URI or frame target for the document
ContextMust be contained inside a HEAD element.
ContentsThis is an empty element
Start-tagRequired
End-tagForbidden
Attributes:
frame target
HREFURIBase URI for document

The HREF attribute defines the base URI for the document, overriding the base URI as figured from the document's location. For instance, imagine that the document at http://www.acme.com/OTP/chapter2.html contains the following:

...
<BASE HREF="http://www.acme.com/">
...
look at Acme's <A HREF="products.html">product catalog</A>
...

The relative URL in the anchor element (<products.html>) will be resolved to an absolute URL based on the base URL given in the BASE element, resulting in <http://www.acme.com/products.html>. If the BASE element was missing, the URL would resolve to <http://www.acme.com/OTP/products.html> instead.

Lastly, the HEAD element may contain any number of META elements. The META element is used to supply meta-information for the document. Meta-information is information describing the document in some way. There are many uses for meta-information. Meta-information can include the document's author, some type of certification (such as the document's suitability for different age groups), the dates of creation, modification and expiry of the document, and so on.

NameMETA
UsageMeta- information about the document
ContextMust be contained inside a HEAD element.
ContentsThis is an empty element
Start-tagRequired
End-tagForbidden
Attributes:
language attributes
NAMENameMetadata property name
CONTENTCDATAMetadata property value
SCHEMECDATAMetadata interpretation scheme
HTTP-EQUIVNAMEHTTP header name

Meta-information is supplied as properties in the form of pairs of names and values. For instance, when specifying the author of this document, the property name would be "Author" and the value "Stephanos Piperoglou". The META element has appropriately named NAME and CONTENT attributes.

You can also use the HTTP-EQUIV attribute to include HTTP headers in your document. HTTP, as we mentioned in the previous tutorial, is the protocol most frequently used to transfer HTML documents over the Internet. HTTP headers are sent along with the document and supply information about it to the user agent. By using HTTP-EQUIV instead of NAME in a META element you can specify the value of certain HTTP headers for that document. The interpretation of this depends entirely on your HTTP server, though some user agents also handle some HTTP-EQUIV attributes themselves.

I will not go into the details of meta-information in this tutorial, since it is a large topic and deserves separate mention. However, I should mention that the two most useful properties you can supply are "Description" and "Keywords". The description should be a concise but short description of the document. The keywords are words that are related to the document and will help search engines index your document correctly. Be careful not to introduce too many keywords because search engines penalize such abuse by not turning up documents in searches. Here is an example of the META element in action:

<META
 NAME="Description"
 CONTENT="The entry point into Acme Computer Corporation's 
Web Site, containing information about the company and 
its products"
>
<META
 NAME="Keywords"
 CONTENT="Acme Computer Corporation Products Object 
Transfirbulation Protocol MORONS EDP"
>
<META
 HTTP-EQUIV="Expires"
 CONTENT="Mon, 29 Jun 1998 18:30:00 GMT"
>

The above fragment gives a description of the document, some relevant keywords and also sets the "Expires" HTTP header. Note that the META and LINK elements have similar functions, but are very different in that LINK defines hyperlinks to other resources related to the document. Take the following two elements, for instance:

<LINK REL="Author" HREF="arnold@acme.com">
<META NAME="Author" CONTENT="Dr. Arnold D. Propellerhead">

The first defines a link to the author's e-mail address. The second gives the author's name. Both are useful in different respects.

These are the most commonly used head elements. Although most of them have little impact on the presentation of your document, they are very important as they aid indexing and navigation through documents. In the future we'll look deeper into meta-information and how it can be used to make your documents easier to find. In the meantime, why don't we take a look at some block elements?

Front Page12345

http://www.internet.com

Produced by Stephanos Piperoglou

All Rights Reserved. Legal Notices.

URL: http://www.webreference.com/html/tutorial3/2.html
Created: June 25, 1998
Revised: June 25, 1998