HTML – Struktur für Webseiten

Aufbau, Elemente und Anwendung – jeweils mit Codebeispiel.

📰 23 Beiträge 🔗 RSS-Feed

HTML (Hypertext Markup Language) beschreibt die Struktur eines Dokuments: Was eine Überschrift ist, was ein Absatz, was ein Verweis. Es rechnet nicht und speichert nichts – dafür sind CSS und JavaScript zuständig.

Wie ein HTML-Dokument aufgebaut ist

Jedes Dokument hat denselben Rahmen: eine Typangabe, ein Wurzelelement mit Sprachangabe, einen Kopf für Angaben über die Seite und einen Rumpf für den sichtbaren Inhalt.

<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Titel der Seite</title>
</head>
<body>
  <h1>Hauptüberschrift</h1>
  <p>Ein Absatz.</p>
</body>
</html>

Die Sprachangabe lang="de" ist kein Beiwerk: Screenreader entscheiden daran über die Aussprache, Suchmaschinen über die Sprachzuordnung.

Was ein Element ausmacht

Ein Element besteht aus öffnendem Tag, Inhalt und schließendem Tag. Attribute stehen im öffnenden Tag und verändern das Verhalten:

<p class="einleitung">Dies ist ein Absatz.</p>

Einige Elemente haben keinen Inhalt und deshalb kein schließendes Tag – <br>, <hr> und <img> gehören dazu.

Semantik statt Container

Der praktische Unterschied zwischen brauchbarem und beliebigem HTML liegt in der Elementwahl. <header>, <nav>, <main>, <article>, <aside> und <footer> sagen aus, welche Rolle ein Bereich hat. Ein <div> sagt nichts – es ist der Rückfall, wenn kein passendes Element existiert.

Wer statt eines <button> ein angeklicktes <div> baut, verliert Tastaturbedienung, Fokusreihenfolge und die Ansage im Screenreader – und baut sie anschließend mit JavaScript und ARIA nach.

Die Versionsgeschichte, mit Daten

FassungDatumBedeutung
HTML 2.0November 1995 (RFC 1866)erste standardisierte Fassung, Formulare
HTML 3.214. Januar 1997Tabellen, Applets, Textumfluss
HTML 4.018. Dezember 1997Trennung von Struktur und Gestaltung
HTML 4.0124. Dezember 1999Korrekturfassung von HTML 4
XHTML 1.02000, überarbeitet 1. August 2002HTML in XML-Syntax
HTML528. Oktober 2014W3C-Empfehlung: Audio, Video, Canvas, semantische Elemente
Living Standardseit 28. Mai 2019W3C und WHATWG pflegen eine gemeinsame Fassung

Die letzte Zeile wird oft falsch wiedergegeben: Seit der Vereinbarung zwischen W3C und WHATWG vom 28. Mai 2019 gibt es eine normative HTML-Spezifikation, gepflegt als Living Standard bei der WHATWG. Versionsnummern nach HTML5 gibt es nicht mehr.

Womit man anfängt

Ein Texteditor und ein Browser genügen. Eine Datei mit der Endung .html speichern, im Browser öffnen, fertig. Ein Server wird erst gebraucht, wenn die Seite öffentlich erreichbar sein soll.

Was danach hilft: die Seite durch einen Validator schicken. Browser reparieren fehlerhaftes Markup stillschweigend und jeder auf seine Weise – der Validator zeigt, was tatsächlich dasteht.

Themen: Textauszeichnung 8 Verweise und Inhalte 7 HTML-Grundlagen 5 Elemente 3
Aktuell

Alle Beiträge

⭐ Empfohlen
Verweise und Inhalte

Bilder einbinden mit img

Quelle, Alternativtext, Maße und Ladeverhalten: vier Attribute, die über Zugänglichkeit und Ladezeit entscheiden.

· 1 Min. Lesezeit
Beitrag lesen →

Häufige Fragen zu HTML

Ist HTML eine Programmiersprache?

Nein. HTML führt keine Logik aus, trifft keine Entscheidungen und berechnet nichts. Es beschreibt, welche Bedeutung ein Textabschnitt hat. Für Berechnungen und Reaktionen auf Eingaben wird JavaScript verwendet.

Welche HTML-Version soll ich lernen?

Die aktuelle – und die hat keine Nummer mehr. Seit dem 28. Mai 2019 pflegen W3C und WHATWG einen gemeinsamen Living Standard, der laufend ergänzt wird. Wer HTML5 lernt, lernt die Grundlage davon; Änderungen betreffen seither vor allem Randbereiche.

Wie lange dauert es, HTML zu lernen?

Die Struktur eines Dokuments und die zwei Dutzend häufigsten Elemente sind an einem Wochenende zu verstehen. Was Zeit braucht, ist die Elementwahl: zu erkennen, wann ein Abschnitt ein article ist und wann eine section. Dafür hilft nur, fremdes Markup zu lesen.

Brauche ich einen Server, um HTML zu testen?

Nein. Eine lokal gespeicherte HTML-Datei lässt sich im Browser öffnen. Ein Server wird gebraucht, sobald die Seite von außen erreichbar sein oder serverseitige Verarbeitung stattfinden soll.

Passend dazu
🏆WerkzeugvergleichDas unabhängige Ranking 🏢WerkzeugeAlle Einträge im Überblick 📍Nach ThemaWerkzeuge nach Thema