Freiheit für <h1>!

Oft genug wird als unanfechtbare Wahrheit kolportiert, dass mehrere h1-Tags auf einer HTML-Seite das mühsam erarbeitete Suchmaschinenranking unweigerlich auf ein hoffnungslos niedriges Niveau befördern werden. Tatsächlich handelt es sich hierbei mehr um eine Legende denn um ein von Google und anderen Suchmaschinen in Stein gemeißeltes Gesetz.

Ein Blick in die Vergangenheit zeigt, dass sich alle allzu simplen Rezepte für die Suchmaschinenoptimierung entweder als Unfug von Anfang an herausstellten, oder spätestens dann völlig nutzlos wurden, als das ganze Web sie mechanisch befolgte. Wie war das noch mit dem Meta-Tag "keywords", für dessen möglichst akkurate und geistreiche Befüllung ganze Tage verwendet und Billionen von Hirnzellen verbrannt wurden?

Hintergrund

Über die HTML-Heading-Elemente kursieren eine Menge reichlich dubioser Informationen in der SEO-Szene. Grund genug, die Sache etwas näher zu betrachten.

Überschriften im HTML-Standard

Was sagt der aktuelle HTML-Standard über Überschriften und Abschnitte?

The h1–h6 elements are headings.

The first element of heading content in an element of sectioning content represents the heading for that section. Subsequent headings of equal or higher rank start new (implied) sections, headings of lower rank start implied subsections that are part of the previous one. In both cases, the element represents the heading of the implied section.

...

Sections may contain headings of any rank, and authors are strongly encouraged to use headings of the appropriate rank for the section's nesting level.

Mit keiner Silbe wird dort erwähnt, dass mehrere h1-Elemente irgendetwas Schlechtes bedeuten. Das h1-Element zeichnet einfach nur Überschriften aus, zufälligerweise solche der obersten Gliederungsebene.

Traditionelle Semantik von Überschriften

Eine der ersten Regeln, die an der Universität für die Anfertigung wissenschaftlicher Texte vermittelt wird, ist "wer A sagt muss auch B sagen". Falsch ist demnach eine Gliederung wie die folgende:

  1. On-Page SEO
  2. Off-Page SEO
  3. Andere Maßnahmen
    1. Soziale Medien

In der akademischen Welt gilt dies als Schnitzer. Überschriften und Abschnitte dienen der Untergliederung von Texten, also der Aufteilung in Sinnabschnitte, und eine Aufteilung setzt zwingend das Vorhandensein von mindestens zwei Überschriften/Abschnitten pro Verschachtelungsebene voraus. Wenn es einen Abschnitt 3.1 "Soziale Medien" gibt, muss diesem ein Abschnitt 3.2 folgen.

H1 Versus Title

Ist es also grundsätzlich falsch, nur ein h1-Element pro Seite zu haben? Nein, das auch nicht. Andere Dokumentenformate wie DocBook oder TeX strukturieren mit dedizierten Elementen zum Beispiel "part", "chapter", "section" und so weiter). Außerdem wird die Titelei von Dokumenten in der Regel bei der Darstellung des Textes mitgerendert.

Bei HTML sieht das anders aus. Die Titelei (nämlich das head-Element) wird normalerweise nicht gerendert. Und da das Element title Teil des head-Elements ist, wird der Titel in der Darstellung kaum wahrgenommen. Für grafische Browser wurde er früher in der Titelleiste des Browserfensters angezeigt. Mit dem Aufkommen von Browser-Tabs wurde er jedoch in die jeweiligen Reiter der Tabs verbannt, wo er aufgrund der Begrenztheit des zur Verfügung stehenden Raums nur fragmentarisch sichtbar ist.

Es hat sich deshalb eingebürgert, den Dokumententitel im body innerhalb eines h1-Elements am Seitenanfang zu wiederholen. Weil aber ein Text nur einen Titel haben kann, ist es demnach falsch, mehrere h1-Elemente auf der gleichen Seite zu haben. Strenggenommen handelt es sich hierbei um einen Kompromiss zwischen Korrektheit und den Unzulänglichkeiten des Mediums.

Gliederung von HTML5-Dokumenten mit <section>

In HTML5 wurde das Element section eingeführt, das eine bessere Textgliederung erlaubt. Der Anblick des folgenden Anwendungsbeispiels wird wahrscheinlich bei vielen selbsternannten SEO-Gurus Brechreiz auslösen:

