HTML <meta> element

The <meta> element is an important HTML element that relays metadata to the browser that is not handled by other, more specific metadata HTML elements. The metadata it holds is expressed in its various attributes that cover six broad categories.

One category uses standard metadata names, such as author, description, referrer, keywords, and color-scheme. These attributes are defined in the form of name="value".

A second category is related to the previous one, but it is intended for user-defined names and values instead of standard ones. These take on the form name="someName" content="value". This results in someName="value".

A third category defines instructions (directives) for the web browser's compiler or interpreter that normally appear in HTTP header information sent by web servers. The attribute's name is http-equiv, and its values are the names of those specific instructions. HTTP header information can therefore be simulated, in a sense, by specifying them in the <meta> tag. The header information can define things such as security policy, refresh rate, browser compatibility, and the document's content type. These take on the form http-equiv="name" content="value". Here, name is the equivalent name of the HTTP header, and value is its value.

A fourth category is charset. This simply states the character encoding for the document (such as charset="UTF-8"). The http-equiv attribute can also be used to specify the character encoding in its content-type name, but it also provides additional information, such as "text/html." The character encoding given in the charset attribute takes precedence.

A fifth category is reserved for user-defined metadata and takes on the form itemprop="name" content="value". However, the data is specified in a less straightforward way than in the second category because it is designed to describe more complex, structured data. This is explained in the HTML Living Standard under the 'Microdata Specification' and on the webpage https://schema.org. itemprop is more commonly applied to HTML elements supplying visual content and is used in conjunction with the attributes itemtype and itemscope.

A sixth category covers attributes used by some social media platforms. These take on the form property="og:name" content="value" (resulting in og:name="value"), where og stands for 'Open Graph (metadata)'. This allows social media platforms to recognise and display the content appropriately.

Attributes (besides those given above): GLOBALS (of these, usually only id, class, and data-* could be useful).

Typical layout:
<head>
  <meta/>
  <meta/>
</head>

Visual representation: