<meta> - HTML meta Tag

Definition

The <meta> tag specifies metadata, or information, about a HTML document that cannot otherwise be expressed using the <title>, <base>, <link>, <style>, or <script> tags.

Example

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="description" content="Webmaster Tutorials and Guides">
  <meta name="keywords" content="Development, Hosting, SEO">
  <meta name="author" content="Jonathan Griffin">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <h1>Displayed Page Title</h1>
    <p>The main content of your page goes here.</p>
</body>
</html>

Usage

The <meta> element is an empty element. It only contains attributes. There is no closing tag.
The <meta> element should be placed in the <head> element.
Any metadata or information defined will not show in the html document. It is used by machines to understand more about the page. For example:
- To refresh or redirect the page:
```
<meta http-equiv="refresh" content="3;url=http://example.com/">
```
- To define the author of a page:
```
<meta name="author" content="Jonathan Griffin">
```
- To define a description of your page:
```
<meta name="description" content="HTML Reference for the Meta Tag.">
```

Attributes

The <meta> element supports the Global Attributes, as well as the following:

charset
The charset attribute specifies the encoding for the HTML document. The HTML5 specification recommends UTF-8 as it avoids unexpected results on form submissions and URL encoding. For example:
```
<meta charset="UTF-8">
```
content

The content attribute specifies the name for the http-equiv or name attribute, depending on which is used. See below.

http-equiv

The http-equiv attribute specifies how the element deals with cross-origin requests.

Values can include:

content-security-policy - Allows the specification of a content policy for the document. This can be used to prevent security issues, such as scripting attacks.
content-type - This declares the MIME type and character encoding.
default-style - This specified the default stylesheet.
x-ua-compatible - This allows authors to choose the version of Internet Explorer to use when rendering the page. For example:
```
<meta http-equiv="X-UA-Compatible" content="IE=edge">
```
refresh - This specifies the number of seconds to be reloaded in seconds. If it contains a number followed by :url= and a valid URL, it will redirect to that page after the set time.
name
The name attribute specifies a name for the metadata. This is paired with the content attribute to create a name-value pair.
Values can include:
- application-name - This specifies the name of the web application represented by the page.
- author - This specifies the name of one of the page’s authors.
- description - This describes the page. Search engines use it to understand the nature of the page better. You should include this on every page.
- generator - This specifies the software package used to generate the document. For example:
```
<meta name="generator" content="Hugo 0.80.0" />
```
- keywords - These specifies keywords relevant to the page. Google no longer uses this for search ranking purposes. Many webmasters no longer use this attribute.

Specification

Browser Support

Desktop

Chrome	Edge	Firefox	IE	Opera	Safari
Yes	Yes	Yes	Yes	Yes	Yes

Mobile

Android Webview	Chrome Android	Firefox Android	Opera Android	iOS Safari	Samsung Internet
Yes	Yes	Yes	Yes	Yes	Yes

HTML <Meta> Tag

Definition

Example

Usage

Attributes

`charset`

`content`

`http-equiv`

`name`

Specification

Browser Support

Desktop

Mobile