HTML <meta/> Tag

 

ATTENTION: THIS PAGE IS Valid HTML 5 AND IS BEST VIEWED WITH HTML 5 - Please upgrade your browser or download one of the HTML 5 compatible browsers such as Mozilla Firefox, Chrome, Opera or IE 9 (March 14, 2011 or later). For more information see HTML 5 browsers.


If you find this helpful, please click the Google +1 Button to the left, if it is white, to make it turn blue or red. Thank you! (It also helps find this page again more easily.)


PDF mobile

The <meta/> Tag in HTML 5

The <meta/> tag is used to define metadata for the HTML document or directives for the HTTP protocol. HTML metatag elements have a content attribute and either a name attribute for document metadata or an http-equiv attribute for protocol directives.

<meta http-equiv="..." content="..."/>
<meta name="..." content="..."/>
<meta itemprop="..." content="..."/>

See the HTML <meta> tag list for some of the values that can be coded for the name attribute or the http-equiv attribute. Other metadata can be expressed using specific HTML tags, such as:

List of <meta> tags in HTML 5

Most Common Metatags

The most common HTML metatags include:

Metatags for Search Engine Optimization (SEO)
Metatags for HTML pages on Mobile / Handheld Devices
Metatags for Apps on Mobile / Handheld Devices
<meta http-equiv="..."/> tags

Less common HTML metatags include:


<meta/> Tag Syntax

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet ...?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      ... metadata content ...
      <meta http-equiv="..." content="..."/>
      ... metadata content ...
      <title>My Title</title>
      ... metadata content ...
      <meta name="..." content="..."/>
      ... metadata content ...
   </head>
   <body>
      ... flow content expected ...
      <meta itemprop="..." content="..."/>
      ...
      ... phrasing content expected ...
      <meta itemprop="..." content="..."/>
      ...
   </body>
</html>
Rules for coding the HTML meta element

Make sure you understand the difference between a tag and element and are familiar with the definitions of namespace and other HTML terms.

<meta/> tag as metadata content
  1. Code any <meta> tags in the <head> section of the HTML document where metadata content is expected.
  2. Each meta element consists of a standalone <meta/> tag. The element name uses lower case letters and should be in the HTML namespace, which it will pick up automatically from the xmlns attribute on the <html> tag.
  3. Code either a name attribute or an http-equiv attribute, but not both. The value of the attribute, which is enclosed in double quotes, is the name of the metadata or directive.
  4. Code the content attribute with the value for the named metadata or directive in double quotes.
  5. Since the <meta/> tag is a void element, it should always be coded as a self-closing tag terminated with the delimiter string />.
<meta/> tag for microdata properties
  1. Code the <meta> tag in the <body> section of the HTML document where either flow content or phrasing content is expected.
  2. The meta element consists of a standalone <meta/> tag. The element name uses lower case letters and should be in the HTML namespace, which it will pick up automatically from the xmlns attribute on the <html> tag.
  3. Inside the <meta> tag, include an itemprop attribute to indicate the meta element represents a microdata property. The value of the attribute, which is enclosed in double quotes, is the name or URL of the microdata property.
  4. Inside the <meta> tag, code a content attribute with the value of the microdata property in double quotes.
  5. Since the <meta/> tag is a void element, it should always be coded as a self-closing tag terminated with the delimiter string />.

<meta/> Content Model

Contents of the meta element

Content: Empty. All properties are coded using attributes.

Since the <meta/> tag is a void element, it is not allowed to have any content, even HTML comments and therefore should always be coded as a self-closing standalone tag, ending with the delimiters /> rather than just > (<meta .../>).


<meta/> Tag Attributes

Attributes of the <meta/> tag
global attributes In addition to the personal attributes of the <meta/> tag below, any of the common HTML attributes can also be coded.
The itemprop attribute is required when the <meta/> tag is used where flow content or phrasing content is expected.
charset
content
for <meta http-equiv="...">
the value of the HTTP header directive
for <meta name="...">
the value of the document metadata
for <meta itemprop="...">
the value of the microdata property
http-equiv http-equiv="content-language"
http-equiv="content-type"
http-equiv="default-style"
http-equiv="refresh"
name name="application-name"
name="author"
name="classification"
name="copyright"
name="description"
name="formatter"
name="generator"
name="google"
name="googlebot"
name="handheldfriendly"
name="keywords"
name="rating"
name="verify"
name="viewport" - see Using <meta name="viewport"/> to Control Zoom in Mobile Browsers

<meta/> Tag Examples

Examples of the <meta/> tag in HTML 5

Changes in HTML 5 - <meta/> Tag

What's new in HTML 5
Differences between HTML 5 and HTML 4 / xHTML
  • The <meta charset="..."/> tag should no longer be used because it is supported only for the purpose of migrating from xHTML.

In ployglot HTML documents the <meta/> tag is coded as a self-closing tag the same as in the 2000-2010 Recommendations from the W3C HTML Working Group. Those specifications changed the ending delimiter to /> from > in older recommendations. They also defined the HTML namespace for the meta element type name and the names of other HTML element types.


Valid HTML 5