SEO für Einsteiger – Teil 6: Markup, strukturierte Daten & Co.

18. Juni 2018 | Von in SEO
Ein Begriff, den jeder SEO-Einsteiger einmal gehört haben sollte, lautet Markup. Der Begriff taucht häufig im Zusammenhang mit anderen Begriffen, wie z. B. strukturierten Daten, JSON-LD oder Rich Snippets, auf. Was hinter den einzelnen Begriffen steckt und was das Ganze mit der Suchmaschinenoptimierung zu tun hat, werde ich in diesem Beitrag erläutern.

Markup im Zusammenhang mit SEO

Ganz allgemein ist mit Markup eine Auszeichnungssprache gemeint, die von Maschinen gelesen werden kann und mit der Informationen gegliedert und formatiert werden können. Eine solche Sprache, die wir alle kennen, ist HTML (Hypertext Markup Language). Zeichnet man also im HTML-Code eine Überschrift mit einem <h1>-Tag aus und schließt diese mit </h1>-Tag ab, dann kann ein Browser interpretieren, dass es sich um eine Überschrift handelt. Auch Webcrawler (wie der Googlebot) können erkennen, dass es sich um eine Überschrift handelt. Die Strukturierung des Quellcodes kann aber noch ein Stück weitergehen. Mit sogenannten strukturierten Daten kann man dem Quellcode weitere Informationen hinzufügen, die von Suchmaschinen interpretiert werden können. Damit kann man der Suchmaschine mitteilen, von welchem Typ eine Seite ist, z. B. ein lokales Geschäft. Dem Typ sind weitere Objekte, wie z. B. die Adresse und die Öffnungszeiten, zugeordnet. Warum können Suchmaschinen das richtig interpretieren? Nun, die großen Suchmaschinen haben sich auf ein einheitliches Vokabular geeinigt und die Community schema.org gegründet. Dort sind die unterschiedlichen Schemata auffindbar, die sich aus Typen und Objekten zusammensetzen. Wenn wir SEOs von Markup sprechen, meinen wir also häufig die erweiterte Strukturierung des Quellcodes durch strukturierte Daten von schema.org.

Vorteile von Markup

Zwei große Vorteile bietet die Verwendung von Markup:

1.      Strukturen sind für die Suchmaschine besser erkennbar

Da es sehr viele unterschiedliche Typen von strukturierten Daten gibt (über 500), ist es möglich, der Suchmaschine die Verarbeitung der Informationen zu erleichtern. Warum das so ist, erläutere ich einmal an Hand von zwei Beispielen. Zum einen am Organization Markup und zum anderen am Product Markup. Beispiel #1 – Organization Markup Mittels Organization Markup kann man Google u. a. die Adress- und Kontaktdaten des Unternehmens, das Logo der Website und die dazugehörigen sozialen Kanäle mitteilen. Das Organization Markup muss in der Startseite implementiert werden und kann z. B. so aussehen:

Quelle: Screenshot von http://schema.org/Organization

Es wird deutlich, dass durch Festlegung von Typen und Objekten die Informationen besser und logisch aufbereitet sind. Google kann zwar viele der Informationen auch so erkennen, hat aber über Markup die Bestätigung, dass die Informationen auch so gemeint sind, wie sie auf der Website dargestellt werden. Beispiel #2 – Product Beim Markup für Produkte kann man eine Vielzahl von Produktinformationen – wie z. B. die Farbe, ein Produktbild, Produktbewertungen, den Namen des Herstellers oder den Preis – strukturiert an die Suchmaschine übergeben.

Quelle: Screenshot von http://schema.org/Product

2.      Rich Snippets – mit Markup die Darstellung der Suchergebnisse pimpen

Ob auf einer Seite Markup verwendet wird, ist für den Nutzer zunächst nicht erkennbar. Ebenso wie beim HTML-Code bekommt der Nutzer in einem Browser nur das zu sehen, was der Browser aus HTML, CSS und JavaScript interpretieren kann. Was sich mit Markup beeinflussen lässt, ist die Darstellung der Suchergebnisse. Ein Rich Snippet ist eine spezielle Darstellung für ein Suchergebnis. Reichert man den Quellcode mit strukturierten Daten an, kann es sein, dass Google daraufhin die Darstellung in den Suchergebnissen ändert. Ob Google diese Informationen nutzt, ist aber nicht garantiert. Der Vorteil ist klar – ein attraktiveres Suchergebnis regt zum Klicken an, was die Klickrate bzw. die Click-Through-Rate erhöht. Auch dafür habe ich einige Beispiele vorbereitet: Rich Snippet Beispiel #1 – Veranstaltungen/Events Sucht man z. B. nach „konzert robbie williams“, erscheinen mehrere Einträge. Wie der Sceenshot zeigt, sticht ein Ergebnis hervor:

Beispiel für das Event Markup

