Überschriften in WordPress – Funktion geht vor Format
Zuletzt aktualisiert am 16. September 2019 um 08:35 Uhr
Stellen Sie sich vor, Sie schlagen ein Fachbuch auf und werfen einen Blick in das Inhaltsverzeichnis um sich einen Überblick darüber zu verschaffen, worum es in diesem Buch ganz konkret geht.
Und dann schaut das Inhaltverzeichnis ungefähr so aus:
Buchtitel: Nicht vorhanden
Kapitel 1: Nicht vorhanden
Kapitel 1.1: „Tipps für Einsteiger“
Kapitel 2: Nicht vorhanden
Kapitel 2.1: Nicht vorhanden
Kapitel 2.1.1: Heute unbedingt noch anschauen! Das finden Sie so nicht wieder.
…..
Ein wenig verwirrend, oder? Wüssten Sie anhand dieses Inhaltsverzeichnisses, worum es in dem Buch geht? Würden Sie dieses Buch kaufen?
So oder so ähnlich geht es Suchmaschinen wie Google oft, wenn sie eine Seite oder einen Beitrag sichten. Suchmaschinen versuchen, ähnlich wie menschliche Leser bei einem Buch, sich anhand der Überschriftenstruktur ein Bild davon zu machen worum es auf dieser Seite oder in diesem konkreten Blogartikel geht.
Inhaltsverzeichnis
Überschriften dienen der Strukturierung, nicht der Formatierung
Leider verwenden viele Blogger und Website-Betreiber die Überschriften-Hierarchien die WordPress im Editor anbietet (Überschriften 1 – 6) nicht analog Ihrer Bedeutung im Text, sondern ausschließlich aufgrund der gerade passenden Formatierung.
Man benötigt zur Hervorhebung einen Textabschnitt der eine etwas größere Schriftart verwendet als der normale Fließtext und fett hervorgehoben ist? Super – Da passt die Überschrift 4 doch ganz genau.
Und die Überschrift 2 ist doch ein wenig zu groß, das sieht optisch nicht so ansprechend aus? Dann verwendet man lieber die Überschrift 3, die ist etwas dezenter.
Was dann optisch auf der Website recht ansprechend aussehen mag ist für die Suchmaschine dann aber ein ziemliches Durcheinander an Informationen – Ähnlich meines fiktiven Inhaltsverzeichnisses vom Beginn dieses Blogbeitrages.
Korrekte Anwendung der Überschriften
Korrekterweise sollten Sie Überschriften auf Ihrer Website daher wie folgt verwenden:
Überschrift 1
Das ist der Seitentitel, also die Überschrift. Diese Überschrift wird von WordPress automatisch für die Überschrift der Seite bzw. des Beitrages vergeben.
Um bei meiner Analogie mit dem Buch zu bleiben: Die Überschrift 1 entspricht dem Buchtitel und sollte daher für jede Seite und für jeden Blogbeitrag nur ein einziges Mal verwendet werden.
Für diesen Beitrag ist die Überschrift 1: „Überschriften in WordPress – Funktion geht vor Format“
Überschrift 2
Die Überschriften mit der Hierarchiestufe 2 entsprechen den Kapitel-Überschriften in einem Buch.
Die erste Überschrift in der Seite bzw. im Blogbeitrag ist daher immer eine H2-Überschrift.
In diesem Beitrag sind die folgenden Überschriften als Überschriften 2. Ordnung ausgezeichnet: „Überschriften dienen der Strukturierung, nicht der Formatierung“, „Korrekte Anwendung der Überschriften“ und „So passen Sie die Formatierung der Überschriften Ihren Vorstellungen an“
Überschrift 3
Diese Überschriften dienen als Einschub innerhalb eines Kapitels. Man verwendet sie wenn man innerhalb eines Kapitels einen weiteren, thematisch passenden Einschub einfügt, der aber kein eigenständiges Kapitel ist. In einem Fachbuch würden Sie also einem Kapitel 1.1.1 entsprechen.
In diesem Beitrag sind die folgenden Überschriften mit Überschriften 3. Ordnung ausgezeichnet: „Überschrift 1“, „Überschrift 2“, „Überschrift 3“ und „Überschrift 4 – 6“.
Überschrift 4 – 6
Die Überschriften 4 – 6 kommen nach meiner persönlichen Erfahrung so gut wie nie zur Anwendung. Sie würden Sinn machen, wenn man innerhalb eines Unterkapitels noch ein Unterkapitel einfügt.
Um beim Fachbuch zu bleiben: Eine Überschrift 4. Ordnung wäre ein Kapitel 1.1.1.1
In diesem Beitrag hier gibt es keine Überschriften 4. bis 6. Ordnung, weil ich den Beitrag nicht so tief verschachtelt habe.
Das Inhaltsverzeichnis dieses Blogbeitrages liest sich also wie folgt:
Titel: „Überschriften in WordPress – Funktion geht vor Format“
Kapitel 1: „Überschriften dienen der Strukturierung, nicht der Formatierung“
Kapitel 2: „Korrekte Anwendung der Überschriften“
Kapitel 2.1: Überschrift 1
Kapitel 2.2: Überschrift 2
Kapitel 2.3: Überschrift 3
Kapitel 2.4: Überschriften 4 – 6
Kapitel 3: So passen Sie die Formatierung der Überschriften Ihren Vorstellungen an
Vielleicht ist das nach wissenschaftlichen Anforderungen auch noch ein wenig sehr simpel, aber es wird doch anhand der Überschriften sehr viel verständlicher als das Kauderwelsch-Inhaltsverzeichnis am Beginn 🙂
So passen Sie die Formatierung der Überschriften Ihren Vorstellungen an
Ich kann die Beweggründe gut nachvollziehen die dazu führen dass man als Einsteiger dazu neigt, die Überschrift auszuwählen die optisch am besten passt. Gerade wenn das verwendete Theme nicht die Funktion bietet die Überschriften den eigenen Anforderungen anzupassen kann es frustrierend sein wenn die korrekte Überschriften-Hierarchie so gar nicht den eigenen Vorstellungen an Design und Ästhetik entspricht.
Daher hier ein kleiner Crash-Kurs in die Anpassungsmöglichkeiten per CSS. Wenn Sie ein Child-Theme verwenden (und nur dann!) können Sie die folgenden Angaben direkt in die style.css Ihres Themes schreiben. Wenn Ihr Theme die Möglichkeit bietet eine Custom CSS erfassen tragen Sie die folgenden Regeln dort ein.
Alternativ können Sie auch das Plugin „Simple Custom CSS“ installieren und die Anpassungen dann unter „Design“ – „CSS anpassen“ schreiben.
/* Überschriften formatieren */ h1, h2, h3, h4, h5 {font-family: Arial, Helvetica, sans-serif;} h1 {font-size: 32px; color: red;} h2 {font-size: 28px; color: blue;} h3 {font-size: 24px; color: green;}
Zur Erläuterung:
font-family -> Definiert die Schriftart in der die Überschriften angezeigt werden sollen. Die erste angegebene Schriftart (Arial) wird standardmäßig verwendet. Wenn diese Schriftart auf dem Rechner des Lesers nicht verfügbar ist dann weicht das System auf die zweite Schriftart aus (Helvetica) und wenn auch diese Schriftart nicht vorhanden ist dann wird eine beliebige serifenlose Schrift (sans-serif) verwendet.
font-size -> Definiert die Schriftgröße. Je größer der Pixelwert desto größer die Schrift
color -> Definiert die Schriftfarbe. Die klassischen Farben können als Klarname angegeben werden, Sie können den Farbwert aber auch als Hexwert angeben (z.B. #ff000;}
Fazit
Eine ordentliche Überschriften-Struktur ist nicht nur in Büchern, sondern auch für eine Website wichtig, damit die Leser ebenso wie die Suchmaschinen auf einen Blick erkennen können worum es geht.
Wenn Ihnen dieser Beitrag gefallen hat dann freue ich mich wenn Sie ihn in Ihrem Netzwerk teilen.
Haben Sie noch Fragen hierzu? Dann stellen Sie diese gern in den Kommentaren.
Bildquelle:
©tashatuvango – Fotolia.de