Chaotische Überschriften
Was ist was?
Der Weg ins Unbekannte
Genau richtig! Das ist die Überschrift der Ebene H1. Obwohl sie ja gar nicht so aussieht wie die Hauptüberschrift. Achte darauf, dass du Überschriften auch nur für echte Überschriften verwendest und nicht z.B. weil dir das Styling gefällt. Du kannst die Semantik (H1-H6) unabhängig vom CSS-Styling gestalten.
Es ist wichtig die richtige Überschriftenstruktur einzuhalten, damit Screenreader die Gliederung des Textes erkennen.
Du hast 3 von 8 Rätseln geschafft!
Barrierien
Das ist aber unübersichtlich. Worum geht es denn hier auf der Seite hauptsächlich?
Die Überschrift der Ebene H1 verrät dir die Lösung. Du kannst dir die Überschriftenhierarchie mit dem Screenreader vorlesen lassen.
Klicke auf die Überschrift der Ebene H1.
Problem
Hier ist die Struktur verloren gegangen.
Ich bekomme es oft mit, dass Überschriften völlig durcheinander sind und gar keinen Sinn ergeben. Manchmal wird semantisch eine Überschrift verwendet, obwohl es eigentlich ein Text sein sollte. Und das nur, weil das Styling gerade passt. Dabei sollte man doch das CSS-Styling und die semantische Überschriftenstruktur (H1-H6) trennen.
Barrieren
Semantik
Verwende die richtigen HTML-Tags H1 bis H6, um die Hierarchie der Überschriften klar zu definieren.
H1 nur einmal
Nutze die H1 Überschrift nur einmal auf einer Seite. Sie sollte beschreiben, worum es auf der Seite hauptsächlich geht.
Warum mussten die Überschriften ein Führungs-Coaching machen?
…weil die Hierarchie nicht klar war.