Perfekt gegliederte Texte – mit passenden Überschriften, Sinnabschnitten und im besten Fall auflockernden Elementen – sind ein wahrer Traum für Userinnen und User sowie für Suchmaschinen. Übersichtliche Strukturierungen erleichtern es dabei sowohl Mensch als auch Maschine den Inhalt schnell zu erfassen. Im Mittelpunkt einer guten Gliederung und dem richtigen Aufbau eines Textes stehen dabei die Überschriften. Was es damit auf sich hat und was du bei der Arbeit mit H1, H2, H3 und anderen Überschriften beachten solltest, erfährst du im Folgenden!
HTML als Grundlage einer jeden Überschrift im Web
Warum werden Überschriften mit „H1“, „H2“ oder anderen Kombinationen des Buchstaben Hs und einer Zahl abgekürzt? Ganz einfach: Websitetexte werden meist durch die sogenannte Hx-Deklaration gekennzeichnet, um vor allem Suchmaschinen und Screenreadern Anhaltspunkte zu liefern, welches Thema im Text behandelt wird. Bei der Hx-Deklaration handelt es sich um HTML-Tags, die im Quellcode hinterlegt werden und damit den Überschriften einen Platz in der Hierarchie zuweisen. Dabei ist H1 die wichtigste, H6 die am wenigsten wichtigste Überschrifteinheit.
Technisch wird es dabei wie folgt gelöst: Jeder HTML-Tag besteht aus zwei Bausteinen, der den Inhalt des Tags umschließt – bei einer H1 sähe dies wie folgt aus:
<h1>Hier steht die Überschrift</h1>.
Wichtig dabei ist immer die richtige Kombination von einem öffnenden <h1> und einem schließenden </h1>. In dieser Form lassen sich alle Überschriften aus technischer Sicht umsetzen. Doch welche Überschriften gibt es genau und wofür dienen diese?
Die Überschriften und ihre Funktionen im Überblick
Die H1: Diese ist die Hauptüberschrift einer Seite und beinhaltet im besten Falle jeweils die Hauptaussage oder das Hauptthema, welche sie von anderen Seiten abgrenzt. Deine gewählte H1 sollte das Hauptkeyword der Seite enthalten. Außerdem sollte es die H1 in der Regel nur einmal auf jeder Unterseite geben: Nicht nur für die Suchmaschine, sondern vor allem für die bessere Orientierung des Nutzers und Strukturierung der Seiteninhalte.
H2-H6: Um eine gute Lesbarkeit zu gewährleisten und dem Nutzer die beste Orientierung zu geben, eignen sich H2- bis H6-Überschriften. Diese unterscheiden sich häufig in Größe und Aussehen (Farbe, Schriftart etc.), aber auch in der Relevanz. Wichtigere Inhalte (vor allem Keywords) solltest du deshalb in H2-Überschriften einbauen, weniger Relevantes in den darunter geordneten Überschriften.
Auf einen Blick:
- Die H1 umfasst die Hauptaussage der Seite und ist am besten nur einmal vorhanden. Sie enthält das Hauptkeyword.
- H2- bis H6-Überschriften dienen der schnellen Orientierung des Lesers und strukturieren die Relevanz der Inhalte. Sie enthalten Nebenkeywords.
Was bedeutet die H1-Überschrift für Google?
Hauptsächlich geht es bei einer H1 darum, den Userinnen und Usern zu signalisieren, was für Content sie auf der aufgerufenen Seite zu erwarten haben. Auch für Suchmaschinen sind H1-Überschriften ein wichtiges Signal, um die jeweiligen Seiten zu kategorisieren. Die Aussage vom Google Webanalyst John Mueller dazu ist folgende:
[W]hen it comes to text on a page, a heading is a really strong signal telling us this part of the page is about this topic.”
Daraus lässt sich schließen: Auch Google orientiert sich bei der Einordnung der Seite in Themenbereiche an den Informationen, die die H1 über die jeweilige Seite verrät.
In dem folgenden Video gibt John Mueller weitere Einblicke, wie Google mit den gegebenen Überschriften arbeitet (ab 38:00 Min):
Ein kleiner Exkurs: Von Passage Ranking und dem Title-Update
Überschriften sind ein wichtiges Signal für Google – entscheiden aber nicht ausschlaggebend, ob eine Seite zu einem bestimmten Thema ranken kann oder nicht. Mittlerweile gibt es aber weitere Features und Updates von Google, die Anreiz für dich sein können, vermehrt die Struktur und Gliederung der eigenen Inhalte anhand von passenden Überschriften in den Fokus zu rücken: Nämlich das Passage Ranking und das Title Update.
Das Google Passage Ranking wurde bereits 2020 von Google angekündigt – und sollte Nutzerinnen und Nutzer dabei unterstützen, passende Textpassagen für sehr präzise Suchanfragen ohne größere Mühen zu finden. Passage Ranking analysiert und interpretiert also nicht mehr nur ganze Seiten, sondern auch einzelne Textpassagen und einzelne Sätze. Passage Ranking ist demnach eine automatische Funktion, die Textpassagen treffsicher herausfiltern kann – so können Textabschnitte passend zur Suchanfrage gefunden werden, die vielleicht in einem größeren, weniger passenden Kontext auf einer Website aufgehangen sind. Dadurch können Seiten mit viel und ggf. auch komplexerem Content einen Aufschwung erleben. Mit passenden Überschriften und einer guten Gliederung und Struktur kannst du es dabei der Suchmaschine einfacher machen, einzelne Themenkomplexe auch in größeren Kontexten ausfindig zu machen.
Das Google Title Update hingegen bezog sich – wie der Name bereits verrät – auf die Darstellung und Wahl von Titles in den Suchergebnissen. Bereits Mitte 2021 wurde häufiger beobachtet, dass vermehrt H1-Überschriften statt den separat in den Meta-Daten mitgegebenen Titles als eben solches in den Suchergebnissen ausgespielt wurde. Google greift also auf andere Elemente der Seite zu, um einen Title zu generieren: Dazu zählen die Überschriften, aber auch andere Textpassagen, die beim Styling hervorgehoben wurden.
H1 & Co.: die Bedeutung von Keywords in den Überschriften
Die H1: Für jede existierende Seite einer Website, die einen Rankinganspruch verfolgt, sollte es ein Hauptkeyword geben, auf das der Content ausgerichtet ist. Dieses sollte auch unbedingt in der H1 vorhanden sein, ohne die Lesbarkeit zu beinträchtigen.
Beispiel für das Keyword „gesichtscreme kaufen rabatt“:
Schlechte Lesbarkeit durch Keyword: Gesichtscreme kaufen Rabatt
Die bessere Variante: Gesichtscreme kaufen: Rabatte und Preisvorteile sichern!
H2-H6: Auch die Unterüberschriften sollten Keyword-optimiert sein. Hier lassen sich am besten weitere passende Keywords unterbringen, die für den Themenkomplex relevant sind. An welche Stelle diese eingebunden werden (am Anfang oder Ende des Textes etc.) spielt dabei keine ausschlaggebende Rolle.
Auf einen Blick:
- In der H1 sollte unbedingt das Hauptkeyword der Seite vorkommen.
- Weitere für den Themenkomplex wichtige Keywords können in den untergeordneten Überschriften eingebunden werden.
SEO-Überschriften: Tipps zum Inhalt für Nutzer und Suchmaschinen
Die H1: Durch die H1 sollte der Userin oder dem User unmittelbar klar sein, ob die Seite seiner oder ihrer Suchintention entspricht. Werden hier Produkte verkauft oder handelt es sich um einen Ratgeber? Kann sie oder er hier das kaufen oder erfahren, wonach gesucht wurde? Leserinnen und Leser sollen möglichst schnell erkennen, ob sie sich auf der richtigen Seite befinden und die eigene Intention bedient wird.
H2-H6: Auch bei weiteren Überschriften gilt, dass die schnelle Lesbarkeit im Vordergrund steht. Viele Nutzerinnen und Nutzer nehmen sich immer weniger Zeit und analysieren anhand der Überschriften, welcher Bereich einer Website/eines Websitetextes für sie relevant sind und skippen große Teile der Website-Texte.
Auf einen Blick:
- Überschriften (H1-H6) sollten Nutzerinnen und Nutzer direkt abholen und offensichtlich die Intention bedienen.
Gibt es die perfekte Länge einer H1? Überschriften optimieren
H1: Hier gibt es viele unterschiedliche Angaben. Grundsätzlich gilt eine maximale Länge von 80 Zeichen, die nicht überschritten werden sollte. Oftmals gibt es die Empfehlung, eine Länge von 20 bis 70 Zeichen anzustreben. Wichtiger als eine pauschale Länge ist aber das Abbilden des Themenkomplexes, der auf der Seite behandelt wird. Wichtige Keywords sollten – vor allem bei längeren H1-Überschriften – deshalb weit vorne stehen.
H2-H6: Auch bei den weiteren Überschriften in deinem Text solltest du weniger nach strikter Zeichenanzahl entscheiden, sondern diese von dem Inhalt abhängig machen. Dabei zahlt es sich aber auch für die Nutzerinnen und Nutzer aus, wenn du sie kurz hältst. So lässt sich der Inhalt eines Absatzes schon nach kurzem Scannen der Überschrift leicht erkennen und Userinnen und User können sich schnell und einfach orientieren.
Auf einen Blick:
- Die pauschal perfekte Länge gibt es nicht. Allgemeine Empfehlungen lauten: 20 bis 70 Zeichen, maximal 80 Zeichen.
- Je weiter vorne das Keyword steht, umso sicherer ist es, dass es sowohl von Mensch als auch Maschine wahrgenommen wird.
Technische Details von H1 und anderen Überschriften
Die H1: Diese gilt als Titel einer Seite, die mit dem H1-Tag ausgezeichnet wird. Meistens wird in diesem Zusammenhang CSS (Cascading Style Sheets) verwendet, um den H1-Tag hervorzuheben. Ebenso kann das Contentmanagement oder ein Template für die optische Darstellung der jeweiligen Tags sorgen.
Grundsätzlich lassen sich H1-Überschriften in den meisten Fällen im genutzten CMS einfach bestimmen. Andernfalls hilft auch eine einfach HTML-Auszeichnung: <h1> Hier steht die H1</h1>
Styling der H1: Überschriften, die mit dem richtigen Look überzeugen
Wichtig ist dabei, dass mit der HTML-Auszeichnung oder der CSS-Gestaltung eine optische Hervorhebung einhergeht. H1-Überschriften sollten gut lesbar sowie auffällig gestaltet sein, damit sie auf den ersten Blick erkennbar sind und dem Leser als erstes auffallen.
Beispiel:
Lesbare, auffällige und im Corporate-Design hinterlegte H1:
H1, die sich nicht abhebt und sich damit nicht als erster Blickfang eignet:
Auf einen Blick:
- H1-Überschriften sollten gut lesbar sowie auffällig gestaltet sein, um den Leser direkt beim ersten Blick auf die Seite abzuholen.
Platzierung der H1: Überschrift im Fokus
Damit die H1 beim Öffnen der Seite direkt ins Auge springt, sollte diese unbedingt above the fold platziert werden. Above the fold bezeichnet dabei den Bereich, der für dich auf den ersten Blick sichtbar ist, ohne dass du scrollen musst. Dabei kann diese auch innerhalb des Keyvisuals der Seite untergebracht sein – wichtig dabei ist nur, dass es sich hierbei nicht um einen Text im Bild handelt, sondern die Überschrift als Textmodul für Google wahrzunehmen ist und mit dem H1-Tag ausgezeichnet ist.
Auf einen Blick:
- Die H1 sollte ohne weiteres Scrollen direkt für die Nutzerinnen und Nutzer sichtbar sein.
- Die H1 darf sich im Keyvisual befinden, aber nur als Textelement, das mit dem H1-Tag gekennzeichnet ist.
Barrierefreiheit durch H1-Tags
Wenn es um die barrierefreie Gestaltung einer Website geht, spielt die H1 eine zentrale Rolle. Blinde, Sehbehinderte oder anders eingeschränkte Nutzerinnen und Nutzer benutzen häufig Software wie Screen Reader, um Inhalte einer Website zu erschließen. Ist ein Bild oder eine nicht aussagekräftige Headline hinterlegt, fällt es den Nutzerinnen und Nutzern schwer, sich zu orientieren und abzuwägen, ob die aufgerufene Seite die Intention hinter dem Aufruf bedient.
Auf einen Blick:
- Um eine barrierefreie Website zu garantieren, hilft eine richtig ausgezeichnete, sprechende und beschreibende H1, die auch bei Benutzung von Screen Reader zur schnellen Orientierung dient.
Wozu sind H-Tags NICHT geeignet?
Ab und an kommt es vor, dass auf einzelnen Seiten mehrere H1-Tags zu finden sind – das kann unter anderem mit der „Bequemlichkeit“ von Programmierenden zutun haben. Oft werden H-Tags, bei denen ein gewisses Styling – darunter fallen beispielsweise die Ausrichtung, Schriftgröße und -farbe – hinterlegt ist, eben aus Styling-Gründen genutzt, obwohl der dadurch gekennzeichnete Text gar kein Anspruch auf die Auszeichnung als Überschrift hat.
Das lässt sich meist recht schnell und unkompliziert prüfen: Entweder schaust du im Quellcode der jeweiligen URL nach oder gibst diese einfach in ein passendes Tool wie folgende ein:
- https://www.seoreviewtools.com/
- https://ahrefs.com/de/seo-toolbar
- https://chrispederick.com/work/web-developer/
Grundsätzlich kommt es nicht zu Abstrafungen von Seiten Google nur durch zu viele H-Tags – doch du solltest dir bewusst sein, dass sehr viele H-Tags die Gewichtung eines jeden einzelnen Tags schmälern können. John Mueller von Google twitterte 2021 dazu:
Some pages have multiple headings, that’s fine. It’s great for accessibility, it helps Search better understand pages. Be reasonable: if everything’s a heading, nothing is.
Sei also gewissenhaft und zeichne nur das als Überschrift aus, dass den Userinnen und Usern sowie der Suchmaschine passende Anhaltspunkte zum Inhalt deines Website-Textes gibt.
Auf einen Blick:
- H-Tags eignen sich nicht als Styling-Elemente. Ihr Einsatz sollte von ihrem Inhalt und ihrer Sinnhaftigkeit abhängen.
Do’s und Dont’s bei der Verwendung von H-Überschriften
Do’s
- Überschriften-Tags für wichtige Textstellen nutzen
- Überschriften-Tags als strukturstiftende Einheit nutzen und daraus eine sinnvolle Gliederung ableiten
- Überschriften-Tags sparsam einsetzen
Dont’s
- Überschriften-Tags für Textstellen nutzen, die keinen Mehrwert für Seitenstruktur und -inhalt haben
- Zu lange Textstellen als Überschrift kennzeichnen
- Verwendung von Überschriften-Tags als reines Styling-Element
Vorteile einer korrekten H1 auf einen Blick:
- Verbesserung des Inputs für Google und andere Suchmaschinen zum Verstehen der Seite und damit der Rankingchancen
- Verbesserung der User Experience durch richtige Strukturierung und Informationsgehalt
- Verbesserung der Barrierefreiheit, wenn Screenreader im Einsatz sind
(8 votes, average: 3,50 out of 5)
Loading...
0511 - 923 999 0
kontakt@aufgesang.de
Bürozeiten: 08:00 bis 17:00 Uhr
und loslegen