Wie werden Webseiten-Inhalte richtig struk­tu­riert?

Google möchte in Zukunft keine Such­ma­schi­ne mehr sein. Viel mehr möchten Sie eine Ant­wort­ma­schi­ne werden. Auf jede nur denkbare Frage, soll eine direkte Antwort sofort verfügbar sein.

Diese Ent­wick­lung sieht man sehr deutlich auf den Such­ergeb­nis­sei­ten (SERPs). Schon jetzt enthalten 15% der SERPs Featured Snippets und sogar 40% enthalten Knowledge Panels. Featured Snippets stellen dabei ein einzelnes Such­ergeb­nis besonders prominent mit längerem Text­aus­schnitt und sogar mit Bild dar. Oft werden auch Listen oder Tabellen ein­ge­bun­den.

Wenn Sie bei dieser Ent­wick­lung nicht hinter Ihren Mit­be­wer­bern zurück bleiben wollen, müssen Sie Google er­mög­li­chen Ihre Inhalte nicht nur zu lesen, sondern auch zu verstehen. Denn dies erhöht die Wahr­schein­lich­keit, dass Ihre Seite in den Featured Snippets dar­ge­stellt wird.

Markup ist eine grund­le­gen­de Art, Inhalte zu struk­tu­rie­ren. Eine wichtige Ei­gen­schaft von Markup ist, dass es Ma­schi­nen­les­bar ist. Damit ist es optimal geeignet, dem Google-Bot In­for­ma­tio­nen zu unserem Content mit auf den Weg zu geben.

Markup ist dabei immer eine se­man­ti­sche Aus­zeich­nung. Das heißt: Es geht um die Bedeutung von Elementen, nicht um die Dar­stel­lung. Design und Layout werden getrennt aus­ge­zeich­net. Damit gliedert Markup Texte, un­ab­hän­gig vom Aussehen des Inhaltes.

Da HTML auch eine Markup-Sprache ist (das M in HTML steht für Markup), können wir diese Methode direkt auf jeder Webseite einsetzen. Dadurch entsteht prin­zi­pi­ell kein zu­sätz­li­cher Aufwand; Webseiten müssen in jedem Fall mit HTML aus­ge­zeich­net werden. Die Frage ist nur, ob wir es richtig machen.

Die De­fi­ni­ti­on von In­halts­ele­men­te und Content-Struktur kann uns sogar bei der Kon­zep­ti­on unserer Inhalte helfen. Eine Struktur gibt viele Elemente schon vor, die ich für mein Thema benötige und ver­ein­facht damit den Aufbau von Webseiten.

Die Vorteile von Markup sind:

• Klare Trennung von Struktur und Design
• Kein zu­sätz­li­cher Aufwand
• Un­ter­stützt Content-Kon­zep­ti­on

Über­schrif­ten

Über­schrif­ten sind ein grund­le­gen­des Element in allen längeren Texten. Egal ob Mas­ter­ar­beit oder Roman, Über­schrif­ten geben dem Leser Halt und er­mög­li­chen es, bestimmte Textteile gezielt zu finden.

Auf Webseiten haben Über­schrif­ten ganz ähnliche Funk­tio­nen. Sie geben die grund­le­gen­de Struktur der Seite vor und er­mög­li­chen so das Scanning der Seite und die Sei­ten­in­ter­ne Na­vi­ga­ti­on.

Scanning ist dabei die Form, wie User Webseiten über­flie­gen: Sie durch­su­chen die Webseite nach wichtigen Elementen und versuchen in kürzester Zeit zu prüfen, ob die Seite die gesuchte In­for­ma­ti­on enthält. Meist wird die Ent­schei­dung auf der Seite zu bleiben – oder ab­zu­sprin­gen – schon nach wenigen Sekunden getroffen. Gute Über­schrif­ten un­ter­stüt­zen den Leser dabei diese Ent­schei­dung schnell und sicher zu treffen.

