Webflow Blog-Artikel Schema Markup anlegen
Schema Markups sind ein einfacher Weg, um die Rich-Results in den Suchergebnissen detaillierter darzustellen und so dein SEO-Ranking zu verbessern.
Blog-Artikel sind ein beliebtes Mittel, um organischen Traffic zu erzeugen und User dazu zu bringen, auf die eigene Website zu klicken. Die Vorschau der Suchergebnisse werden den Usern in “Rich Results” angezeigt, also die kleine Vorschau, die beschreibt, welche Inhalte auf deiner Website zu finden sind.
Bestimmt ist dir schon mal aufgefallen, dass die obersten Suchergebnisse viel detaillierter dargestellt werden als die “Standard-Ergebnisse” weiter unten. Wieso das wichtig ist? Je mehr Informationen User auf den Suchmaschinenergebnisseiten (SERPs) sehen können, die für sie relevant sind, desto wahrscheinlicher ist es, dass sie auf das Ergebnis klicken.
Wenn du es also schaffst, dass dein Blog-Artikel auch detaillierter in den Ergebnissen erscheint, erhöhst du die Chance, dass User auf deine Website kommen.
Was ist ein Schema Markup?
Ein Schema Markup sind strukturierte Daten, die Suchmaschinen helfen, Rich Results mit weiteren Informationen zu bereichern. So können Suchmaschinen Inhalte besser verstehen & einordnen. Die Daten sind nach einem Standard von schema.org festgelegt.
Um Suchmaschinen diese Schema-Markups zu liefern, musst du auf deiner Website einen Code einfügen. Ein Schema ist praktisch ein Datensatz. Hierfür gibt es unterschiedliche Kategorien wie z.B. Blogbeiträge, Nachrichtenartikel oder Rezepte. Markup ist der eigentliche Code, der auf der Website eingefügt wird. Beide Begriffe gehören also eng zueinander.
Die Vorteile eines Schema Markup
Die Verwendung von Schema Markups kann vielerlei Vorteile bieten:
Bessere Sichtbarkeit bei der Suche
User erhalten bereits Informationen, bevor sie überhaupt deine Website besuchen. Wenn du Usern also schon in den Suchergebnissen gewünschte Informationen bietest, schenken sie deiner Marke eher Vertrauen & landen auf deiner Website
Verbesserte Rich Results
Durch die auffälligeren Ergebnisse, kannst du dich von “Standard Suchergebenissen” abheben. So kannst du bereits gegenüber anderen Unternehmen hervorstechen.
Bessere Indizierung
Obwohl das Schema Markup selbst kein direkter Ranking-Faktor ist, kann die erhöhte Klickrate und die verbesserte Nutzererfahrung positive Auswirkungen auf dein Ranking haben. Google bevorzugt Seiten, die den Nutzern relevante und nützliche Informationen bieten.
Verbesserte Barrierefreiheit
Da sich die Sprachsuche immer mehr durchsetzt, trägt Schema Markup dazu bei, dass Ihre Inhalte von Screen-Reader-Technologien leicht verstanden und abgerufen werden können.
Wie du ein Schema Markup in Webflow einfügst
Schritt 1: Seiteneinstellungen öffnen
Navigiere zu dem Blog-Template deiner Webflow Webseite. Öffne dann die Seiteneinstellungen durch Klick auf das “Zahnrad-Icon”.
Schritt 2: Schema Markup Code einfügen
Scrolle zu dem Abschnitt indem du Custom Code einfügen kannst. Füge dort das Markup Schema im Bereich “Before <body> tag” ein.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BlogPosting",
"headline": "{{headline-reference-field}}",
"image": "{{post-image-reference-field}}",
"genre": "{{category-reference-field}}",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "https://www.meine-website/post/{{slug-field}}"
},
"publisher": {
"@type": "Organization",
"name": “Unternehmen Name",
"email": "info@meine-website.de",
"address": {
"@type": "PostalAddress",
"streetAddress": "Straße",
"addressLocality": "München",
"addressRegion": "Deutschland",
"postalCode": "PLZ",
"addressCountry": "DE"
},
"logo": {
"@type": "ImageObject",
"url": "https://uploads-ssl.webflow.com/some-absolute-url-path.png"
}
},
"url": "https://www.meine-website/post/{{slug-field}}",
"datePublished": "{{datePublished-field}}",
"dateCreated": "{{dateCreated-field}}",
"dateModified": "{{dateModified-field}}",
"description": "{{description-field}}",
"author": {
"@type": "Person",
"name": "{{Name Author}}"
}
}
</script>
Die Inhalte in den {{ }} kannst du mit dynamischen CMS-Inhalten verknüpfen. Bei den Feldern “Adresse” oder “Logo URL” kannst du einfach die passenden Inhalte reinkopieren.
Schritt 3: Speichern & veröffentlichen
Speichere die Änderungen und veröffentlichen deine Website, um den Code online zu stellen.
Schritt 4: Schema Markup testen
Nun kannst du deinen Code noch testen und sehen, ob die Daten richtig ausgelesen werden. Dazu gibt es verschiedene hilfreiche Tools, bei denen du nur den Link deines Blog-Artikels einfügen musst.
Hilfreiche Tools für Schema Markup
Code Testen
Es gibt hilfreiche Tools, um zu testen, ob dein Schema Markup richtig von Suchmaschinen ausgelesen wird:
- Rich Result Vorschau testen: Google Search Test Rich Results
- Schema Markup Validator
Schema Markup Code generieren
Falls du andere Markup Schemas erzeugen möchtest, gibt das dafür Tools, die dir helfen, den entsprechenden Code zu generieren:
Weitere hilfreiche Markup Schemas für Blog-Artikel
- Artikel-Schema: Für die Inhalte deines Artikels (wie oben beschrieben)
- Breadcrumb-Schema: Zeigt die Breadcrumb-Navigation bereits in den Suchergebnissen & verbessert so die Navigation für User
- FAQ-Schema: Für häufig gestellte Fragen & Antworten, die User schon in den Suchergebnissen anschauen können
- Bewertungs-Schema: Für Kundenrezensionen von Produkten geeignet
Fazit
Schema Markups sind eine einfache Möglichkeit die Klickrate in den organischen Suchergebnissen zu verbessern. Vielleicht ist ein kleiner aber entscheidender Unterschied zu deiner Konkurrenz. Probier es doch einfach mal aus:)
→ Falls du Hilfe bei der Implementierung von Schema Markup benötigst, kontaktiere mich gerne!
