Dass das aktive Nutzen von Open Graph Tags häufig nicht stattfindet, kann man leicht innerhalb von Facebook und Google+ sehen. Für viele Seitenbetreiber scheint der Hintergrund und Sinn der Einbindung ein kleines Geheimnis zu sein. Grund genug, sich diese einfache aber so effektive Maßnahme genauer anzuschauen. Hierfür haben wir die Startseiten der Top 100 Deutschen Marken nach vorhandenen Open Graph Tags (OG Tags) gecrawlt und ausgewertet.

Am Beispiel von worst & best practices wird die Nutzung verdeutlicht. Es gibt Tipps für den Einbau sowie eine kurze Einführung in die Thematik Open Graph Protokoll, welche die Basis bildet.

Kurzerläuterung Social Graph, Open Graph Protokoll und Open Graph Tags

Das Herzstück von Facebook ist der Social Graph der im Grunde eine Begrifflichkeit für ein Soziogramm darstellt. Im Kontext mit dem Internet bilden Soziogramme die persönlichen Verbindungen zwischen Menschen ab, wie sie zueinander stehen und für was sie sich interessieren. Die abgebildete Grafik stellt den Social Graph von Facebook dar, der durch neue Produkte wie Fotos und Places stets erweitert wurde und wird.

Facebook Open Graph Soziogramm

Facebook Open Graph Soziogramm

2010 wurde eine Erweiterung des Social Graph vorgenommen – der Open Graph. Mit dem Open Graph wurde zeitgleich der „Like-Button“ eingeführt. Durch diese technische Erweiterung war es nun möglich, Dritte (Websites) und Inhalte in den Open Graph zu integrieren, die User im Netz geliked haben.

Über das Open Graph Protokoll werden, mittels Hinterlegung von Open Graph Tags, die technischen Details der Anzeige von Beiträgen auf Facebook gesteuert. D. h. beim Liken einer Website oder Teilen von Inhalten per copy & paste im Facebook Statusfeld sind die Inhalte so zu sehen wie auch auf der Website. Je strukurierter die Open Graph Tags (OG Tags) hinterlegt sind, desto definierter erscheint der Inhalt bei Facebook oder Google+. Das Open Graph Protokoll stellt somit eine offene Schnittstelle dar, die es ermöglicht, Inhalte oder auch Websites semantisch zu klassifizieren. Facebook, Google+ oder andere Anwendungen können diese dann auslesen und verwerten (Darstellung).

Welchen Zweck erfüllen OG Tags?

Die Aufgabe der OG Tags dürfte bereits klar geworden sein. Zur Verdeutlichung: Selbst wenn Unternehmen sich nicht auf Facebook selber aktiv darstellen, so tun sie das in den meisten Fällen durch eine Webpräsenz (Homepage). Das sind Inhalte, die einem Seitenbesucher frei zur Verfügung stehen. Bei Gefallen sind es nur zwei Klicks (copy & paste) und schon wurde dem besten Freund oder einer Freundin ein Seiteninhalt via Facebook (oder einer anderen Anwendung) mitgeteilt. Dieses Teilen von frei gewählten Inhalten stellt nichts anderes dar, als das Mitnehmen eines Flyers, der früher neben einer Kasse im Laden um die Ecke lag (und auch heute oft noch liegt). Mit dem großen Unterschied, dass sich über die Gestaltung der Inhalte und Aufbereitung seitens des Unternehmens Gedanken gemacht wurde. Was soll beworben werden, wie grafisch dargstellt, sind alle notwendigen Informationen für eine Kontaktaufnahme hinterlegt, wurde ein Call-to-Action eingebaut? Nun übernehmen Websitenbesucher das Bewerben eines Produktes oder der Marke, in dem sie sich selber Webseiteninhalte aussuchen und teilen.

Hier kommen die OG Tags ins Spiel, denn Sie stellen die grafische und inhaltliche Flyer-Gestaltung dar. Sie geben die Möglichkeit, Websiteninhalte als graphische Objekte einzubinden.

Basic & Optionale OG Tags

Facebook Entwickler unterscheiden zwei Arten von OG Tags – basic und optional. Diese Meta-Tags werden im oberen Bereich des Quelltextes platziert.

