We start with the smallest page that is actually correct. Create a file called index.html and type what's in the code column. We leave the body (<body>) empty for now — content comes in the next step; right now what matters is the skeleton.

The file is small, but every line earns its place:

• <!DOCTYPE html> — tells the browser to use modern ("standards") mode. Leave it out and you get twenty-year-old behaviour.
• <html lang="en"> — lang tells screen readers which language to pronounce the text in, and browsers whether to offer a translation. (We keep en while the content is English; when you write in Lithuanian you'll switch it to lt.)
• <meta charset="UTF-8"> — this is why ąčęėįšųūž renders correctly instead of as garbage.
• <meta name="viewport" …> — the difference between a mobile site and a desktop site squeezed down to 30%.
• <title>Cosmos</title> — the text in the browser tab and in bookmarks.

Notice: we are not loading the stylesheet (style.css) yet. In this lesson we build only the document; CSS begins in lesson two. The page will look unstyled — and for now that's exactly right.

The structure is always the same: <head> is what the visitor doesn't see directly (settings, the title), and <body> is what they do. The body is still empty, so serve the folder (npx serve), open index.html, and you'll get a blank, white page. That's expected — it isn't a bug, it's the empty <body>. Your one signal that it worked is the browser tab: it reads "Cosmos". If the tab says Cosmos, the skeleton is correct — we fill the body in the next step.

Tip. Indentation in your code (two spaces per level) means nothing to the browser — the page would work without it. It matters to you, and to whoever reads your code six months from now. Get into the habit from the start.