Sei­ten­in­ter­ne Na­vi­ga­ti­on kann durch Über­schrif­ten ganz ohne Links geschehen. Der User scrollt einfach zum gesuchten Abschnitt und beginnt erst dort damit den Fließtext zu lesen. Ein Beispiel wäre eine Seite über Kopf­schmer­zen, die neben all­ge­mei­nen In­for­ma­tio­nen, auch Inhalte zu Ge­schlechts­spe­zi­fi­schen Kopf­schmer­zen enthält. Je nach eigenem In­for­ma­ti­ons­be­darf kann der Leser direkt zum ihn be­tref­fen­den Absatz springen. So kann man zum Beispiel ver­schie­de­ne Ziel­grup­pen auf einer Seite an­spre­chen, ohne für Ver­wir­rung zu sorgen.

Natürlich sind Über­schrif­ten auch ein wichtiges Signal für die Such­ma­schi­nen. Sie helfen bei der the­ma­ti­schen Zuordnung von Seiten und haben bis heute eine positive Kor­re­la­ti­on zu Rankings.

Was im SEA gilt, ist auch im SEO nicht verkehrt: Der Kunde soll schon in den ersten Sekunden das Gefühl haben, das richtige Ergebnis geklickt zu haben und auf der Seite alle ge­wünsch­ten In­for­ma­tio­nen zu finden. Dabei kann eine aus­sa­ge­kräf­ti­ge H1 sehr gut un­ter­stüt­zen.

Zu­sam­men­fas­send lässt sich sagen: Gute H1-Über­schrif­ten sollten

• Klar das Thema der Seite benennen
• Für eine kon­sis­ten­te Kom­mu­ni­ka­ti­on sorgen
• Die Blick­füh­rung lenken

Listen

Ein weiteres Struk­tur­ele­ment sind Listen. In HTML sind zwei Arten von Listen vor­ge­se­hen

1. Num­me­rier­te Listen
   (Ordered List / <ol>)
2. Auf­zäh­lun­gen
   (Unordered List / <ul>)

Im Quelltext sind sich die Listen sehr ähnlich. Sie bestehen jeweils aus einem öffnenden und schlie­ßen­den Tag für die Liste und da­zwi­schen ein­ge­füg­ten Lis­ten­ele­men­ten.

Google verwendet Listen unter anderem, um Featured Snippets daraus zu ge­ne­rie­ren. Im Beispiel enthält die Zielseite ei­gent­lich eine num­me­rier­te Liste, mitten im Text. Google zeigt sie mit Bul­let­points sehr prominent an. Der Hinweis auf weitere Elemente regt dabei noch zum Klicken an.

Be­to­nun­gen

Be­to­nun­gen sind das Salz in der Suppe eines jeden guten Textes. Besonders auf Webseiten kann man damit den Leser führen und das Querlesen er­leich­tern. Heben Sie die wich­tigs­ten Punkte Ihrer Aussage hervor. Nach dem Motto: Wenn schon nicht alles gelesen wird, sollte der Leser we­nigs­tens das mitnehmen.

Die zwei meist­ver­wen­de­ten Tags zur Betonung in HTML sind <strong> und <em>. Ty­pi­scher­wei­se wird haupt­säch­lich das Strong-Tag verwendet und meist fett gedruckt dar­ge­stellt. Laut Spe­zi­fi­ka­ti­on soll es wichtige Textteile kenn­zeich­nen. Zu­sätz­lich kann das Em-Tag verwendet werden, dass besonders betonte Textteile markieren soll (em für emphasis = Betonung). Es wird häufig kursiv dar­ge­stellt.

Bilder

Für Bilder gibt es in HTML direkt nur wenige Mög­lich­kei­ten In­for­ma­tio­nen zu struk­tu­rie­ren. Das Alt-Attribut am Bild und der Dateiname sind hier ent­schei­dend. Ansonsten werden Bild­in­for­ma­tio­nen über den Kontext angegeben.

Bild­in­for­ma­tio­nen:

• Dateiname / Pfad
• Alt-Attribut
• Bild­un­ter­schrift

