Social SEO: Die Grundausrüstung, Teil 2

Im letzten Expertentipp haben wir Ihnen den richtigen Einsatz von Social Media Buttons auf Ihrer Website erläutert http://blog.seitwert.de/social-seo-die-grundausrustung-teil-1/.

Im heutigen Expertentipp dreht sich alles um das optimale Vorschaubild Ihrer Inhalte in Facebook & Co. Denn gerade das verwendete Bildmaterial entscheidet mit darüber, ob Sie Besucher über Social Media auf Ihre Website locken und den Traffic über diesen Kanal um ein Vielfaches steigern oder nicht.

Technische Voraussetzungen für perfekte Linkbeiträge in Social Media

Sicherlich möchten Sie nicht, dass Ihr Linkbeitrag in Social Media so angezeigt wird, wie in diesem Beispiel:

vorschaubild-facebook-debugger-beispiel

Vorschau zu einem Linkbeitrag auf Facebook, Quelle: https://developers.facebook.com/docs/sharing/best-practices

Mit derartigen Beiträgen werden Sie mit Sicherheit kein Interesse wecken. Um dies zu vermeiden, bedarf es einiger Vorbereitungen. Ganz gleich, wie Ihre Inhalte aktuell angezeigt werden: Sollten Sie mit dem Ergebnis nicht zufrieden sein, prüfen Sie entsprechende URLs unter Verwendung des Facebook URL-Debuggers.

facebook-url-debugger

Der Facebook URL-Debugger: https://developers.facebook.com/docs/sharing/best-practices

Dieses praktische Tool zeigt Ihnen, welche Daten Facebook aus Ihrer Website auslesen kann. Tipp: Klicken Sie ruhig mehrfach auf die beiden Schaltflächen im Debugger, nachdem Sie Ihre Domain eingetragen und auf „Debug“ geklickt haben. Manchmal kommt es vor, dass beim ersten Aufruf nicht alle Daten abgeholt werden.

Sofern der Debugger die Daten auslesen kann, erhalten Sie eine Übersicht mit allen zur Verfügung stehenden Angaben. Zunächst ist der Bericht „Based on the raw tags, we constructed the following Open Graph properties“ interessant. Hier werden von Facebook alle Angaben angezeigt, die ausgelesen werden können, wie in diesem Beispiel

facebook-url-debugger-ergebnisse

Dabei handelt es sich um Meta-Tags (Auszeichnungen) aus dem Open Graph Protokoll. Hinweis: „og“ ist die Abkürzung von „Open Graph“ – Google verwendet das gleiche Protokoll. Die wichtigsten Tags sind:

  • og:url – Die URL zu Ihrem Beitrag
  • og:type – Um welche Art Website es sich handelt. Z.B.  wird zwischen Blog und Website unterschieden.
  • og:title – Der Title zu Ihrem Inhalt, den Sie bestenfalls auch für Suchmaschinen optimiert haben.
  • og:image – Das Bildmaterial, welches Facebook aus Ihrem Artikel extrahiert.
  • og:description – Die Description, ebenfalls wie der Title auch für Suchmaschinen optimiert.
  • og:updated_time – Dieses Tag brauchen Sie nicht auf Ihrer Website bereitzustellen. Facebook unterscheidet damit lediglich verschiedene Versionen Ihrer Inhalte. So kann es zum Beispiel sein, dass Sie Änderungen vorgenommen haben. Diese Änderungen teilen Sie Facebook durch Klicken auf die Schaltfläche „fetch new scrape information“ mit.

facebook-URL-Debugger-neue-informationen

Facebook unterscheidet außerdem zwischen weiteren Tags wie z.B. Video, App ID, lokal und mehr. Infos darüber erhalten Sie im Entwicklerbereich von Facebook unter https://developers.facebook.com/docs/sharing/webmasters

Die benötigten Tags tragen Sie im Kopfbereich Ihres Artikels nach diesem Schema ein:

<meta property=“og:url“ content=“Ihre URL“ />

<meta property=“og:type“ content=“Art des Inhalts“ />

<meta property=“og:title“ content=“Ihr Title“ />

<meta property=“og:description“ content=“Ihre Description“ />

<meta property=“og:image“ content=“URL Ihrer Bilder “ />

Falls Sie mit diesen Techniken nicht so vertraut sind, können Sie auf Erweiterungen bzw. Plugins in Ihrem Redaktionssystem zurückgreifen. Wir empfehlen, dass Sie im Vorfeld den Facebook URL Debugger verwenden. Sollten im Anschluss ihre Linkbeiträge in der Vorschau richtig angezeigt werden, brauchen Sie keine weiteren Veränderungen vorzunehmen.

