META Tags Tutorial

Introduction to using META tags in web pages

META tags are HTML tags which provide information that describes the content of the web page a user will be viewing. Some search engines use META tag information when indexing sites, however listings on sites like Google are mostly based on page content and links to and from your site.

The Description and Keywords META tags are the most important meta tags to have in your pages.

Where to put META tags

Meta tags should go in the head area of the HTML page, after the title tag.

Example:
<html>
<head>
<title>web page title here</title>
<meta name="description" content="put your description here" />
<meta name="keywords" content="put your keywords and key phrases here" />
</head>
<body>
page content goes here
</body>
</html>

 

HTML and XHTML changes to META tags.

If you are designing your web pages using XHTML rather than HTML then all META tags now need a closing tag at the end.
All tags also need to be lower case.

e.g. <meta name="description" content="Your description here" />

The space followed by /> closes the meta tag.

This is a shortened version of the following code:
<meta name="description" content="your description here"></meta>

On older web pages - those built to HTML 4 and older standards - you may come across unclosed META tags and upper case tags.

e.g. <META name="Description" content="Your description here">

There should be a doctype statement at the top of your page code which tells the browser (and also you) which specification the web page is built to.

All the code on this page is compatible with XHTML pages as this is the specification that most professional web designers are now working to.

 

Description META tag - important

The description META tag is a general description of what is contained in your webpage. Search engines that support META tags may display the description META tag along with your title in their search results.

Description tag usage example:

<meta name="description" content="Your description here" />

Length - up to 200 characters or around 20 words.

Try to use important words and phrases from your keywords and title tags at the start of your description tag. The description tag - along with keywords tag - is the most important META tag in your document and should always be used.

 

Keywords META tag - important

The Keywords META Tag is a list of keywords that relate to the content of your web page.

Keywords tag usage example:

<meta name="keywords" content="keyword1, keyword2, keyword3" />

Length - up to 80 characters (less for some search engines & directories). Words or short phrases should be separated by commas or spaces.

Using less keywords will give each keyword a stronger influence. You should always put the most important keyword at the start of the list.
Keywords should also appear in the description tag, the title tag and in the page content.

 

Revisit META tag - optional

The Revisit META Tag tells search engines how often they should revisit your webpage for the purpose of re-indexing.

Revisit META tag usage example:

<meta name="revisit-after" content="X days" />

Note: X indicates a number of days until the page should be re-visited.

 

Robots META tag - optional

The Robots META tag tells search engines if they should index and/or follow the links on this page.

Robots META tag usage example:

<meta name="robots" content="index, follow" />

The code above tells the search engines to index the page and follow its links.

Possible attributes: noindex | index | nofollow | follow

An alternative method is to use a robots.txt file on your site.

 

Refresh META Tag - not recommended

The Refresh META tag is a way to redirect users to another webpage after X number of seconds.

Many search engines dislike this tag and will not follow links or index pages, so it is probably best to avoid using this on pages which you want indexed by search engines.

Refresh META tag usage example:

<meta http-equiv="refresh" content="X;url=http://www.website.com/index.html" />

Note: X indicates delay in seconds before moving to the specified URL.

 

See the SEO page for more information on Search engine optimisation and META tags.