::: The HTML Survival Kit - META tags; Document Indexing Controls :::

Core META tags for Document Indexing

In addition to TITLE tag, META tags inserted within <HEAD> and </HEAD> container are designed to embed document-specific meta-information. Such information may be accessed/extracted by servers/browsers for an indexing purpose, and can be used to control how your webpages are handled by the browser.

A <META> tag does not require an anchor, i.e., you don't have to worry about a container block for this one.

Bottomeline is that if you want your HTML pages indexed and keyword searchable by popular search engines, i.e., yahoo, google, altavista, etc., you do need to add following critical META tags in your HTML pages. (of course, presuming that you already submitted your pages to search engines for initial indexing)

Else, basically you're playing all by yourself and will start wondering why all these peoples in the net don't come to your fabulous site. :-)

	<META NAME="resource-type" CONTENT="document"> <META NAME="description" CONTENT="sentence"> <META NAME="keywords" CONTENT="keywords"> <META NAME="distribution" CONTENT="global">

At the moment, the only resource type that can be embedded in a document is "document", so you won't need to change this. This is the only absolutely necessary tag. If you omit the other META tags, the index will list only the title portion of your document (that is, if you have a <TITLE> and </TITLE> container defined in your document -- thus don't forgetting to put a TITLE tag is critical)

A sentence describing your document. This will be displayed along with the title of your document in the index listing. It should be concise and clear yet give a very good idea of the content/context of the document.

If you do have an obscure, meaningless and clueless 'description' META tag, your web page is as good as non-existent. Nobody would be able to figure out what your page is all about. Worse, nobody would bother to access yours.

Length of 'description' META tag can be varied from one line to several lines. Use specific description for your page that would distinguish itself from others.

Words logically related to the content of the document (think what you would enter into a keyword search to locate this document). I'd say that this "keywords" tag is most widely used META tag -- both for indexing and CGI (COmmon Gateway Interface) functions.

Length of 'keywords' META tag can be varied from one word to several words connected by a comma.

'global' is a normal indexing directive. Use 'local' for constraining only to local indexing (by an intranet indexing engine). I.e., you do not want the document to be indexed by popular internet search engines.

Put it all together

Optional META tags for Document Indexing

As the name implies, optional META tags are not required by standard indexing engines. However, they are very useful to convey additional information, and if present, all optional tag information will be indexed.

Optional META tags are also heavily used for website management - revision, categorization, version control, and documentation.

	<META NAME="author" CONTENT="creator of the page"> <META NAME="reply-to" CONTENT="contact e-mail info"> <META NAME="address" CONTENT="contact address info"> <META NAME="copyright" CONTENT="copyright disclaimer"> <META NAME="date" CONTENT="last modification date"> <META NAME="expires" CONTENT="page expiration date"> <META NAME="robots" CONTENT="Index, Follow">

Too apparent to explain. See example below.

Too apparent to explain. Be careful not to surround your e-mail address with "<" and ">". See example below.

Too apparent to explain. See example below.

Too apparent to explain. See example below.

Creation/Modification time stamp. This tag is your "PostIt!" self-reminder for updating/revision cycle. You may also use the physical 'Last modified' file timestamp for updating/revision cycle, however a file modified timestamp does not always implies a modification of webpage content

The format is:

YYYY-MM-DDThh:mm:ssTZD

where

YYYY	= four-digit year
MM	= two-digit month (01=January, etc.)
DD	= two-digit day of month (01 through 31)
hh	= two digits of hour (00 through 23) (am/pm NOT allowed)
mm	= two digits of minute (00 through 59)
ss	= two digits of second (00 through 59)
TZD	= time zone designator

See example below.

Page expiration time stamp. The format is the same as in date META tag. You can use this tag to force the browser to reload/refresh with the latest page (instead of loading old page from disk cache) after a designated expiration date. See example below.

There are standard search engine agents called robots (also known as crawlers, spiders and other cute names) that wander around the web looking for updated and/or new interesting resources. Most robots are sent to your site by search engines, and used to generate a web index of your site which is then sent back to search engines to help locate information in your website.

