Semantik und SEO
Die Algorithmen der Suchmaschinen sind gut gehütete Geheimnisse. In Wahrheit weiss man also nicht, ob und wie sich semantisch korrekt verschachtelte Überschriften auf das Suchmaschinenranking auswirken. Ob eine h1 oder eine h3 mehr zählt. Auf jeden Fall kann eine korrekte Semantik nicht schaden, und zeugt auf jeden Fall von der technischen Qualität einer Website.
Und genau hier liegt das Problem von CMSimple Basic: In der Standard Konfiguration sind h1-h3 für die Erzeugung der Seitenstruktur verantwortlich und für den Besucher nicht sichtbar, h4-h6 strukturieren die einzelnen Seiten. Der Seiteninhalt beginnt also in der Regel mir einer h4, h1-h3 fehlen, wenn sie nicht schon vorher im Template erzeugt werden.
Die Lösung können Sie im Standard Template sehen:
- Der Seitentitel ist eine h1
- Das "Sie sind hier:" ist eine h2
- Der Locator (Breadcrumb Navigation) ist eine h3
- Die Seitenüberschrift ist eine h4
Sinnlos ist nur das "Sie sind hier:" als h2, alle anderen Überschriften sind durchaus SEO-relevant.
Der html Code des Headers incl. Locator:
<header>
<h1 class="tplge_sitename"><a href="./"><?php echo sitename();?></a></h1>
<nav id="tplge_locator" class="tplge_locator">
<h2><span class="tplge_locatorText"><?php echo $tx['locator']['text'];?></span></h2>
<h3><?php echo locator('<span class="tplge_locatorDelimiter">»</span>') . "\n";?></h3>
</nav>
</header>
Der dazugehörige CSS Code:
header {background: #cdc; width: 800px; border-radius: 3px; padding: 10px 12px; margin: 10px auto;}
.tplge_sitename {display: table; background: #ded; font-family: times new roman, serif; color: #60696f; font-size: 48px; line-height: 1em; font-weight: 700; text-align: center; font-style: normal; border-radius: 3px 3px 0 0; padding: 6px 16px 12px 16px; margin: 12px auto 6px auto; transform:rotate(-2deg);}
/* locator */
.tplge_locator {font-family: arial, sans-serif; font-size: 15px; text-align: center; padding: 12px 3%; overflow: hidden;}
.tplge_locator h2, .tplge_locator h3 {display: inline; color: #910; font-family: arial, sans-serif; font-size: 15px; font-weight: 700; font-style: normal; padding-right: 3px;}
.tplge_locatorText {color: #222; font-weight: 700; padding-right: 3px;}
.cmsimpleLocatorElement {white-space: nowrap;}
.cmsimpleLocatorElement a {font-weight: 400;}
.cmsimpleLocatorElementLast {color: #910; font-weight: 700;}
.tplge_locatorDelimiter {color: #222;}
Das Ergebnis sehen Sie oben im Header.
weiter zu:
⇑ ..
