Tuesday 21 February 2012

HTML Meta tags - Keyword - Refresh - Redirect

Meta tags are generally used to include information about a document such as author name, creation date, copyright information etc. They always placed between the <HEAD> tags of an HTML document.
Each Meta tag has two important attributes:
  • HTTP-EQUIV or NAME
  • CONTENT
<META HTTP-EQUIV="some_name" CONTENT="some_content">

OR

<META NAME="some_name" CONTENT="some_content">

<META HTTP-EQUIV>

The HTTP-EQUIV attribute takes one of the values mentioned below:
  • CONTENT-TYPE: The most commonly used content type is text/html. Other types can be employed to include the character set for the document. This helps the browser to load the appropriate character before document display.
  • EXPIRES: Specifies the date and time after which a document should be considered expired. This can be used by web robots update content in a search engine.
  • CACHE-CONTROL: Determines the caching of the document.
  • CONTENT-LANGUAGE: Used to specify the language in which the document is written.
  • REFRESH: This value is commonly used to either redirect users to a different page or refresh the contents of the present page.
<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html">
<META HTTP-EQUIV="EXPIRES" CONTENT="May 1, 2002 00:00:00 EST">
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="no-cache">
<META HTTP-EQUIV="CONTENT-LANGUAGE" CONTENT="hi">
<META HTTP-EQUIV="REFRESH" CONTENT="5">
Note that all the META tags with HTTP-EQUIV attributes also contain the CONTENT attribute.
The HTTP-EQUIV="REFRESH" demands more attention here, so let us have a detailed look at it.
The tag above simply refreshes the contents of the page in 5 seconds. However, you can supply a URL to this tag, which redirects users to that page.
<META HTTP-EQUIV="REFRESH" CONTENT="2; URL=new.html">
This takes the user to new.html after 2 seconds.
Note that there is only one set of quotes that encloses the content of CONTENT. Both the time in seconds and the URL are inside the same quotes.
A cheap trick is to construct a looping (or non-looping) slide show making use of these tags. Let's say you have three html pages named slide1.html,slide2.html and slide3.html. You can make a looping slide show by including the appropriate META tag in each document.
slide1.html contains
<META HTTP-EQUIV="REFRESH" CONTENT="10; URL=slide2.html">

slide2.html contains
<META HTTP-EQUIV="REFRESH" CONTENT="10; URL=slide3.html">

slide3.html contains
<META HTTP-EQUIV="REFRESH" CONTENT="10; URL=slide1.html">
To start the slide-show, load slide1.html in the browser. After 10 seconds,slide1.html is replaced by slide2.html, which is again replaced by slide3.htmlafter 10 seconds. Finally, after another 10 seconds, slide1.html replacesslide3.html and thus, the slide-show keeps on looping. Note that the <META> tag is placed in the head section of each document.

<META NAME>

Though there are some fixed values for the NAME attribute, you can construct your own meta tags with it. Let's look at the important values
  • KEYWORDS: You can supply keywords for your pages using this. It helps in indexing by search engines. Takes a list of comma separated keywords.
  • COPYRIGHT: Contains copyright information
  • DESCRIPTION: lets you specify a description of the page.
  • AUTHOR: You can write your name here.
  • ROBOTS: This tag is used to stop your pages from being indexed by robots. Its an alternative to the robots.txt file.
<META NAME="KEYWORDS" CONTENT="movies, hollywood, actors">
<META NAME="COPYRIGHT" CONTENT="2001, Some_Company_Name">
<META NAME="DESCRIPTION" CONTENT="Information on the greatest 
movies ever">
<META NAME="AUTHOR" CONTENT="your_name">
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">

0 comments:

Post a Comment