When the first robots were developed, they had a bad reputation for sending hundreds/thousands of requests to each site, often resulting in the site being overloaded. Things have improved dramatically since then, but even so, you can set a permission for them to start/stop crawling and indexing your pages.

Permission to Robot can be set using this 'robots' META tag. See example below.

Put it all together

Auto-Load/Forward META Tag

Here, you may wonder where the 'HTTP-EQUIV' tag pops up from suddenly -- 'HTTP-EQUIV' tag is equivalent to HTTP headers. Most web servers actually generate HTTP headers from the HTML tags including 'HTTP-EQUIV' tag. Thus, if you'd like to invoke an action such as refresh, effect, transition, etc. on the page, you need to use this 'HTTP-EQUIV' tag.

'Refresh' META tag is ideal to trigger a specific action -- forward the user to different URI, play an audio, etc. -- as soon as the current page is loaded into the browser.

There are two required parameters for 'Refresh' META tag. The first parameter, TimeLapse specifies a delay value in seconds. After the page has completely loaded in the browser, the page will wait TimeLapse seconds before triggering an action specified in the second parameter, URI. Great for redirecting users when your site has been moved.

For example, as shown below, as soon as current page is completely loaded in the browser, the page will wait 3 seconds (to display "Sorry, the website had moved to a new location, please go to xyz" announcement), then immediately load a new page from http://cee.odu.edu as specified in the second parameter (auto-forwarding).

A silly trick is to specify an audio file in URI and a TimeLapse of 0. This will cause the browser to play the specified audio file, while allowing the user to continue reading your page with an audio playing background. (and often causing a heck of aggravation!)

However keep in mind that each individual "Refresh" directive is one-shot action and non-repeating. If you need to repeat an action, you may consider using a simple JavaScript.

Prevent-Frame META Tag

Yes, that is a underscore (_), not a typo.

When someone links and squeezes your page into one of his/her frame, your page will be crammed into the frame instead of being displayed in entire browser screen. The best way to resolve this, and ensure a full browser screen display is to add a 'Window-target' META tag as precaution.

(See more on FRAME tags)

No-Cache META Tag

Time to time, you absolutely want the user to load the latest pages for critical updates, you can take two different approaches.

First approach is, as you may guess, explicitly stating in the page that '... has been updated MMDDYY...' and hope that user's browser is configured to load updated pages each time. However, this is not necessarily true most of time due to browsers' default memory- and disk-cache setting/preference.

Second approach is that you can force your pages not to be cached by user's browser, to both memory- and disk-caches. As a result, there will be no 'old' cache of your pages residing in user's computer, your pages have to be loaded freshly next time. (and as a result, it may take a little longer to load)

You can achieve this forced 'no-cache' by adding above two META tags.

From the client side, you can also achieve it by setting memory and disk cache size to ZERO in your browser's setting/preference.

Transition-Effect META Tag

You can implement some interesting transition effect when the user enters and leaves a page by using 'Page-Enter' and 'Page-Exit' META tags.

If you remember, when you open this webpage, there was a special effect. (guess not, if you've been reading up to here in this page...)

'Duration' element controls the length of transition effect, and it is expressed in seconds. In my opinion, any duration longer than 2 seconds will definitely drive the user nuts unless it is your intention that the page will be accessed only once per user for the eternity. (huh!)

Transition effects are excellent tools if used strategically and sparsely -- to make the point a crossed. However, please remember that special effects are like makeup -- too much would make you look cheap -- moderation is the key here.

Following is a full reference for what transition numbers equal which transition effects. Keep in mind that this transition effect META tag will *NOT* work with neither Netscape browser nor with frames.

Transition No.	Description
0	Box in
1	Box out
2	Circle in
3	Circle out
4	Wipe up
5	Wipe down
6	Wipe right
7	Wipe left
8	Vertical blinds
9	Horizontal blinds
10	Checkerboard across
11	Checkerboard down
12	Random dissolve
13	Split vertical in
14	Split vertical out
15	Split horizontal in
16	Split horizontal out
17	Strips left down
18	Strips left up
19	Strips right down
20	Strips right up
21	Random bars horizontal
22	Random bars vertical
23	Random

Jump back to HTML Survival Kit Table of Contents (TOC)