Ein Heading-Tag ist ein HTML-Element, das eine Überschrift auf einer Webseite kennzeichnet. Es gibt sechs Stufen, von <h1> (wichtigste Überschrift) bis <h6> (unwichtigste Überschrift), die den Inhalt einer Seite hierarchisch gliedern. Suchmaschinen, Screenreader und Browser nutzen Heading-Tags, um die Struktur und die Kernthemen einer Seite zu erkennen.
Aufbau und Hierarchie
Heading-Tags funktionieren wie ein Inhaltsverzeichnis, das direkt im Quellcode der Seite steckt. Die <h1> steht für die Hauptüberschrift, meistens der Titel des Artikels oder der Seite. Darunter gliedern <h2>-Tags die wichtigsten Unterthemen, <h3>-Tags die jeweiligen Unterpunkte davon, und so weiter bis zur <h6>. Ein Beispiel: Auf dieser Lexikonseite wäre „Heading-Tag“ die <h1>, „Aufbau und Hierarchie“ eine <h2> und ein möglicher Unterpunkt dazu eine <h3>.
Wichtig dabei: Die Reihenfolge sollte logisch bleiben. Von einer <h1> direkt zu einer <h3> zu springen und die <h2> auszulassen, gilt als schlechter Stil, weil dadurch die Gliederung unklar wird. In der Praxis werden <h4> bis <h6> nur selten gebraucht — die meisten Webseiten kommen mit <h1> bis <h3> aus.
Geschichte und technischer Hintergrund
Die sechs Heading-Elemente gehören zu den ältesten Bestandteilen von HTML. Bereits in RFC 1866, der Spezifikation für HTML 2.0 aus dem Jahr 1995, waren <h1> bis <h6> als Elemente für Abschnittsüberschriften definiert. Damals wurde bereits festgehalten, dass Dokumente keine Ebenen überspringen sollten. Seither hat sich an der grundsätzlichen Funktion wenig geändert, auch wenn die technische Definition mit HTML5 präzisiert wurde: Der WHATWG, die Organisation hinter dem aktuellen HTML-Standard, beschreibt Heading-Tags heute über das Konzept der „Heading Level“, die zusammen die sogenannte Gliederung (Outline) eines Dokuments bilden.
Standardmäßig weisen Browser jeder Heading-Ebene eine eigene Schriftgröße zu: <h1> erscheint am größten und fett, <h6> am kleinsten. Diese optische Gestaltung ist aber nur ein Nebeneffekt. Heading-Tags sollten nie verwendet werden, nur um Text größer oder fett darzustellen — dafür ist CSS zuständig. Wer eine Überschrift nur optisch braucht, aber inhaltlich keine neue Sektion beginnt, verwendet besser reguläres CSS-Styling statt eines Heading-Tags.
Bedeutung für Barrierefreiheit
Heading-Tags sind ein zentrales Werkzeug für die Barrierefreiheit (Accessibility) von Webseiten. Screenreader-Software, die blinden oder sehbehinderten Menschen Inhalte vorliest, kündigt jede Überschrift mit ihrer Ebene an — etwa „Überschrift Ebene zwei“ bei einer <h2>. Nutzer können damit gezielt zwischen Abschnitten springen, ähnlich wie beim Blättern in einem Inhaltsverzeichnis. Laut der WebAIM Screen Reader User Survey navigiert ein Großteil der Screenreader-Nutzer aktiv über die Sprünge zwischen Heading-Tags durch eine Seite. Eine unsaubere Überschriften-Struktur erschwert diesen Nutzern also die Bedienung der Seite konkret.
Bedeutung für SEO
Für Suchmaschinen liefern Heading-Tags wichtige Hinweise darauf, worum es auf einer Seite geht und wie der Inhalt gegliedert ist. Die <h1> gilt traditionell als stärkstes Signal für das Hauptthema einer Seite, <h2>-Tags markieren die wichtigsten Unterthemen.
Ein oft diskutiertes Thema ist die Frage, ob eine Seite nur eine einzige <h1> haben darf. John Mueller, Search Advocate bei Google, hat dazu mehrfach öffentlich Stellung genommen: Googles Systeme haben demnach kein Problem mit mehreren <h1>-Tags auf einer Seite, das sei ein gängiges Muster im Web. Eine Seite ranke laut Mueller auch ganz ohne <h1> oder mit fünf <h1>-Tags problemlos. Trotzdem gilt eine einzige, klare <h1> pro Seite als bewährte Praxis, weil sie für Nutzer, Screenreader und viele SEO-Analyse-Tools wie Screaming Frog oder Ahrefs eine eindeutige Struktur schafft. Diese Tools markieren mehrere <h1>-Tags oft weiterhin als Fehler, obwohl Google selbst damit kein Problem hat.
Wichtig ist außerdem, den <h1>-Tag nicht mit dem Title-Tag zu verwechseln. Der Title-Tag steht im unsichtbaren <head>-Bereich einer Seite und erscheint als klickbarer blauer Titel in den Google-Suchergebnissen. Die <h1> dagegen steht im sichtbaren Bereich der Seite und ist die erste Überschrift, die ein Besucher sieht. Beide können denselben Inhalt haben, müssen es aber nicht — der Title-Tag ist eher auf Klicks in der Suche ausgerichtet, die <h1> auf die Gliederung des Seiteninhalts.
Häufige Fragen
Wie viele H1-Tags darf eine Seite haben?
Laut Google-Mitarbeiter John Mueller haben Googles Systeme kein Problem mit mehreren H1-Tags auf einer Seite. Trotzdem gilt eine einzige, klare H1 pro Seite als bewährte Praxis für Nutzerfreundlichkeit und Barrierefreiheit.
Was ist der Unterschied zwischen Title-Tag und H1-Tag?
Der Title-Tag steht im unsichtbaren head-Bereich einer Seite und erscheint als Titel in den Google-Suchergebnissen. Die H1 steht im sichtbaren Seiteninhalt und ist die erste Überschrift, die Besucher sehen.
Darf man Heading-Ebenen überspringen, zum Beispiel von H1 direkt zu H3?
Nein, das gilt als schlechter Stil. Schon die ursprüngliche HTML-Spezifikation aus 1995 empfiehlt, Heading-Ebenen nicht zu überspringen, damit die Struktur für Nutzer, Screenreader und Suchmaschinen klar bleibt.
