Menu
Document Structure & Metadata

<head> Section

Holds metadata, title, links to CSS, and scripts.

1What Goes in <head>

The <head> contains meta information about the document — it never renders content directly. Put your title, charset, viewport, stylesheets, and SEO meta here.

Example Code
css
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>Page Title</title>
  <link rel="stylesheet" href="/styles.css" />
  <script src="/app.js" defer></script>
</head>

2Put the element in context

The head contains document metadata and references rather than the main visible article. A page title, character encoding, and stylesheet belong here. Content that a visitor should read as part of the page generally belongs in the body instead of being placed in metadata.

3Practice with a small page

Create a head with a title, encoding declaration, viewport declaration, and stylesheet link. Compare the browser tab title with the visible heading in the body. Keep those two labels related while recognizing that they are separate elements.

Finished reading?

Mark this topic as complete to track progress.