HTML charset Attribute

HTML charset Attribute

The HTML charset attribute is used on the <meta> element to declare the character encoding of an HTML document. Modern HTML documents use UTF-8, which supports characters and symbols from languages around the world.

Syntax

The charset attribute is specified on a <meta> element inside the document's <head>.

<meta charset="utf-8">

In modern HTML, the value of the charset attribute must be utf-8, matched without regard to ASCII letter case.

Attribute Value

The charset attribute has one conforming value in modern HTML.

Elements That Use the charset Attribute

The charset attribute is currently valid on the <meta> element. Earlier versions of HTML also used charset on other elements, but those uses are obsolete.

Using the charset Attribute

A typical HTML document places the character encoding declaration near the beginning of the <head>.

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>HTML Example</title>
  </head>
  <body>

    <h1>Hello, World!</h1>

  </body>
</html>

Declaring the encoding allows the browser to correctly interpret the bytes of the HTML document as characters.

Placement in the Document

The character encoding declaration should appear as early as possible in the document. When the encoding is declared with <meta charset="utf-8">, the entire <meta> element must be serialized within the first 1024 bytes of the document.

<head>
  <meta charset="utf-8">
  <title>Page Title</title>
</head>

Placing the declaration immediately after the opening <head> tag is a simple way to ensure that it occurs early enough.

UTF-8 Encoding

UTF-8 can represent the characters used by modern HTML documents, including accented letters, non-Latin writing systems, mathematical symbols, and emoji.

<meta charset="utf-8">

The encoding used to save and transmit the document should agree with its declared encoding. Declaring UTF-8 does not convert a file that was actually saved using a different encoding.

charset and http-equiv

HTML also defines an older encoding declaration using http-equiv="content-type".

<meta http-equiv="content-type" content="text/html; charset=utf-8">

The shorter <meta charset="utf-8"> form is the normal choice for modern HTML. A document must not contain both forms of the meta-based character encoding declaration.

Obsolete Uses of charset

Older HTML allowed the charset attribute on elements such as <a>, <link>, and <script>. These uses should not be used in modern HTML.

<!-- Obsolete -->
<a href="page.html" charset="utf-8">Page</a>

<link rel="stylesheet" href="styles.css" charset="utf-8">

<script src="script.js" charset="utf-8"></script>

Use charset on <meta> to declare the character encoding of an HTML document.

Common Mistakes

Do not specify legacy encodings such as ISO-8859-1 as the value of the modern charset attribute. The conforming value is utf-8.

<!-- Correct -->
<meta charset="utf-8">

Do not include more than one <meta> element with a charset attribute in the same document.

Do not place the encoding declaration too far into the document. Keep it near the beginning of the <head> so that the complete declaration occurs within the first 1024 bytes.

Do not use the obsolete charset attribute on <a>, <link>, or <script> elements.

Browser Support

Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.

The charset attribute is widely supported on the <meta> element. Its former use on <a> and <link> is obsolete and should not be used in modern HTML.

Checking Browser Support

For current browser compatibility information, visit Can I Use? . Search for the HTML element or attribute you want to check. You can also narrow your search by entering an element name and attribute name separated by a colon. Search results can include related HTML features, element attributes, input types, APIs, and other technologies, so select the result that most closely matches the feature you are checking.

Try the charset Attribute

The example declares UTF-8 and displays several characters that demonstrate why a consistent character encoding is important.

Summary

The HTML charset attribute is currently used on the <meta> element to declare the UTF-8 character encoding of an HTML document. The declaration should appear near the beginning of the <head> and must be completely contained within the first 1024 bytes of the document. Uses of charset on <a>, <link>, and <script> are obsolete and should not be used in modern HTML.