Überschriften sind Navigation, nicht nur großer Text

Für Nutzerinnen und Nutzer von Screenreadern sind Ihre headings ein Inhaltsverzeichnis. Sie sind nicht bloß fetter Text, sondern das Mittel, mit dem sich Menschen durch eine Seite bewegen. 🧭

Ein Tastendruck bewegt einen Screenreader von einer heading zur nächsten. Nutzerinnen und Nutzer überfliegen eine Seite, indem sie zwischen Überschriften springen, statt jedes Wort zu lesen.

Viele Screenreader können alle headings gleichzeitig wie eine eingeblendete Gliederung auflisten. Nutzerinnen und Nutzer durchsuchen diese Liste, um den gewünschten Abschnitt zu finden.

Nutzerinnen und Nutzer können auch nur zwischen headings derselben Ebene springen, etwa zwischen allen h2-Abschnitten. Korrekte Ebenen machen diese Abkürzung präzise und schnell.

Ein fett gestaltetes div sieht zwar wie eine Überschrift aus, ist für diese Navigation aber unsichtbar. Nutzerinnen und Nutzer von Screenreadern finden es einfach nicht.

Nur echte Tags von h1 bis h6 werden in die Navigationsliste aufgenommen. Text groß zu gestalten bewirkt nichts; die Bedeutung wird durch das Tag vermittelt.

Jede heading ist ein Wegweiser – schreiben Sie daher beschreibenden Text. Wenn man nur die Überschriften liest, sollte sich eine klare Karte der Seite ergeben.

Lange Abschnitte ohne heading lassen Nutzerinnen und Nutzer ohne schnelle Sprungmöglichkeit zurück. Teilen Sie den Inhalt auf, damit sie in die Nähe des Gesuchten springen können.

Wenn Sie jede Zeile als heading markieren, überfluten Sie die Navigationsliste und verbergen die eigentliche Struktur. Verwenden Sie Überschriften nur für echte Abschnittsanfänge.

Eine klare Gliederung aus headings zeigt Nutzerinnen und Nutzern, dass eine Seite gut aufgebaut ist. Sie navigieren schneller und können darauf vertrauen, keinen Inhalt zu übersehen.

Echte headings speisen außerdem seiteninterne Links, Browser-Gliederungen und Suchmaschinen. Eine gute Struktur hilft unauffällig allen, nicht nur Nutzerinnen und Nutzern von Screenreadern.

Sie haben gelernt, dass echte headings eine navigierbare Gliederung bilden. Nutzerinnen und Nutzer springen zwischen ihnen – verwenden Sie daher echte Überschriften-Tags mit aussagekräftigen Wörtern. ✅