Die Überschriftenhierarchie bezeichnet die logische Gliederung von Inhalten mithilfe der HTML-Elemente h1 bis h6. Sie ist essentiell für die Barrierefreiheit, da sie Screenreader-Nutzenden die Navigation und Orientierung ermöglicht und die inhaltliche Struktur einer Seite vermittelt.
Grundregeln der Überschriftenhierarchie:
Eine
h1pro Seite als HauptüberschriftÜberschriftenebenen nicht auslassen (z. B. nicht direkt von
h2zuh4)Logische Verschachtelung
Überschriften nach Bedeutung – nicht nach Aussehen
Keine leeren Überschriften
Für die Entwicklung bedeutet dies:
Dokumentenstruktur vorab planen
Semantisch korrektes HTML verwenden
Styling von Struktur trennen
Screenreader-Tests durchführen
Testing der Hierarchie:
Mit Screenreader testen
Navigationstests durchführen
Logische Struktur verifizieren
Vollständigkeit kontrollieren
Die korrekte Überschriftenhierarchie ist nicht nur für die Barrierefreiheit wichtig – sie verbessert auch die allgemeine Nutzerführung, Wartbarkeit und Suchmaschinenoptimierung einer Website.
