Web Accessibility Academy · Lektion

Pro Seite ein h1: Das Hauptthema benennen

Geben Sie jeder Seite genau eine klare Überschrift der obersten Ebene.

Lektion 1 von 413 Schritte

Pro Seite ein h1: Das Hauptthema benennen ist eine kostenlose Web Accessibility Academy-Lektion auf CoddyKit. Dies ist Lektion 1 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Web Accessibility Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Web Accessibility Academy-Kurs umfasst insgesamt 4 Lektionen.

Der Seitentitel, den Sie hören

Das h1 ist die Überschrift Ihrer Seite. Nutzerinnen und Nutzer von Screenreadern springen oft direkt dorthin, um herauszufinden, worum es auf dieser Seite eigentlich geht. 🔎

Ein Hauptthema

Eine Seite behandelt ein Hauptthema und erhält daher genau ein h1. Stellen Sie es sich als Titel auf einem Buchcover vor, nicht als Kapitelüberschrift.

<h1>Your Order Summary</h1>

h1 hat nichts mit der Größe zu tun

Wählen Sie h1 nach seiner Bedeutung, niemals danach, ob es groß aussieht. Wenn Sie kleineren Text möchten, gestalten Sie ihn mit CSS und behalten Sie die korrekte Überschriftenebene bei.

Es benennt, statt zu dekorieren

Ein gutes h1 beschreibt den darunterstehenden Inhalt. Wenn man nur das h1 liest, sollte man ungefähr erkennen, was man auf dieser Seite findet.

An den Tabtitel anpassen

Ihr h1 sollte den Titel des Browser-Tabs widerspiegeln. Wenn beide übereinstimmen, sind sich Nutzerinnen und Nutzer sicher, auf der richtigen Seite gelandet zu sein.

<title>Your Order Summary - Shop</title>
<h1>Your Order Summary</h1>

Nicht das Logo

Der Name Ihrer Website in der Ecke ist normalerweise nicht das Thema der Seite. Das h1 gehört zum Inhalt dieser Seite, nicht zu Ihrem Markenlogo. 🏷️

Warum eins und nicht mehrere

Mehrere h1-Tags verwischen die Gliederung, sodass Nutzerinnen und Nutzer das eigentliche Thema nicht von einem Abschnitt unterscheiden können. Eine klare oberste Ebene hält die Seite fokussiert.

Wo es steht

Platzieren Sie das h1 weit oben in Ihrem Hauptinhalt, vor den Abschnitten, die es einführt. Es schafft den Rahmen für alles, was folgt.

<main>
  <h1>Annual Report 2025</h1>
  <h2>Highlights</h2>
</main>

Nie direkt mit h2 beginnen

Wenn eine Seite mit h2 beginnt, fehlt der Gliederung eine Wurzel. Geben Sie der Seite zuerst ihr einzelnes h1 und ordnen Sie die Abschnitte darunter ein.

Ehrlich bleiben

Formulieren Sie das h1 in einfachen Worten, die auch eine fremde Person versteht. Verzichten Sie auf clevere Wortspiele, die verbergen, was die Seite tatsächlich bietet.

Ein leeres h1 ist eine Falle

Ein h1, das nur ein Bild oder Symbol enthält, kann als leer vorgelesen werden. Geben Sie ihm echten Text, auch wenn Sie diesen Text visuell ausblenden.

Kurztest

Wie viele h1-Elemente sollte eine typische Seite enthalten?

Zusammenfassung

Sie haben gelernt, dass das h1 das eine Hauptthema einer Seite benennt, weit oben im Inhalt steht und nach Bedeutung statt nach Größe gewählt wird. Eine Seite, ein h1. ✅

Kostenlos starten

Lerne HTML mit einem KI-Tutor — kostenlos

Schreibe und führe echten Code in deinem Browser aus, bekomme sofortige Hilfe von einem 24/7 KI-Tutor und setze dein Lernen im Web oder in der App fort.

Kurse
30
Lektionen
120

Häufig gestellte Fragen

Ist die Lektion „Pro Seite ein h1: Das Hauptthema benennen“ kostenlos?

Ja — der vollständige Text von „Pro Seite ein h1: Das Hauptthema benennen“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Web Accessibility Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Web Accessibility Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „Pro Seite ein h1: Das Hauptthema benennen“?

Geben Sie jeder Seite genau eine klare Überschrift der obersten Ebene. Du übst Web Accessibility Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um Web Accessibility Academy zu starten?

Keine Vorkenntnisse erforderlich. Web Accessibility Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 1 von 4.

Wie lange dauert die Lektion „Pro Seite ein h1: Das Hauptthema benennen“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser Web Accessibility Academy-Lektion Code schreiben und ausführen?

Ja. Jede Web Accessibility Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

  1. Pro Seite ein h1: Das Hauptthema benennen
  2. Verschachtelungsebenen ohne Überspringen
  3. Überschriften sind Navigation, nicht nur großer Text
  4. Eine Seitengliederung nach Gehör prüfen
← Zurück zu Web Accessibility Academy