<!DOCTYPE html>
<html>
  <head>
    <title>Acme Corp.</title>
  </head>
  <body>
    <h1>Acme Corp.</h1>
    <section>
      <h1>Mission</h1>
      <p>Free the &lt;h1&gt;!</p>
    </section>
    <section>
      <h1>Staff</h1>
      <section>
        <h1>Tom</h1>
      </section>
      <section>
        <h1>Dick</h1>
      </section>
      <section>
        <h1>Harry</h1>
      </section>
    </section>
  </body>
</html>

OMG! Das darf doch nicht wahr sein! Doch, und es ist sogar vom W3C als korrekt und empfehlenswert abgesegnet. Es entspricht nämlich ziemlich genau einem Beispiel am Ende des betreffenden Abschnitts des HTML-Standards. Die Idee, lediglich h1-Elemente für Überschriften einzusetzen, leuchtet auch auf Anhieb ein. Auf diese Weise lassen sich die einzelnen Abschnitt zwanglos verschieben, ohne das die Verschachtelungstiefe der Überschriften-Elemente angepackt werden muss.

Werfen wir einen Blick auf das obige Beispiel im Browser. Aktuelle Versionen von Firefox, Google (!) Chrome, und Safari rendern das Dokument allesamt wie erwartet, fein säuberlich gegliedert. Soll Google tatsächlich mehrere h1-Elemente pro Seite bestrafen, wenn der firmeneigene Browser sie ohne Murren korrekt interpretiert?

h1 ist wichtiger als h2?

Diese Fehleinschätzung ist vermutlich eine der Hauptgründe hinter dem Ein-H1-pro-Seite-Märchen. Die Ziffer 1-6 im Namen des Überschriften-Elements bezeichnet die Schachtelungstiefe und keineswegs die Bedeutung des Inhalts des Elements. Das lässt sich einfach zeigen:

Die Dokumentation im Mozilla Developer Network hat traumhafte Rankings bei Suchmaschinen. Vergleichen wir die Dokumentation der JavaScript-Objekte `Date` und `Array` fällt auf, dass wie bei fast aller technischer Dokumentation die einzelnen Seiten die gleiche grundsätzliche Struktur aufweisen. Überall gibt es die Abschnitte objects. Like in almost all technical (API) documentation the individual pages share the same overall structure, here the sections "Syntax", "Beschreibung", "Eigenschaften", "Methoden", "Beispiele" und so fort. Die Keywords "Syntax", "Beschreibung", "Eigenschaften", "Methoden" und "Beispiele" haben allerdings null Relevanz und null Bezug zum Inhalt der Seite.

Eines der Beispiel dagegen ist mit "Berechnung vergangener Zeit" betitelt, und dieser Titel ist Inhalt eines h3-Elementes, während hingegen der Abschnittname "Beispiele" mit h2 ausgezeichnet ist. Aber Hand aufs Herz, welche Keywords haben vermutlich die größte Relevanz für Suchmaschinen? "Beispiele" wird eher nicht dazu gehören.

Fazit

"Nur ein h1-Element pro Seite" ist größtenteils Kolportage. Statt daran zu glauben, sollte man die eigenen Texte mit section-Elementen gliedern und – emancipate yourself from mental slavery! – die Überschriften-Elemente nach Gusto und den jeweiligen Bedürfnissen einsetzen. Leider verhallt dieser Appell natürlich völlig ungehört, weil dieses Dokument nur h1-Elemente verwendet, und es deshalb von allen Suchmaschinen einmütig ins World-Wide-Nirvana verbannt wird, schade, schade.

Leave a comment

JSON.stringify() missbrauchen

Tücken von JavaScript `for...in`-Schleifen

Elektronische Rechnungen mit freier und quelloffener Software erzeugen

Dynamische Angular-Konfiguration

ImageMagick für Perl kompilieren

Angular Tour of heroes als Standalone-App

Tags

Diese Website verwendet Cookies und ähnliche Technologien, um gewisse Funktionalität zu ermöglichen, die Benutzbarkeit zu erhöhen und Inhalt entsprechend ihren Interessen zu liefern. Über die technisch notwendigen Cookies hinaus können abhängig von ihrem Zweck Analyse- und Marketing-Cookies zum Einsatz kommen. Sie können ihre Zustimmung zu den vorher erwähnten Cookies erklären, indem sie auf "Zustimmen und weiter" klicken. Hier können sie Detaileinstellungen vornehmen oder ihre Zustimmung - auch teilweise - mit Wirkung für die Zukunft zurücknehmen. Für weitere Informationen lesen sie bitte unsere Datenschutzerklärung.