Das Alt-Attribut ist dabei schon lange Ursache für Aus­ein­an­der­set­zun­gen. Meist wird von SEOs gefordert, dass es aus­ge­füllt wird. Selten werden Vorgaben für ver­nünf­ti­ge Inhalte gemacht. Der Sinn des Alt-Attributs ist dabei ei­gent­lich recht klar: Es soll eine Al­ter­na­ti­ve sein, falls das Bild nicht angezeigt werden kann. Ein Twitter-Logo könnte also den Alt-Text „Bei Twitter teilen“ haben, wenn es diese Funktion erfüllt. Einfach nur „Twitter Logo“ wäre in diesem Fall nicht aus­rei­chend. Ein einfaches Bild von einer süßen Katze kann aber mit „Süße Katze räkelt sich“ aus­rei­chend be­schrie­ben sein. Rein dem Design ge­schul­de­te Bilder, wie Hin­ter­grün­de oder ähnliches Eye-Candy, sollten al­ler­dings gar keinen Alt-Text enthalten, weil sie keine In­for­ma­ti­on über­mit­teln und keine Funktion erfüllen (außer schön aus­zu­se­hen).

Der Dateiname sollte hingegen einfach nur sehr kurz und knackig das Bild be­schrei­ben. Im oberen Beispiel wären das z.B. „twitter.jpg“ oder „suesse-katze.jpg“. Weitere In­for­ma­tio­nen, wie zum Beispiel die Zuordnung zu einer Kategorie, können über die Ord­ner­struk­tur über­mit­telt werden: „/tiere/katzen/suesse-katze.jpg“.

Die Bild­un­ter­schrift ist nicht direkt im HTML definiert. Google verwendet jedoch Text im un­mit­tel­ba­ren Umfeld zu Bildern (Kontext), um den Inhalt von Bildern zu bewerten. Auch für den Leser ist oft nicht klar, was er grade sieht, oder warum. Hier kann eine Bild­un­ter­schrift unter die Arme greifen und das Bild mit dem Sei­ten­in­halt ver­knüp­fen.

Die Texte an Bildern sind enorm wichtig für Such­ma­schi­nen, da sie nur Texte, nicht aber Bild­in­hal­te bewerten. Ein Bild mit dem Da­tei­na­men „123.jpg“, ohne Alt-Text und ohne Bild­un­ter­schrift ist für Google einfach nur komplett wertlos. Durch Keywords in den Bild­in­for­ma­tio­nen können wir aber nicht nur in der Google-Bilder Suche ranken, sondern auch die Bedeutung und damit die Rankings der Webseite steigern.

Wichtig ist in jedem Fall, dass die Texte un­ter­schied­lich sind. Bitte nicht einfach den Da­tei­na­men in Alt und Un­ter­schrift kopieren, dann kann man ihn besser weglassen. Au­to­ma­tisch ge­ne­rier­te Texte sind hier oft pro­ble­ma­tisch, besser sind echte, hand­ge­schrie­be­ne Texte, die einfach Sinn machen.

Um einen Text bewerten zu können, muss ich ihn zu­al­ler­erst einmal verstehen. Das geht dem Google-Bot nicht anders. Das Text­ver­ständ­nis wird un­ter­stützt durch Struk­tur­ele­men­te. Sie er­mög­li­chen es un­ter­schied­li­che Bereiche im Text zu erkennen und wichtiges vom un­wich­ti­gen zu un­ter­schei­den. Damit wird zum Beispiel auch die Bildung von The­men­clus­tern un­ter­stützt.

All das un­ter­stützt schon unsere Be­mü­hun­gen, unsere Rankings zu ver­bes­sern. Dazu kommt aber noch die Chance auf Featured Snippets. Selbst wenn unsere Seite nur auf Position 5 rankt, kann sie im Featured Snippet auf Position 0 über allen Mit­be­wer­bern dar­ge­stellt werden. So können praktisch Plätze im Ranking über­sprun­gen werden.

Ver­bes­sern Sie ihre Texte – machen Sie Google und ihre Kunden glei­cher­ma­ßen glücklich. Mit dieser einfachen Technik können Sie sich noch heute einen Vorsprung ver­schaf­fen.