HTML (HyperText Markup Language)

HTML (HyperText Markup Language) ist das Fundament jeder Website. Es definiert die Struktur und den semantischen Aufbau von Web-Dokumenten durch Tags wie <header>, <nav>, <main>, <article>, <section> und <footer>. Browser interpretieren HTML-Code und stellen den Inhalt visuell dar. Ohne HTML gäbe es kein Web.

HTML5, der aktuelle Standard, brachte semantische Elemente, native Video/Audio-Unterstützung, Canvas für Grafiken und verbesserte Formular-Elemente. Semantisches HTML ist entscheidend für SEO und Barrierefreiheit - Suchmaschinen und Screenreader verstehen die Bedeutung der Inhalte besser. Ein <nav>-Element signalisiert Navigation, <article> einen eigenständigen Inhalt.

Die Trennung der Verantwortlichkeiten: HTML für Struktur, CSS für Design, JavaScript für Interaktivität. Sauberes, valides HTML bildet die Basis für performante, zugängliche und suchmaschinenfreundliche Websites. Moderne Frameworks wie React oder Next.js generieren letztendlich auch HTML für den Browser.

Aus dem HTML-Quelltext baut der Browser das Document Object Model (DOM) auf - eine Baumstruktur, die JavaScript manipulieren und CSS gezielt ansprechen kann. Elemente bestehen aus Tags und Attributen: class und id für Styling und Selektion, href und src für Verweise sowie ARIA-Attribute (etwa role oder aria-label) für assistive Technologien. Manche Elemente sind sogenannte Void-Elemente ohne schließenden Tag, zum Beispiel img, br oder input.

Für SEO und Barrierefreiheit sind einige HTML-Regeln entscheidend: pro Seite genau eine h1, eine logische Überschriftenhierarchie von h1 bis h6 ohne Sprünge, aussagekräftige alt-Attribute bei Bildern, korrekt per for verknüpfte label-Elemente bei Formularfeldern und Meta-Tags im head (title, meta description, Open Graph für Social-Media-Vorschauen). Ein verbreiteter Fehler ist der Missbrauch von div- und span-Containern für alles - die sogenannte Divitis -, wodurch semantische Bedeutung und damit Ranking- wie Accessibility-Signale verloren gehen. Der kostenlose W3C-Validator prüft Markup auf Fehler wie nicht geschlossene Tags oder ungültige Verschachtelung. Auch wenn Frameworks wie React das HTML dynamisch erzeugen, bleibt valides, semantisches Markup die Grundlage: Suchmaschinen-Crawler und Screenreader interpretieren am Ende immer den ausgelieferten HTML-Baum, nicht den Komponenten-Code.