Schaut man in den Quellcode der Seite hinein, stellt man fest, dass hier ein Event Markup verwendet wurde. In diesem speziellen Fall wurde sogar das MusicEvent Markup benutzt, dass das Event gleich mit dem Typ Musikevent spezifiziert. Rich Snippet Beispiel #2 – Breadcrumb Häufig verfügen Seiten über eine Breadcrumb bzw. eine Breadcrumb-Navigation, die dem Nutzer dabei hilft, sich zu orientieren (Beispiel: Home>Kategorie 1>Beitrag X). Diese Informationen können mit dem Breadcrumb Markup stukturiert werden und somit die Darstellung der URL in den Suchergebnissen beeinflussen. Anhand der folgenden beiden Screenshots wird der Unterschied deutlich:

Darstellung der Suchergebnisse ohne Breadcrumb Markup

Darstellung der Suchergebnisse mit Breadcrumb Markup

Mit dem Breadcrumb Markup kann die Darstellung der URL positiv beeinflusst werden. Während im ersten Beispiel die komplette URL ausgegeben wird, erfolgt im zweiten Beispiel eine strukturierte Darstellung. Sie erleichtert es, dem Nutzer den Beitrag in eine Kategorie einzuordnen und gibt ihm so eine bessere Orientierung. Rich Snippet Beispiel #3 – Rating Ein weiteres sehr wichtiges Markup, das signifikant die Darstellung in den Suchergebnissen beeinflussen kann, ist das Markup für Ratings bzw. Bewertungen. Betrachtet man die vier Snippets, fällt das Produkt direkt ins Auge, bei dem die Bewertungssternchen ausgegeben werden. Das Rating Markup kann für Produkte, Kategorien oder die Bewertung der gesamten Marke implementiert werden. In diesem Beispiel lassen sich aber noch weitere Rich Snippets finden, wenn man sich die anderen Einträge anschaut. Im obersten Beispiel ist ein Hinweis auf eine Kategorieseite mit der dazugehörigen Produktanzahl zu finden. Im dritten Eintrag werden durch das hinterlegte Product Markup Informationen für den Preis und die Verfügbarkeit im Shop angezeigt.

Wie implementiere ich Markup?

Für die Implementierung von Markup hat Google einige Richtlinien veröffentlicht, die Structured Data General Guidelines. Dort nennt Google drei Varianten, die es ermöglichen, dass Rich Snippets angezeigt werden:
  1. JSON-LD
  2. Microdata
  3. RDFa
Bei den Varianten Microdata und RDFa erfolgt eine direkte Auszeichnung durch Markup im Quellcode am jeweiligen Element. Es muss also jede Überschrift, jeder Paragraph etc. einzeln ausgezeichnet werden. Mit JSON-LD werden die Informationen über ein Skript vom Inhalt der Seite getrennt. Google empfiehlt die Implementierung über JSON-LD (JavaScript Object Notation für Linked Data). Da dies ein Artikel für Einsteiger ist, gehe ich an dieser Stelle lediglich ganz kurz auf diese Möglichkeit etwas näher ein: Zunächst kann ich Entwarnung geben, nur weil es sich um ein Skript handelt, ist in der Regel kein wirklicher Programmieraufwand erforderlich. Die Seite schema.org bietet auf jeder Seite ausführliche Beispiele für jeden Markup Typ. Das Skript sollte laut Google im <head>-Bereich einer Seite eingebaut werden. An dieser Stelle greife ich nochmal das zuvor genannte Beispiel des Organization Markups auf. Im Prinzip kann man die genannten Beispiele sehr gut als Vorlage nutzen und anpassen. Schaut man sich das Organization Markup auf schema.org genauer an, wird schnell deutlich, dass einem zahlreiche Spezifizierungen zur Verfügung stehen. Das erfordert sicherlich etwas mehr Einarbeitungszeit.

Testingtool für strukturierte Daten

Ob das Markup korrekt eingebaut wurde, lässt sich mit dem Testtool für strukturierte Daten feststellen, das von Google bereitgestellt wird. Dort kann einfach eine URL eingegeben werden. Auf der linken Seite wird der überprüfte HTML-Quellcode der zugehörigen Seite ausgegeben. Alle Markups, die gefunden werden, werden auf der rechten Seite aufgelistet. Sollten dabei Fehler gemacht worden sein, weist Google darauf hin und spricht darüber hinaus Warnungen aus, wenn z. B. Informationen für ein Feld nicht auffindbar sind. Ein kleiner Tipp für das bessere Auffinden des Markups im Quellcode: Ein Doppelklick auf ein Markup – wie hier im Beispiel „Organization“ – genügt und schon wird die entsprechende Zeile im HTML-Code auf der linken Seite markiert. Ein spannendes Feature zum Fixen von Fehlern im Markup ist, dass Veränderungen im Quellcode direkt über das Tool validiert werden können. Dazu kann zunächst der Quellcode links bearbeitet werden und mit einem Klick auf den Button „Validieren“ (sieht aus wie ein Play-Button) werden die gemachten Änderungen in der Vorschau wirksam. Selbstverständlich müssen die Fehler anschließend noch im eigentlichen Quellcode gefixt werden. Wer noch mehr über das Thema Markup erfahren möchten, dem lege ich das Webinar „Markup und SEO“ von Markus Hövener ans Herz.

