You may have heard talk of META tags on the Web, most likely in connection with search engines. This is because one of the common uses of META tags is to give search engines additional information about your web page when they index it. In fact there are over 200 different types of "meta-information" that you can place in your web page with the aid of the META tag.
What does a META tag look like?
META tags go inside the <HEAD></HEAD> section of your Web page, and take the following format:
Either: <META NAME="name" CONTENT="content">
Or: <META HTTP-EQUIV="name" CONTENT="content">
So, which should you use? Well, it depends on what type of META tag you're using. The reason is a little boring, but basically HTTP-EQUIV is designed for META tags that emulate the equivalent HTTP header (e.g. "refresh" and "pragma"), whereas NAME is for all the rest (e.g. "author" and "description"). A rule of thumb is as follows: If the meta-information is designed to be interpreted by a web server or proxy, use HTTP-EQUIV; if it's designed for a page editor or search engine, use NAME.
Don't worry about this too much, as most tutorials on META tags (including this one) tell you which format to use!
Show me an example!
All righty. This snippet of HTML is from an imaginary page about dog-training. and shows how you can use the description and keywords META tags to improve your ranking with the search engines:
<head>
<title>Marcia's Dog Training Page</title>
<meta name="description" content="This web page
contains information on dog training, including modern
training techniques, training news, info on training
centres and links to other dog-training sites.">
<meta name="keywords" content="Dog,
training, puppy, techniques, centres, links, leash,
teaching, commands, sit, stay, fetch, beg">
</head>
Notice that we used two META tags here, both within the <head></head> section of our web page. The description tag is often used by search engines such as AltaVista and Hotbot to display a short summary of your web page in their search results pages. The keywords are used to index your page, so that when people type in the word "fetch" into their favourite search engine, your page will be one of the pages returned.
Show me more!
OK, you get the basic idea. Here are some more really useful META tags that you can use to improve your website.
Example #1 - Author
META NAME="author" CONTENT="author's name"
This lets you tell search engines and browsers that you wrote this page!
Example: <meta name="author" content="Marcia Westley">
Example #2 - Refresh
META HTTP-EQUIV="refresh" CONTENT="delay;url=new url"
This tag is brilliant if you move your web page to a different directory or server, or have to rename it for some reason. You can use this tag to redirect the browser to to the new page! delay is the delay in seconds to wait before refreshing. url is the URL of the page to jump to (it can be the same page, in which case the same page will continually refresh.) If you specify a delay of zero, then the browser will jump immediately to the new page.
Example: <meta http-equiv="refresh"
content="0;url=newpage.html">
Example #3 - Robots
META HTTP-EQUIV="robots" CONTENT="noindex / nofollow"
This is another one for the search engines (also known as robots!). You can use this tag to tell search engines whether they should add your page to the index or not, and whether they should follow links from your page to look for other pages to index.
Normally the search engines will index your page if they find it, and follow all the links on the page to look for other stuff to index. The following example will tell robots not to add your page to the index (they can still follow links on your page):
Example: <meta http-equiv="robots" content="noindex">
(Note that you can also add a file called ROBOTS.TXT to your home directory, to tell search engines which page to index and which to ignore. This is the preferred method; however the above method lets you specify index requirements for each page individually.)
Example #4 - Caching
META HTTP-EQUIV="pragma" CONTENT="nocache"
This tag tells browsers such as Netscape Navigator and Microsoft Internet Explorer not to store a copy of your page in the cache on your hard drive. The cache is normally used to store recent pages that you have visited, so that the browser doesn't have to go off to the server to download commonly-visited pages all the time. However, if you are updating the page frequently and want users to see the newest version at all times, then use this META tag.
Example: <meta http-equiv="pragma" content="nocache">
Example #5 - Expiry Date
META HTTP-EQUIV="expires" CONTENT="date"
This tag is similar to the pragma tag above, except that with this one you can tell the browser when to consider the page out-of-date (in other words, when it should retrieve a new copy from the server). For example, if you update a page every month, you would want to set the page to expire a month after you first posted it.
Example: <meta http-equiv="expires"
content="Sun, 4 Oct 1998 15:00:00 GMT">
Phew! OK, that's enough...
That should be enough to keep you busy for now! These are the more common meta tags, but there are hundreds more. Don't be daunted though - you'll probably never use more than ten of them, and you've just learned the most useful ones