0Pricing
Frontend Academy · Lesson

Document Structure: DOCTYPE html head body

Write a valid HTML5 document from scratch: the DOCTYPE declaration, the html root, the head for metadata, and the body for content.

Every HTML Document Has the Same Skeleton

A valid HTML5 document always starts with a DOCTYPE declaration, contains an html root element, and inside it a head section for metadata and a body section for visible content. Understanding this structure is step zero.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My First Page</title>
  </head>
  <body>
    <h1>Hello, world!</h1>
  </body>
</html>

The DOCTYPE Declaration

<!DOCTYPE html> is not an HTML tag — it's an instruction to the browser to render the page in standards mode. Without it, browsers fall back to "quirks mode", which renders pages inconsistently. Always put it on line 1.

All lessons in this course

  1. Document Structure: DOCTYPE html head body
  2. Semantic Tags: header nav main article footer
  3. Text Images Links and Lists
  4. Forms: input label button
← Back to Frontend Academy