Fazit

Alles in allem ist das Thema Markup super spannend. Auch als Einsteiger kommt man nicht so wirklich um das Thema herum. Der Einsatz von Markup hilft Suchmaschinen dabei, die Informationen auf einer Website besser zu verstehen. Ebenso nutzt Google diese Informationen, um die Darstellung in den Suchergebnissen anzupassen. Die Implementierung ist nicht ganz so leicht und erfordert meist etwas Einarbeitung. Dennoch hilft das Testtool für strukturierte Daten dabei, dass das Markup fehlerfrei eingebaut wird.

Alle Artikel aus der Serie SEO für Einsteiger

Teil 1: Die Funktionsweise von Suchmaschinen

Teil 2: Wie baue ich meinen ersten Link auf?

Teil 3: Keywords, Keywords, Keywords

Teil 4: Wo fange ich eigentlich mit SEO an?

Teil 5: Tipps für die Homepage

Teil 6: Strukturierte Daten, Markups & co.

Mehr zu diesem Thema:
Nächste Events

Nächste Webinare

Alle kommenden Webinare

Nächste Seminare

Alle kommenden Seminare

The following two tabs change content below.
Avatar-Foto

Andreas Engelhardt

Andreas Engelhardt ist Head of Digital Analytics + CRO bei der Online-Marketing-Agentur Bloofusion.

Dort berät er Kunden bei der Webanalyse und der Optimierung ihrer Seiten für mehr Sales und Leads. Zudem bloggt er regelmäßig im Bloofusion Blog.

Andreas Engelhardt ist unter anderem in den folgenden sozialen Netzwerken zu finden:

6 Kommentare zu “SEO für Einsteiger – Teil 6: Markup, strukturierte Daten & Co.”

  1. Avatar-Foto Lothar
    Juni 19th, 2018 at 08:42

    Danke für den informativen Beitrag. Ich dachte bisher, dass der Begriff “Markup” sich nur auf die Auszeichnung von Keywords bezieht. Was er alles wirklich einschließt, wird durch den Artikel sehr schön beschrieben.

    Nochmals vielen Dank!

    LG

  2. Avatar-Foto Andreas Engelhardt
    Juni 19th, 2018 at 09:21

    Danke für dein Feedback! Freut mich, dass dir der Artikel gefällt. 😉

  3. Avatar-Foto Falk
    Dezember 27th, 2018 at 17:33

    Danke für den Beitrag, ich hätte da eine Frage zu den Warnmeldungen. Z.B. bekomme ich eine Warnmeldung zu “sku” und “gtin8 ….” Es wird darauf hingewiesen, dass es ein empfohlenes Feld ist und ich doch bitte einen Wert angeben soll. Allerdings sind diese Informationen bereits weiter oben integriert. Wie kommt es zustande, dass das Testtool für die Strukturierten Daten diese Informationen gern nochmal haben möchte? Liegt es daran, dass verschiedene Attribute teilweise mit den selben Daten gefüttert werden können? Und besteht da für mich weiterer Handlungsbedarf? ..Vorab besten Dank
    Gruß
    Falk

  4. Avatar-Foto Markus Hövener
    Januar 3rd, 2019 at 11:46

    Wenn es um die Website satking .de geht: Das Markup ist fehlerhaft. Die Daten für sku und so sind zwar markiert, aber innerhalb des Offer- und nicht des Product-Markups. Da müssen die Entwickler nochmal ran. Sieht man im Testtool für strukturierte Daten aber ganz gut…

  5. Avatar-Foto Ina
    Juni 13th, 2019 at 14:09

    Hi,
    vielen Dank für den Artikel. Ich habe eine Frage zum Einsatz von strukturierten Daten. Macht es irgendeinen Sinn, Daten auszuzeichnen, wenn man die Seite nicht indexieren möchte?
    Ich habe das tatsächlich schon auf Produktseiten eines Modehauses gesehen, doch sehe ich darin eigentlich keinen Nutzen, da die Auszeichnung ja nur für die Suchmaschinen zur Einordnung der Inhalte da ist. Wenn die Seite also gar nicht indexiert werden soll, bringt es gar nichts, oder?
    LG
    Ina

  6. Avatar-Foto Andreas Engelhardt
    Juni 14th, 2019 at 10:33

    Hallo Ina,
    schön, dass dir der Beitrag gefällt. 😉
    Du liegst natürlich richtig. Wenn man eine Seite nicht indexieren möchte, braucht man sich nicht die Mühe machen und sein Seiten mit strukturierten Daten auszuzeichnen.
    Ich vermute bei deinem Beispiel ganz stark, dass die strukturierten Daten im Template standardgemäß hinterlegt sind und somit immer ausgegeben werden.
    Anschließend wurde die Seite einfach nur auf noindext gestellt. Somit sind die Auszeichnungen auch weiterhin erhalten.
    Beste Grüße
    Andreas

Kommentieren