Recommended HTML meta tags
Meta tags may not be the most sexy or exciting topic around, but it's still quite important as far as Web development is concerned. It can be hard for novices to understand the use of meta tags, and it is my impression that many new Web developers and designers are unsure about the use of meta tags at least once during their career. At least I was.
That is why I in this short article I will try to give an explanation of which meta elements you should try include on your HTML/XHTML page, why you should include them, as well as which tags you can safely ignore. The markup code will as always be written to be XHTML 1.1 compliant, but this should not hinder you from using it on your HTML page.
Please note that this article is to a large degree based upon the article Meta Tags Explained over at Webmarketingnow, and you should also use it as a reference. All I have done is refining the information to what I think is important, as well as making the code valid XHTML. Also note that this article reflects my own opinions and experience, and so not everyone might agree on my choices.
Down to business, which meta tags should I use
Adding meta tags is no big deal, so we'll just dive straight into it. Below is an explanation of each tag you should try to include on your page, as well the relevant XHTML markup code for using the tag. Where the tag may be omited I will make a note. You should also read about the meta http-equiv attribute if you are unsure about what this does.
For reference and example, the end of this article includes a complete example of a XHTML template that uses the recommended meta tags. I also recommend you read about Search Engine Optimization, as some meta tags may help increase your ranking. That beeing told, meta tags are at best a small help when it comes to increase your ranking, but you should NEVER rely exclusively on them.
meta tag : http-equiv - content-type
<meta http-equiv="content-type" content="application/xhtml+xml;charset=utf-8" />
If there is one tag you should use, this is the one. What this meta tag does is telling the browser the encoding of your page, as well as what content type your page should be served as (HTML or XHTML). If you are using HTML, use "text/html" instead of "application/xhtml+xml". You can read more about conent types and character encodings over at W3.org if you want to know why this is important.
If you want it all done correctly you should also programaticlly set the correct Media Type in the header (also known as MIME Type). For HTML this is in most set to text/html by default, but for XHTML this should always be set to application/xhtml+xml using your program lanugage of choice. Read more about how to correctly use application/xhtml+xml (excellent article).
Recommendation: Always include.
meta tag : http-equiv - content-language
<meta http-equiv="content-language" content="en-gb" />
This tag defines the natural language of the page, for example "en-gb" (see ISO 639-2 Language Codes), and is mainly used by Web crawlers to categorize the page by language. The acctual usefulness of this tag can be discussed, but include it just to be sure.
Recommendation: Always include.
meta tag : title
<meta name="title" content="this is my start page" />
This should be located right under your <title> tag, and would normally be set to the title of the current page, but without the site header. For example if your complete header is <title>MySite.com - this is my start page</title>, set the meta tag to "this is my start page".
By doing this we are seperating the site header from the page title, which may improve your search ranking. As such it is not totally necesarry to include this tag, but at least it doesn't hurt either.
Recommendation: Can be omitted, but include just to be sure.
meta tag : description
<meta name="description" content="This is the description of my page" />
Most search engines support this tag, and will use the content text when displaying the page in a search result. This alone makes it one of the most important meta tags, mainly because this is your chance to give a useful description of your page. A good description makes your page look more relevant, making it more likely that the user will visit your site.
In the past this tag has been misused to increase page ranking, and now many search engines ignores it for ranking purposes, or will acctually penalize you for misusing it. Instead you should try to write something that the user might may find useful.
Recommendation: Always include.
Meta tag : keywords
<meta name="description" content="article,web,development,page,w3c" />
The usefulness of this tag can be discussed mainly because most search engines simply ignore this tag. Again, the reason for this is that it has been much abused in the past. I always include it on my sites, but you can safely ignore it if you want. If you decide to use it; then be sure to just include the keywords that acctually are relevant for the page in question.
The keyword list should be all the subjects describing your page in lowercase and single form, seperated by commas. For example "Web development" should be "web,development". Also don't use any keyword more than once on the same page.
Recommendation: Can be omitted.
Meta tag : author, owner, designer
<meta name="author" content="Richard Persen" />
<meta name="owner" content="Richard Persen" />
<meta name="designer" content="Richard Persen" />
These tags are pretty self-explanatory as they displays the author, owner and the designer of the page. These are not necessary as such, but it's a good idea to include them if you want to show who has contributed to the Website.
Recommendation: Can be omitted.
Meta tag : language
<meta name="language" content="english" />
This tag is used to declare the primary language for the page. If this tag is useful or not can be discussed, but just to be on the safe side you should include this.
Recommendation: Can be omitted, but include just to be sure.
Meta tag : revised
<meta name="revised" content="2008-12-03" />
This tag tells when the page was last modified, and should be written in ISO date format. I've had trouble finding out if search engines ignores this or not. But in my opinion including it is the safer bet; then at least it's availible if a user wants to know.
Recommendation: Can be omitted, but include just to be sure.
XHTML 1.1 example template with meta tags
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>MySite.com - this is my start page</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
<meta http-equiv="content-language" content="en-gb" />
<meta name="title" content="this is my start page" />
<meta name="description" content="This is the description of my page." />
<meta name="keywords" content="xhtml, web, w3c, tag, meta, html, content, browser, article" />
<meta name="author" content="John Doe" />
<meta name="owner" content="John Doe" />
<meta name="designer" content="Jane Doe" />
<meta name="language" content="english" />
<meta name="revised" content="2008-12-03" />
</head>
<body>
<h1>This is my start page</h1>
<p>Some body text</p>
</body>
</html>
Summary
So to sum it up, meta tags are not the solution to all your problems when it comes to page ranking. But they can be useful if you use them correctly as I have shown here. You don't need to include them all, but as a bare minimum you should use the tags I have marked as "Always include".
If you found this article useful, or if you have suggestions or other opinions; then I'd appreciate it if you left a comment. Thank you.