<head> <title>…</title> <meta property=“og:title“ content=“…“/> <meta property=“og:type“ content=“…“/> <meta property=“og:url“ content=“…“/> <meta property=“og:image“ content=“…“/> </head>

 
Die vier Basic OG Tags

og: Title
(Title des Dokumentes – knapp und aussagekräftig)
og: Type
(Typ des Dokuments – hier gibt es eine breite Vielfalt – siehe Screenshot)
og: image
(URL zu einem Bild bzw. das Logo der Website, eine Grafik – Eyecatcher – die in einem Artikel zu sehen ist)
og: url
(URL zu dem Dokument / Seite – Permalink)

Die optionalen OG Tags

og: description
(Beschreibung mit zwei bis drei kurzen Sätze. Hier kann auch ein Call-to-Action eingebaut werden)

Adress OG Tag
og: latidude (Breitengrad)
og: longitude (Längengrad)
og: street-adress
og: locality
og: region
og: postal-code
og: country-name

Kontaktangaben OG Tag
og: email
og: phone_number
og: fax_number

Weitere OG Tags, wie zum Beispiel für die Einbindung von Video oder Audio, können direkt auf der Open Graph Protokoll Seite (http://ogp.me) von Facebook ausgelesen werden.

OG Tag Nutzung der Top 100 Deutschen Marken

Nachdem uns in Spotchecks bei Facebook und Google+ im Rahmen von Kundenprojekten unvollständige oder gar nicht programmierte OG Tag Snippets aufgefallen sind, haben wir die Startseiten der Top 100 Deutschen Marken gecrawlt und auf vorhandene OG Tags untersucht. Die Tags wurden im zweiten Schritt nach ihrer mengenmäßigen Nutzung aufgeteilt. Best & Worst Practices sind am Beispiel innerhalb von Facebook und Google+ dargestellt.

Ernüchterndes Ergebnis nach dem Crawling

Das Crawling Ergebnis ist relativ ernüchternd, da von 100 Marken nur 21 OG Tags eingebunden haben. Bei den anderen Unternehmen ist innerhalb des Quelltextes kein Hinweis auf ein Tagging zu finden.

Open Graph Tags - Nutzungverteilung

Open Graph Tags – Nutzungverteilung

Im zweiten Blick schauen wir auf die Verteilung der OG Tags nach Menge. Deutlich „vorne“ liegt natürlich die Hinterlegung mit 0 Tags. Von den 21% der Marken, die OG Tags eingebunden haben verwenden nur 7% 1 OG Tag. Erinnern wir uns an die 4 Basic OG Tags, die bereits erläutert wurden, erkennt man lediglich zwei Marken, die die empfohlene Menge eingesetzt haben. 4% der Marken haben 6 OG Tags hinterlegt und bei einer Marke sind sogar 10 OG Tags hinterlegt.

Mengenverteilung Open Graph Tags

Mengenverteilung Open Graph Tags

Viel hilft viel?

Die Anzahl der OG Tags allein zu bewerten ist nicht sinnvolll oder aussagekräftig. Schauen wir uns das Beispiel der Marke mit den 10 verwendeten OG Tags an.

Quelltex nero.com

Quelltex nero.com

Auf der Startseite von nero.com findet man im Quelltext 10 verschiedene OG Tags. Wie in der Grafik hervorgehoben, werden auch OG Tags für Adresse und Kontakt genutzt. Für Places sind diese OG Tags eine sinnvolle Einbindung. Schaut man sich jedoch die Facebook Seite von nero.com an, dann sieht man, dass diese Marke nicht als Place besucht werden kann. Die Auszeichnung ist in diesem Fall aus SEO-Betrachtung eine Code-Verschwendung. Bestätigt wird dieses zudem durch Erscheinen des Snippet beim Teilen der URL auf Facebook und Google+.

Innerhalb beider sozialer Netzwerke sind keine Kontaktdaten oder Adressdaten auslesbar.

Facebook Snippet nero.com

Facebook Snippet nero.com

Google+ Snippet nero.com

Google+ Snippet nero.com

Bei SAP werden immerhin noch sechs OG Tag Typen verwendet.

Quelltext SAP

Quelltext SAP

Hervorgehoben sind hier die Tags „og:site_name“ und „fb:amins“. Das Site OG Tag definiert den für den Menschen lesbaren Seitennamen -> „SAP“.  Das og:site_name zählt ebenfalls zu den optionalen OG Tags.

SAP nutzt neben den basic und optionalen OG Tags ebenfalls das og:fb:admins Tag. Dieses Tag definierte eine kommagetrennte Liste der Facebook-Benutzer IDs oder auch Facebook Plattform-Applikations IDs, welche die Seite bedienen. Dieses Tag muss nur verwendet werden, wenn auf der Website ein bestimmtes Social Plugin wie z. B. Facebook Comments genutzt wird (und das auch nur dann, wenn dieses Plugin auf mehreren Unterseiten laufen soll).

Selters verwendet drei der Basic Tags sowie das Description Tag.

Mit dieser Befüllung des Open Graph Protokolls ist man als Seiteninhaber auf der sicheren Seite. Es werden die wichtigen Inhalte vorab klar defniert und die Suchmaschine spielt nur das aus, was vorab eingegeben wurde. Bei Facebook und Google+ sieht es dann wie folgt aus:

Facebook Snippet Selters

Facebook Snippet Selters

Google+ Snippet Selters

Google+ Snippet Selters

In der Description ist knapp und fokussiert der Mehrwert von Selters hervorgehoben worden (zertifierter Weinbegleiter). Damit wurde bestmöglich für das eigene Produkt geworben.

3 Best Practices

Neben Selters gibt es weitere Unternehmen, die selber aktiv bestimmen, wie und mit welchem inhaltlichen Material Fans für das Unternehmen werben können. Die folgenden Unternehmen haben in Sachen Call-to-Action und Description gute Beispiele gezeigt und sind daher als Orientierung gut geeignet.

Facebook Snippet Allianz

Facebook Snippet Allianz

Quelltext Allianz

Quelltext Allianz

Durch die Ausfüllung der wichtigsten Tags werden die Inhalte gezogen und angezeigt, mit denen das Unternehmen für sich werben will.

Google+ Snippet Allianz

Google+ Snippet Allianz

Ein weiteres Beispiel für die positive Nutzung der OG Tags ist Florena.

Facebook Snippet Florena

Facebook Snippet Florena

Florena bewirbt über die hinterlegten Open Graph Inhalte den Produktbereich „Natur hautnah erleben“, in dem auf der Homepage alle Produkte vorgestellt werden. Auch das ist eine sinnvolle Nutzung der OG Tags: Auf spezielle Produkte oder Aktionen hinweisen und das Interesse der Zielgruppe wecken.

Google+ Snippet Florena

Google+ Snippet Florena

Auf Google+ erscheinen die Inhalte von Florena ebenso gesteuert wie bei Facebook mit dem Unterschied, dass sich das Produktbild verändert hat. Es ist nicht das programmierte Facebook Bild, sondern das Bild, das sich Google eigenständig zieht. Grund hierfür kann trotz Bildhinterlegung die Eigenschaft des Bildes sein, die mit dem Facebook Logo bezeichnet ist. Bei Facebook wird diese Einstellung sofort erkannt, mit Google+ ist die Beschriftung nicht kompatibel, also zieht sich Google+ ein eigenes Bild.

Einen weiteren Unterschied zu dem Google+ Snippet der Allianz und Florena ist in der Erscheinung des Logos zu sehen. Das liegt an der Hinterlegung des Favicons. Das Faviconist ein Icon, das beim Aufruf ihrer Homepage angezeigt wird. Der Befehl <link rel=“shortcut icon“ href=“favicon.ico“/> ist zu den klassischen Meta Tags im Header platzierbar. Programmiert man das Icon nicht, dann erscheint bei Google+ wie im Falle von Florena nur die graue Weltkugel.

Ein gutes Beispiel für einen aktivierenden Description Text findet man bei Granini.

Facebook Snippet Granini

Facebook Snippet Granini

Der hinterlegte Text ist eigens für die OG Tag Programmierung angefertigt, der Text ist auf der Homepage sonst nicht zu finden und beinhaltet zwei direkte Call-to-Actions!

Quelltext Granini

Quelltext Granini

Auch die Gestaltung des Open Graph Protokolls sieht sehr strukturiert aus. Hier wurde nichts dem Zufall überlassen. Für die interne Strukturierung wurde der Facebook Bereich mit einer Überschrift versehen. Das unterstreicht auch die Praxis mit dem individuellen Text. Wenn öfter Texte angepasst werden ist es hilfreich, den Quelltextbereich für das Open Graph Protokoll so zu gestalten, dass man sich schnell und sicher zurechtfindet.

Google+ Snippet Granini

Google+ Snippet Granini

Kann man auch auf einem Bein stehen?

Bei Florena ist schon zu erkennen, dass trotz der Festlegung eines Bildes im OG Protokoll bei Google+ ein anderes Bild gezogen wird. Bei einigen der Top 100 deutschen Marken sieht es zum Teil nicht anders aus. Hier liegt jedoch der umgekehrte Fall vor, d. h. eine Nutzung von OG Tags ist auf eines reduziert, dennoch werden Snippets bei Facebook und Google+ wie definiert angezeigt.

Das beste Beispiel für diesen Fall findet man bei Becks. Das Unternehmen hat lediglich sein og: image angelegt, dennoch werden weitere Inhalte wie programmiert angezeigt.

Quelltext Beck's

Quelltext Beck’s

Facebook Snippet Beck's

Facebook Snippet Beck’s

Bei Facebook werden automatisch die richtige URL, der Title und eine passende Description gezogen.

Bei Lidl Deutschland bietet sich ein ähnliches Bild. Auch hier ist im Quelltext nur das og: image genutzt worden.

Facebook Snippet Lidl

Facebook Snippet Lidl

Bei Facebook sieht das Snippet noch relativ normal aus. Der Title und die URL sowie Keywords werden gezogehn, obwohl keine Description hinterlegt wurde. Bei Google+ hingegen ist das Snippet nur mit den Keywords ausgestattet, die man im Quelltext in den Meta Keywords findet.

Google+ Snippet Lidl

Google+ Snippet Lidl

Dennoch zieht sich Google Informationen und so erscheint ein noch halbwegs befülltes Snippet, aus dem zumindest die wichtigsten Schlagwörter für das Unternehmen erscheinen. Ob Lidl diese Bewerbung für sich optisch als gut gelungen einschätzt darf bezweifelt werden.

3 Worst Cases

Das Beispiel von Lidl hat schon deutlich gezeigt, dass keine oder unvollständig hinterlegten Inhalte zu einem unschönen Snipppet führen können. Grundsätzlich lässt sich feststellen, dass Facebook und Google+ intelligenter werden und sich eigenständig Informationen ziehen, auf die zugegriffen werden kann. Allerdings ist das nicht in allen Fällen so und man sollte sich nicht darauf verlassen.

Bei Porsche sind OG Tags nicht zu finden und dementsprechend sieht auch das Snippet bei Facebook aus.

Facebook Snippet Porsche

Facebook Snippet Porsche

Es werden nur ein Titel und die URL sowie ein Bild gezogen. Sieht dieses Snippet einladend aus? Entspricht das dem klassisch und sportlich eleganten Image der beliebten Marke? Nein.

Betrachtet man das Bild, so ist hier kein Anreiz zu erkennen und einen kurzen knappen Text, der vielleicht mit einem Call to Action versehen ist, vermisst der Porsche Fan auch. Hier wird einiges an Werbepotenzial verschwendet.

Schaut man sich die Snippets am Beispiel einer Länderseite an, dann sieht das Ergebnis noch dramatischer aus. Bei der Länderauswahl für Kolumbien wird nicht mal mehr ein Bild angezeigt und die URL ist abgeschnitten und somit unleserlich.

Das Snippet wirbt mit diesen Ergebnissen nicht wirklich für Porsche in Kolumbien. Gerade bei Facebook sind Inhalte mit starken Bildern sehr beliebt und gerne geteilt. Laut aktuellen Studien funktionieren kurze Texte mit einem aussagekräftigen Bild am besten und bringen die höchsten Interaktionsraten (http://goo.gl/nbvQu). Zudem hat Porsche eine eigene Facebook Page, die mit über 4,3 Millionen Fans das Interesse an der Marke deutlich wiederspiegelt. Im Bereich der OG Tag Hinterlegung zeigt Porsche allerdings einen sehr unprofessionellen Auftritt.

Nachdem die Länderseite bei Facebook sehr unschön aussieht, wird man bei Google+ fast positiv überrascht. Neben dem Favicon werden auch ein Bild und ein Text angezeigt. Dieser ist zwar nicht komplett zu lesen, aber der geneigte Interessent findet trotzdem einige Informationen. Hier ist deutlich zu sehen, dass Google+ mit dem Hintergrund von Google als Suchmaschine cleverer wird und sich zum Teil Inhalte selber zusammensuche kann.

Auch Faber-Castell reiht sich in die Liste der Worst Practices ein.

Facebook Snippet Faber-Castell

Facebook Snippet Faber-Castell

Bei dem Facebook Snippet kann der User sich 6 verschiedene Bilder angucken und übersieht wohl auch nicht, dass Faber–Castell eine Startseite hat. Die URL ist leider abgeschnitten und einen beschreibenden Text erhält man auch nicht.

Google+Snippet Faber-Castell

Google+Snippet Faber-Castell

Was bei der Länderseite für Kolumbien bei Porsche funktioniert hat, klappt bei Faber-Castell leider nicht. Hier wird lediglich als Title „Startseite“ gezogen und die Description reduziert sich auch nur auf „Startseite“. Ein Bild wird gar nicht mehr gezogen.

Für ein Traditionsunternehmen wie Faber-Castell ist hier noch deutliches Potenzial vorhanden. Mit einem attraktiven Flyer bei Facebook und Google+ sollte man für sich und die vielfältigen und hochwertigen Produkte aus dem eigenen Hause werben.

Ein Unternehmen, welches über die letzten Jahre deutlich seine Attraktivität in Sachen Design steigerte und zu einer beliebten Fashion Sport Marke avanicierte ist PUMA. Doch schaut man sich die Snippets an, mit denen indirekt für Puma geworben werden kann, dann erkennt man nur noch wenig von dem sonst so starken und wiedererkennbaren Design.

Facebook Snippet Puma

Facebook Snippet Puma

Facebook zieht sich insgesamt 21 Bilder, von denen eines zum Beispiel überhaupt gar nicht mit einem eigenen Produktbild wirbt. Im Beispiel Snippet ist das Twitter Logo zu erkennen. Wo sind die kraftvollen Designs, die man sonst von Puma gewöhnt ist? Würden die Puma-Verantwortlichen einen Flyer gestalten, bei dem das Twitter Logo im Vordergrund steht? Nein!

Fazit

Es gibt neben den drei benannten Worst Cases noch weitere Beispiele von großen Marken, die in Sachen Social Media und Online Marketing noch nicht die volle Kraft und den Nutzen für sich erkannt haben. Die erhobenen Daten beziehen sich zudem nur auf die Startseite. Welches Potenzial auf den einzelnen Unter- und Kategorieseiten schlummert, ist schnell zu ahnen. Und wie wichtig diese Bewerbung gerade für einzelne Produkte ist, steht außer Frage!

Es mag auf den ersten Blick vielleicht banal erscheinen, weil es sich nur um ein Snippet handelt, allerdings sind diese Beschreibungen immer eine Bewerbung der eigenen Marke. Gerade im Hinblick auf die Veränderungen im Internet, weg von Massencontent, hin zu qualitativ hochwertigem Inhalt, ist es für Unternehmen extrem wichtig, sich so zu präsentieren, dass auch hier Zielgruppen angesprochen und animiert werden, sich mit der Marke und deren Produkten auseinanderzusetzen.

Für Unternehmen sind daher die folgenden Fragen wichtig:

  • wo ist meine Zielgruppe unterwegs?
  • mit welchen Inhalten möchte ich im Internet zu finden sein? (Bilder, Content, etc.)
  • welche Produkte sollen wo beworben werden?
  • welchen Mehrwert bietet die Hinterlegung der OG Tags?
  • welches Potenzial bieten Fans, die Homepageinhalte teilen?

Eigenständig den Auftritt in sozialen Netzwerken zu regeln ist das A und O für ein Unternehmen, wenn es aktiv und erfolgreich im Online Marketing mit seiner Zielgruppe agieren will. Weil sich der Bereich Social Media mittlerweile fast täglich dynamisch verändert und ständig neue Chancen und Potenziale bietet, sollten sich Unternehmen bei ihren Aktivitäten in sozialen Netzwerken aktiv unterstützen lassen.