Social Meta Tags wie die Open Graph Tags (Facebook), Twitter Cards (Twitter) oder Schema.org Markups (Google+) sind nützliche Helferlein, wenn es darum geht, den eigenen Content optimal in den sozialen Netzwerken zu präsentieren. Mit ihnen können Webmaster exakt definieren, wie eine geteilte Seite im Newsfeed dargestellt werden soll. Wir zeigen Euch, wie die „Conversion Rate Optimierung“ für Social Posts funktioniert und welche Meta Tags unbedingt in Euren Quellcode gehören.
Social Meta Tags: nicht neu, aber gerne vergessen!
Neu sind Social Meta Tags nicht: Am 13. Juni 2012 veröffentlichte Twitter als letzter der großen Social Media Player die Twitter Cards mit dem Release der expanded Tweets. Seitdem ist viel Zeit vergangen, aber auch heute noch finden die Tags in sehr vielen Fällen nicht den Weg in den Quellcode. Sind diese nicht implementiert, werden die Snippets über die herkömmlichen Meta Tags generiert, was allerdings häufig zu unerwünschten Darstellungen führt. Schon mal den eigenen Content auf Facebook gepostet und kein Vorschaubild gehabt? Oder das Bild war auf Grund der Größe total verpixelt, angeschnitten oder für den Inhalt unpassend? Das muss nicht mehr sein!
Gründe für die Implementierung
Wie gerade bereits angemerkt, habt Ihr durch Social Meta Tags die volle Kontrolle über die Darstellung Eurer Snippets. Wir wissen aus Studien, dass vor allem Bilder eine hohe Aufmerksamkeit erzeugen. In Zeiten, in denen die Aufmerksamkeitsspanne eines Menschen kürzer als die eines Goldfischs ist, müssen meine Inhalte also hervorstechen, um überhaupt wahrgenommen zu werden.
Die richtige Zielgruppenansprache, inklusive optimiertes Vorschaubild, hilft dabei eine größere Reichweite meines Inhalts zu erzeugen. Im besten Fall führt dies zu mehr Links und Erwähnungen und gehört daher in jede Content-Marketing-Strategie. Auch in der SEO besteht zumindest eine Korrelation zwischen sozialen Signalen und Rankings. Es gibt also genügend Gründe, warum man das Potential der Social Meta Tags nutzen sollte.
Zusammenfassung der Vorteile:
- Zielgruppenansprache + Bilder individuell an das jeweilige soziale Netzwerk anpassen
- Volle Kontrolle über die Inhalte meiner Snippets
- Zusätzliche Informationen wie Autor, Webseite bis hin zu erweiterten Produktdaten möglich
- Höhere Interaktionsraten durch mehr Aufmerksamkeit
- Steigerung der Links und Erwähnungen
- Stärkere Wahrnehmung der Brand
Welche Tags sollten unbedingt verwendet werden?
Um Euch eine kleine Orientierung bzw. Hilfe bei der Auswahl der Tags geben, haben wir folgend unser „Best Practice“ zusammengefasst. Die folgenden Tags sind im Prinzip Standard-Tags, die auf keiner Seite fehlen sollten und für die meisten Webseiten ausreichen. Wenn Ihr diese nutzen wollt, einfach den Code kopieren und in den <HEAD>-Bereich jeder URL Eurer Seite implementieren und entsprechend anpassen.
[php]
<!– Open Graph Tags für Facebook –>
<meta property="og:title" content="Seitentitel" />
<meta property="og:type" content="article, website, blog, etc." />
<meta property="og:url" content="http://www.ranking-check.de/" />
<meta property="og:image" content="http://www.ranking-check.de/bild.jpg" />
<meta property="og:description" content="Beschreibungstext" />
<meta property="og:site_name" content="Seitenname, z.B. rankingCHECK" />
<meta property="fb:admins" content="Facebook ID" />
<!– Twitter Card für Twitter –>
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@Publisher">
<meta name="twitter:title" content="Seitentitel">
<meta name="twitter:description" content="Beschreibungstext">
<meta name="twitter:creator" content="@Autor">
<meta name="twitter:image" content="http://www.ranking-check/bild.jpg">
<!– Schema.org Markup für Google+ –>
<meta itemprop="name" content="Seitetitel">
<meta itemprop="description" content="Beschreibungstext">
<meta itemprop="image" content="http://www.ranking-check.de/bild.jpg">
[/php]
Vollständige Liste aller Open Graph Tags: http://ogp.me/
Vollständige Liste aller Twitter Cards: https://dev.twitter.com/cards/types
Vollständige Liste aller Schema.org Markups für Google+: https://developers.google.com/+/web/snippet/
Tools zum Testen
Mit dem Facebook Debugger bzw. dem Open Graph Object Debugger könnt Ihr URLs auf Kompatibilität mit dem Open Graph Protokoll prüfen. Ebenfalls lassen sich mit dem Tool Seiten neu scrapen, falls Änderungen an den Open Graph Tags vorgenommen wurden, aber Facebook die Informationen noch nicht richtig darstellt.
Das Twitter Validation Tool funktioniert ähnlich wie der Facebook Debugger. Sobald einer der Card Types in die Seite implementiert ist, kann das Tool zur Überprüfung von Fehlern und der Darstellung im Feed verwendet werden.
3. Google Structured Data Testing Tool
Mit Hilfe des Google Structured Data Testing Tools lässt sich ermitteln, welche strukturierten Daten Google erkennt. Außerdem gibt das Tool nützliche Tipps bei fehlerhaften Daten.
Tipps und Tricks
- Falls aus bestimmten Gründen nur ein Typ von Social Meta Tags verwendet werden kann, sind die Open Graph Tags die beste Wahl. Die meisten Plattformen nutzen diese als Fallback.
- Wer WordPress für seine Webseite verwendet, kann auf nützliche Plugins zurückgreifen. Wir von rankingCHECK nutzen Facebook Open Graph, Google+ and Twitter Card Tags in Kombination mit Yoast SEO und haben bisher sehr positive Erfahrungen gemacht.
- Die optimale Größe für Facebook Bilder ist 1200 x 630 Pixel. Du solltest zumindest Bilder mit 600 x 315 Pixel verwenden, um Posts mit größeren Bildern anzuzeigen.
- Die Größe für In-Stream-Bilder auf Twitter ist 440 x220 Pixel.
- Best Practice bei Google+ Bildern ist 1080 x 608 Pixel.
Fazit
Nutzt die Möglichkeit mit Hilfe der Social Meta Tags Eure Snippets aufzuwerten und im Newsfeed-Dschungel herauszustechen. Im Gegensatz zum Social Advertising entfallen hier die Werbekosten komplett und Eure Target Audience verbreitet Eure Inhalte kostenlos. Zudem weisen optimierte Snippets bessere Click-Through-Raten auf und lassen Euren Internetaufritt professioneller wirken. Mit dem verhältnismäßig geringen Aufwand kann man so die Reichweite und Interaktionsraten signifikant erhöhen.
