By using this site you agree to the use of cookies by Brugbart and our partners.

Learn more

HTML Meta Tag

Reference showing how to use the meta Elements in HTML.

Edited: 2014-12-28 05:49

Meta tags goes in the head section between <head> and </head>. Meta tags are primerely used to provide search engines with meta data, such as:

  1. Page Description
  2. Document Language
  3. Character Encoding

But also to enter copyright information, and information about the Author.

The Meta Tags

The Robots Meta Tags

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

The robots meta tag is used to restrict, or allow search engines to index your site, and/or follow links on your site. The keywords you can use in the robots tag:

  1. index Allows indexing
  2. noindex Dissallows indexing
  3. follow Allows following of links
  4. nofollow Dissallows following of links

The Title Meta Tag

<meta name="title" content="Learn By Doing -">

Some websites include a title meta tag, this tag is however obsolate. Instead webdesigners should use the <title> Tag.

The Keywords Meta Tag

<meta name="keywords" content="Webdesign, HTML, CSS, Learn CSS, Learn HTML, Brugbart, BlueBoden">

This tag is used in conjunction with site content; generally you should keep the keywords relevant to the content, this is usualley done by making sure that the keywords actualley apear somewhere in your sites content.

The Description Meta Tag

<meta name="description" content="Useful Articles Tutorials and References.">

This tag is generally only useful when and if, you would like to provide search engines with a customized description. Search engines will generally take a portion of your sites content, and use that as the description; sometimes however, the sites structure makes it hard for search engines to chose the "right" portion to use, and therefor it sometimes end up including menu-links or alt attributes on images, as a part of the description.

Position based layouts, and even some float based allows you to better control the page flow, and as such to better control what will be used as description, (efectivley allowing you to leave out the tag), you can create websites even more accessible for screen readers, while preserving the ability to layout the pages in just about any way you want.

Many dymanic websites generate the description, based on up to 200 characters of the content text, (it being an article or forum post), dosn't matter.

The Copyright Meta Tag

<meta name="copyright" content="2006-2008 Brugbart Webdesign">

It is a good idea to include a copyright statement, you wouldn't want people to steal your hard work. It dosn't ensure that some theif dosn't come along and steals your work, but it shows that you care about your work. Don't hasitate to include it, even if you don't have a certification in webdesign, you still invested your time creating the site.

The Author meta Tag

<meta name="author" content="BlueBoden - Jacob Kristensen">

Both the Copyright and Author tags are optional.

The http-equiv meta Tags

<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">
<meta http-equiv="Content-language" content="eng">

Meta tags with the http-equiv attribute are equivalent to HTTP headers, it is recommended to use real headers when possible, since http-equiv might get ignored under various circumstances.