HTML (HyperText Markup Language) beschreibt, was auf einer Webseite steht: Überschrift, Absatz, Liste, Link. Wie es aussieht, kommt später mit CSS.

• Tag:Befehlswort in spitzen Klammern: Start-Tag <p>, End-Tag </p> mit Schrägstrich.
• Element:Start-Tag + Inhalt + End-Tag, z. B. <h1>Klettern</h1>.
• Leeres Element:hat keinen Inhalt und kein End-Tag, z. B. <img> oder <br>.
• Attribut:Zusatzangabe im Start-Tag: name="wert", z. B. href beim Link.
• Verschachtelung:Elemente stecken ineinander; was zuerst geöffnet wird, wird zuletzt geschlossen.

<h1>Mein Hobby: Klettern</h1>
<p>Ich klettere seit <b>zwei</b> Jahren.</p>
<ul>
  <li>Halle</li>
  <li>Fels</li>
</ul>
<a href="https://dav.de">Mehr erfahren</a>

• h1 … h6:Überschriften, h1 ist die wichtigste.
• p:Absatz (paragraph).
• ul, li:ungeordnete Liste mit Listenpunkten (list item).
• a:Link (anchor); das Ziel steht im Attribut href.

Jede HTML-Datei hat dasselbe Gerüst. Der Browser liest es von oben nach unten und baut daraus die Seite.

<!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8">
    <title>Klettern</title>
  </head>
  <body>
    <h1>Mein Hobby: Klettern</h1>
  </body>
</html>

• DOCTYPE:erste Zeile: „Das ist HTML5“.
• html:umschließt alles; lang="de" nennt die Sprache.
• head:Kopf mit Angaben über die Seite: Zeichensatz, Titel im Browser-Tab — nichts davon steht auf der Seite.
• body:Körper mit allem, was man auf der Seite sieht.
• Einrückung:zeigt die Verschachtelung; dem Browser ist sie egal, dem Menschen nicht.

Baue eine Webseite als Baum aus Kästen: Wähle einen Kasten (anklicken oder mit Tab + Enter) und füge darin ein Element aus der Leiste ein. Probiere auch, title in den body zu setzen.

Halte fest: Im head stehen Angaben über die Seite, im body steht, was man sieht — und jedes Element liegt vollständig in seinem Elternelement.