Vor kurzem hat Facebook die Option eingeführt, dass ähnlich Caroussel-Ads mehrere Fotos angezeigt werden wie hier in diesem Beispiel. Probieren Sie dieses neue Feature aus und laden Sie gegebenenfalls weitere Bilder in die Vorschau.

Beitragsmaske-Facebook-Bilder

 

Twitter Cards für mehr Aufmerksamkeit

 

Auch im Kurznachrichtendienst Twitter lässt sich die Aufmerksamkeit Ihrer Follower durch die Anzeige von Vorschaubildern und weiteren Informationen zu Ihren Linkbeiträgen steigern. Dies geschieht durch den Einsatz von Twitter-Cards. Hier ein Beispiel von Twitter als mit einer Summary Card:

twitter-summary-card

Summary Card, Quelle: Twitter

 

Weitere Optionen für den Einsatz von Twitter Cards sind:

 

  • Summary Card with large image
  • Photo Card
  • Gallery Card
  • App Card
  • Player Card
  • Player Card: Approval Guide
  • Product Card

 

Ähnlich wie das Open Graph Protokoll funktionieren die Twitter Cards – diese nutzen wiederum eigene Meta Tags. Hier ein Beispielcode für eine Twitter Card „Summary Card with large image“:

<meta name=“twitter:card“ content=“summary_large_image“>

<meta name=“twitter:site“ content=“@Site-Owner“>

<meta name=“twitter:creator“ content=“@Autor“>

<meta name=“twitter:title“ content=“Seitentitel“>

<meta name=“twitter:description“ content=“Seitenbeschreibung“>

<meta name=“twitter:image“ content=“Vorschaubild“>

Sobald hinterlegt, können Sie im Vorfeld prüfen, ob ein Tweet zur Ihrer Seite bei Twitter mit den gewünschten Informationen angezeigt wird. Rufen Sie dazu den Card Validator von Twitter unter https://cards-dev.twitter.com/validator auf.

twitter-card-validator

Tragen Sie einfach die URL Ihrer Seite ein, um zu sehen, ob Ihre Twitter Card richtig angezeigt wird. Weitere Infos zum Einbau und Vorstellung der unterschiedlichen Twitter Cards finden Sie im Entwicklerbereich von Twitter unter https://dev.twitter.com/cards/getting-started.

Statt nun bei jedem neuen Inhalt die Meta Tags manuell einzutragen, lohnt sich der Einsatz von vorgefertigten Erweiterungen. Bei WordPress können z.B. die beiden Twitter Cards “Summary Card” und “Summary Card with large image”  ganz einfach mit einem Klick über das Plugin Yoast WordPress SEO https://yoast.com/wordpress/plugins/seo/ und zwar im Abschnitt „Social“ eingerichtet werden.

twitter-card-yoast

Tipp: Yoast WordPress SEO eignet sich ebenfalls sehr gut, um schnell und einfach die Meta Tags für Facebook, Pinterest und Google+ in Ihre Website einzutragen.

Die richtigen Maße für Vorschaubilder

Um Platz im Stream zu sparen, zeigt Facebook Fotos nur ein Querformat bei Linkbeiträgen in der Vorschau an. Das empfohlene Bild-Maß beträgt 1200 x 628 Pixel. Ähnliches gilt für Twitter. Achten Sie bei der Bildauswahl darauf, dass Ihre wichtigsten Bildaussagen in der Vorschau angezeigt werden. Hochformatige Portrait-Bilder können z.B. dazu führen, dass die im Bild dargestellte Person ohne Kopf im Vorschaubild angezeigt wird.

Im Netzwerk Google+ ist es wiederum egal, ob Sie ein Bild im Hoch- oder Querformat verwenden. In beiden Fällen zeigt Google das vollständige Bild an. Hier kann es sogar sein, dass Sie mit hochformatigen Bildern mehr Aufmerksamkeit erzielen, weil diese mehr Raum im Stream einnehmen.

Wir freuen uns, wenn Ihnen unsere Tipps zur Grundausrüstung Ihrer Website für Social Media dazu beitragen, dass Sie sich optimal in den sozialen Netzwerken präsentieren.

Sollten Sie Fragen zu diesem oder anderen Themen haben,  so sprechen Sie uns an. Wir beraten Sie gern! Sie erreichen uns telefonisch unter +49 211 749 50550 oder senden Sie uns eine E-Mail an info@seitwert.de – wir freuen uns auf Sie!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.