Überschriften in WordPress richtig setzen

Ich wurde heute gefragt, wie man in WordPress das Theme so anpassen kann, dass auf der Startseite der Blogtitel und Untertitel als h1 und h2 und auf allen weiteren Seiten nicht als HTML Überschriften ausgegeben werden.

Warum das wichtig ist? Ganz einfach: Auch wenn Google und die anderen Bots sich bereits auf „kaputte“ WordPress Theme Strukturen eingerichtet haben und ein Blog nicht aus den SERP herben, weil die Struktur falsch ist, ist es doch fraglich, ob eine saubere HTML Struktur nicht doch noch mehr Potezial aus dem Blog herausholt! Ich bin davon überzeugt, dass die Website Struktur einen nicht zu vernachlässigenden Einfluss auf die Rankings der einzelnen Unterseiten hat — also sehr wichtig für die Long-Tail-Keywords ist. Vor allem, weil es sich in jedem WordPress Theme relativ einfach umsetzen lässt. Eine kleine if Abfrage und minimale Veränderungen am CSS reichen vollkommen aus.

wordpress titel richtig setzen
In diesem Beitrag geht es um die rot markierten Elemente eine WordPress Themes, den Blogtitel und den Untertitel. Diese sollten, wenn, dann nur auf der Startseite des Blogs mit HTML Überschriften ausgezeichnet werden.

Überschriften in WordPress richtig setzen

In der Header.php des Themes suchst Du die passende Stelle, an der der Blogtitel und Untertitel mit h1 und h2 ausgezeichnet werden. Dort baust Du eine Abfrage ein:

<?php if( is_home() ) : ?>
	<h1>Blogtitel</h1>
	<h2>Untertitel</h2>
<?php else : ?>
	<span class="h1">Blogtitel</span>
	<span class="h2">Untertitel</span>	
<?php endif; ?>

danach muss noch in der CSS Datei die CSS Klasse .h1 und .h2 hinter die Definition von h1 und h2 anfügen. Also:

h1, .h1{
	...
}
h2, .h2{
	...
}
span.h1, span.h2{
	display:block;
}

Mehr zum Thema Überschriften in Blogs

9 Kommentare » Schreibe einen Kommentar

  1. Ist eine gute Lösung, das Problem zu behandeln, allerdings setze ich lieber auf jeweils eigene Header in den jeweiligen Templates, da hier eine Menge an Optimierungspotenzial bezüglich des Pagespeed besteht.

    Grüße Steven

  2. Hi Viktor,

    ich war gerade in meiner header.php unterwegs und habe gesehen, dass ich es gar nicht über is_home gelöst habe (also anders, als auf G+ behauptet). Ich nutze is_front_page: http://codex.wordpress.org/Function_Reference/is_front_page

    Das hat den Vorteil, dass es auch funktioniert, wenn die Homepage eine statische Seite ist. Ist in sofern eventuell flexibler. Erfüllt letztendlich aber den selben Zweck, wollte es nur anmerken. Vielleicht hilft es ja einem Leser, der diesen Artikel findet :-)

  3. Ist denn eine Auszeichnung mittels span-Tag so viel besser bzw. ist das eine saubere HTML-Struktur? Die H1 und H2-Tags sind aus meiner Sicht semantisch korrekter. Ausserdem giibt es noch hgroup was ich verwenden würde.

  4. >>Die H1 und H2-Tags sind aus meiner Sicht semantisch korrekter.
    Ich bin ganz Ohr, erkläre es bitte genauer…

  5. Blogtitel und Beschreibung sind doch Überschriften, und können auch als solche gekennzeichnet werden.

  6. Sofern wir über HTML < 5 sprechen ist es dem eben nicht so. Bis in HTML 4.xx galt nämlich: eine einzelne Seite hat eine einzige unique H1 Überschrift. Das geht nur, wenn man alle Seiten einer Webseite einzeln betrachtet und dort entscheidet, was der Titel ist.

    Das kann man übrigens imemr noch gut an Content Scrapern wie rivva, zite, prismatic und Co. erkennen. Werden nämlich Seiten doirt aufgenommen, die ein h1 sitewide nutzen, so erscheint jeder Beitrag der Seite dort unter dem sitetitle und nicht mit der eigentlichen Überschrift!
    Ziemlich doof für die Leser. Ganz mal von Google abgesehen.

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.