References

Beginner-friendly references for web development, with live, editable examples.

The HTML <head> tag

Element All modern browsers Updated
Quick answer

The HTML <head> element contains the document's metadata — the <title>, <meta> tags, <link>ed stylesheets and icons, and <script>s. This content is not displayed on the page.

Overview

The <head> element is the document's metadata container, sitting before the <body>. The browser processes its contents but does not render them as page content — it is information about the document rather than the document itself.

A well-formed head has a conventional order: the character encoding (<meta charset="utf-8">) first, then the responsive viewport <meta>, a unique <title>, a meta description, and finally <link>s to stylesheets and icons.

Only metadata-type elements belong here — <meta>, <link>, <style>, <script>, <base> and the <title> — and there must be exactly one <title>.

Syntax

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Page title</title>
</head>

Example

Live example
<head>
  <meta charset="utf-8">
  <title>About — CodeShack</title>
  <meta name="description" content="Learn about CodeShack.">
</head>

More Examples

Best practices

  • Put <meta charset="utf-8"> first, before anything that contains text.
  • Include the responsive viewport meta, a unique <title> and a meta description.
  • Keep exactly one <title> in the head.
  • Place only metadata elements here — visible content belongs in the <body>.

Frequently asked questions

What is the head element?
A container for document metadata — encoding, title, description, stylesheet and icon links — that the browser processes but does not render.
What goes in the head of an HTML document?
The charset meta, viewport meta, a <title>, a description, and <link>s/<script>s — only metadata-type elements.
How many title elements can the head have?
Exactly one. A document must have a single <title>.
What is the difference between head and body?
The <head> holds non-rendered metadata; the <body> holds the visible page content.