Module 3: Document Structure and Metadata
The html, head, and body Elements
Understand the three main parts of an HTML document and what belongs in each one.
A normal HTML page has one root html element, a head for document metadata, and a body for the page’s content. Browsers can infer some omitted tags, but writing the structure explicitly makes it easier to maintain.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Workshop Schedule</title>
</head>
<body>
<h1>Workshop Schedule</h1>
<p>Registration opens on Monday.</p>
</body>
</html>
The html element is the document root. The head is not a visible header; it contains information about the document and links to resources. The body contains the content rendered in the page’s main browsing area.
Common head content includes character encoding, page title, viewport declaration, description metadata, favicon links, stylesheets, and some scripts. Headings, paragraphs, navigation, images, forms, tables, and interactive content belong in the body.
Open the Elements panel in your browser and inspect a page. Browsers may insert implied elements in the DOM when source markup omits them. Seeing a corrected DOM is useful, but it is not a reason to leave the source incomplete.