Your first document
The document structure
Build a complete HTML document with the doctype, root html element, head metadata, and visible body content in the right places.
Every complete HTML page follows the same skeleton. Here is the shape we will use throughout this course:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>My first page</title>
</head>
<body>
<h1>My first page</h1>
<p>Hello from an HTML document.</p>
</body>
</html>The <!doctype html> line tells the browser to use modern HTML rules. The html element is the root of the document. Every other element lives inside it.
Inside html you have two main regions:
headholds information about the document: character encoding, title, links to stylesheets, and morebodyholds what people actually see and interact with on the page
A document has exactly one html, one head, and one body.
Notice the indentation. Elements inside html are indented by two spaces. Elements inside head and body are indented again. Indentation does not change what the browser displays. It shows nesting clearly to humans, which makes mistakes much easier to spot when a tag is missing or in the wrong place.
Open your html-course/index.html file and replace the fragment from the previous lesson with this complete document. Save and refresh. The visible page looks almost the same, but open View Page Source and you will see the full tree. The browser tab title now comes from <title> in the head, not from the h1 in the body.
A common mistake is putting visible content inside head by accident. The browser may still show it, but metadata belongs in head and everything people read belongs in body.
Later practice lessons use a my-page folder with the same skeleton. Once you understand this structure, every new page you create starts from the same reliable base.
Quick check
Result
You got of right.
Lesson completed