Richtige Vorschaubilder für perfektes Teilen bei Facebook

von Jeannette Czarkowski (Kommentare: 0)

Facebook Vorschaubild

Überlassen Sie nichts dem Zufall! Damit Ihre geteilten Links die volle Aufmerksamkeit bekommen und auch besucht werden, muss das richtige Vorschaubild und die optimale Seitenbeschreibung aufgerufen werden.

Was Facebook beim Teilen macht

Facebook schaut auf der verlinkten Webseite nach passenden Bildern und ermittelt den Seitentitel sowie die Seitenbeschreibung. Das Ergebnis sehen Sie beim Teilen in der Vorschauansicht. Sie können die Bilder und weitere Angaben direkt beeinflussen und Ihren Wünschen anpassen. Der Schlüssel dazu sind die Facebook-OpenGraph Tags.

Nutzen Sie die Facebook – OpenGraph Tags

Die OpenGraph Tags sagen Facebook welche Informationen über einen Link in der Vorschauansicht angezeigt werden sollen. Es gibt verschiedene Tags. Relevant für unser Problem sind folgende Tags:

„og:image“ – teilt Facebook mit, welches Bild in der Vorschauansicht verwendet werden soll
„og:titel“ - beschreibt den Namen der Webseite – den Seitentitel
„og:description“ - dient der Beschreibung der Webseite

Weitere Tags wichtige Tags sind:

„og:url“ - bezeichnet die URL der Webseite
„og:type“ - beschreibt den Typ z. B. „website“ oder „blog“
„og:site_name“ - bezeichnet den Namen der Webseite

Weitere Informationen finden Sie hier: http://ogp.me.

Wo und wie füge ich die OpenGraph Tags ein?

Die Tags fügen Sie in den Head-Bereich Ihrer Webseite ein.

Ein Beispiel für die Schreibweise der Tags:

<meta property="og:image" content="http://jbwebart.de/facebook.jpg" />
<meta property="og:url" content="http://jbwebart.de/" />
<meta property="og:site_name" content="jbwebArt - Jeannette Sachse" />
<meta property="og:title" content="Webseite der Berliner Webdesignerin Jeannette Sachse" />
<meta property="og:description" content="Moderne Webseiten die Ihre Kunden erreichen und begeistern" />
<meta property="og:type" content="website" />

Tipp! Die aktuellen Maße für das Vorschaubild betragen 1200x630 Pixel oder 600x315 Pixel.

Sie nutzen das Content-Management-System Contao? Prima!

Speziell für Contao Nutzer hier eine einfache Anleitung ohne ein Plugin bemühen zu müssen:

Wählen Sie in den Backendmodulen unter ->Layout ->Themes das entsprechende Seitenlayout und fügen Sie die Tags im Bereich „Zusätzliche <head>-Tags“ ein.

<meta property="og:image" content="ihrpfadzumbild/files/bild.jpg" />
<meta property="og:url" content="http://dieurlihrerwebseite.de" />
<meta property="og:site_name" content="Fügen Sie hier den Namen Ihrer Webseite ein" />
<meta property="og:title" content="Fügen Sie hier Ihren Seitentitel ein" />
<meta property="og:description" content="Fügen Sie hier Ihre Seitenbeschreibung ein" />
<meta property="og:type" content="website" />

Automatisieren kann man die Ausgabe mit den Insert-Tags von Contao. Ein Beispiel sehen Sie hier:

Sie nutzen WordPress?

Hier gibt es z. B. das Plugin „WordPress SEO by Yoast“. Mit diesem Plugin können Sie auch die OpenGraph Tags und ein Vorschaubild hinzufügen. In den Plugin-Einstellungen zu finden unter ->Social ->Facebook.

Damit jetzt aber unsere Bemühungen beim Teilen sichtbar werden, müssen wir den Facebook-Cache aktualisieren :-) Das machen wir mit dem Facebook Sharing Debugger.

UPDATE!

Den Facebook Sharing Debugger nutzen

Den Facebook Sharing Debugger finden Sie hier: https://developers.facebook.com/tools/debug

  1. Geben Sie in der Eingabemaske die Url ein, die aktualisiert werden soll. Klicken Sie auf „Fehlerbehebung“.

  2. Auf der nächsten Seite zeigt Facebook Ihnen welche Informationen sich im Cache befinden. Mit Klick auf „Scrape Again“ werden die von Ihnen angelegten neuen Informationen eingelesen. Nun sollte alles Ihren Vorstellungen entsprechen.

  3. Am besten gleich ausprobieren und teilen :-)

Screenshot Facebook Sharing Debugger

Der neue Batch Invalidator von Facebook

Es gibt wieder ein neues Tool welches uns die Arbeit mit Facebook erleichtert. Bislang konnte nur eine Url mit dem Sharing Debugger aktualisiert werden. Mit dem neuen Batch Invalidator können wir gleich eine ganze Liste, sprich mehrere Url´s auf einen Streich aktualisieren.

Den Batch Invalidator finden Sie hier: https://developers.facebook.com/tools/debug/sharing/batch

  1. Geben Sie in der Eingabemaske die Url´s ein, die Sie aktualisieren möchten.

  2. Klicken Sie auf „Fehlerbehebung“.

  3. Die eingegebenen Url´s werden nun aktualisiert. Darunter listet das Tool zu jeder Url auf, ob es Probleme gibt. Allerdings werden Probleme mit dem Open Graph Tags hier nicht erfasst. Dazu benötigt man den Sharing Debugger. Mit Klick auf "Details anzeigen" landet man dann wieder beim Sharing Debugger.

Screenshot Facebook Batch Invalidator

Hat Ihnen mein Beitrag weitergeholfen oder haben Sie Anregungen? Dann hinterlassen Sie doch einen Kommentar oder sprechen Sie mich an. Ich freue mich auf Ihre Meinung.

Viel Spaß beim Teilen.

Ihre Jeannette Sachse

Zurück

Damit Sie weiterhin gut informiert sind → jetzt Newsletter abonnieren.
Informationen zu PHP-Versionen, Contao-Updates und Praxistipps für Contao-Nutzer.

Was ist die Summe aus 7 und 6?

Der Newsletter wird ca. 1x monatlich versandt, ist kostenlos und kann jederzeit abbestellt werden. Weitere Informationen finden Sie in der Datenschutzerklärung.