Was ist HTML?

HTML: Definition und Bedeutung

HTML beschreibt den Aufbau einer Webseite: Was ist eine Überschrift, was ein Absatz, eine Liste, ein Bild, ein Link oder ein Formular? Dazu werden Inhalte mit sogenannten Tags ausgezeichnet, etwa mit dem Element „h1“ für die Hauptüberschrift. Das Aussehen (CSS) und das Verhalten (JavaScript) sind getrennte Schichten, die auf HTML aufbauen.

Entwickelt wurde HTML Anfang der 1990er-Jahre am CERN, um Dokumente über Links zu verbinden. Heute pflegt die Entwicklergemeinschaft WHATWG den „HTML Living Standard“ laufend weiter. „HTML5“ gilt als Meilenstein, weil es unter anderem Video, neue Formularfelder und semantische Elemente einführte.

So ist ein HTML-Dokument aufgebaut

Ein HTML-Dokument besteht aus einem Kopfbereich mit unsichtbaren Angaben wie Seitentitel, Meta-Description und Zeichensatz sowie einem Hauptbereich mit den sichtbaren Inhalten. Der Browser liest den Code, baut daraus eine Baumstruktur (DOM) und stellt sie dar. Suchmaschinen und Screenreader werten dieselbe Struktur aus.

• header, nav, main und footer gliedern die Seite in Bereiche
• h1 bis h6 bilden die Überschriftenhierarchie
• a setzt Links zu anderen Seiten oder Abschnitten
• img mit Alt-Text beschreibt Bilder für Screenreader und Suchmaschinen
• form, label und input bauen Formulare mit eindeutig beschrifteten Feldern

Praxis­bei­spiel: sauberes HTML statt „Div-Suppe“

Ein Handwerksbetrieb hat seine Website über einen Baukasten erstellt. Im Quellcode steckt fast alles in generischen Containern, Überschriften sind nur größer formatierter Text, Bilder haben keine Beschreibung. Für Besucher sieht die Seite gut aus, doch Screenreader und Suchmaschinen erkennen keine Struktur.

Beim Relaunch wird derselbe Inhalt semantisch ausgezeichnet: eine H1 pro Seite, logisch gestaffelte Unterüberschriften, beschriftete Formularfelder, Alt-Texte. Optisch ändert sich kaum etwas, die Seite wird aber besser auffindbar, schneller zu verarbeiten und auch für Menschen mit Einschränkungen nutzbar, die mit Tastatur oder Screenreader arbeiten.

Vorteile, typische Fehler und Umsetzung

Sauberes, semantisches HTML ist die Grundlage für Barrierefreiheit – das Barrierefreiheitsstärkungsgesetz (BFSG) gilt seit 28. Juni 2025 für bestimmte digitale Angebote wie Onlineshops für Verbraucher – und für gute Suchmaschinenoptimierung. Es lädt schneller, lässt sich leichter pflegen und funktioniert auch dann, wenn Skripte oder Stile einmal nicht geladen werden. Fehler im Aufbau fallen mit Prüfwerkzeugen wie dem W3C-Validator früh auf.

Nano Concepts entwickelt Websites mit semantischem, validem HTML und prüft es gegen die Anforderungen an Barrierefreiheit und technische SEO. Das gilt für handgeschriebene Seiten ebenso wie für Vorlagen in WordPress oder Shopware, bei denen wir den automatisch erzeugten Code gezielt verbessern, statt ihn unverändert zu übernehmen.

• Überschriften nach Schriftgröße statt nach Bedeutung wählen
• Bilder ohne Alt-Text oder Text als Bild einbinden
• Klickbare Elemente ohne echten Link oder Button bauen
• Formularfelder ohne zugehöriges Label anlegen
• Die Sprachangabe im Dokument weglassen