← Month 1 — Web Foundations & HTMLWeek 228 min

Complete HTML5 document

Objectives

Write a valid HTML5 skeleton
Use head, meta, title
Structure body with header/main/footer

Lesson

Every modern document starts with <!DOCTYPE html>. <html lang="en"> declares the language — essential for accessibility and SEO.

<head> holds metadata: UTF-8 charset, mobile viewport, title, description, CSS links, favicon. None of that appears directly on the page.

<body> holds visible content. Semantic tags header, nav, main, article, section, aside, footer describe roles — not just looks.

Usually one <h1> per page, then a logical h2 → h3 hierarchy. Don’t skip levels for “looks”: CSS handles style.

Mental check: every opened tag is closed (except void elements: img, br, hr, input, meta, link…).

Practice lab

Add a nav in header and a paragraph in main.

○ <nav○ <p

<!DOCTYPE html>
    <html lang="fr">
    <head>
      <meta charset="UTF-8" />
      <meta name="viewport" content="width=device-width, initial-scale=1" />
      <title>Académie</title>
    </head>
    <body>
      <header></header>
      <main>
        <h1>Code Academy Alfred</h1>
      </main>
      <footer></footer>
    </body>
    </html>

Assessment

1. Where does <title> go?

2. Why lang="en" on <html>?

Previous Next