Leitfaden zum Teilen für Webmaster

In diesem Dokument wird beschrieben, wie du im Web gehosteten Inhalt, den Personen auf Facebook teilen, optimieren kannst – unabhängig davon, ob von zuhause oder unterwegs, ob Web oder mobile App.

In diesem Dokument findest du Informationen zu folgenden Themen:

Open Graph-Markup

Die meisten Inhalte werden als URL auf Facebook geteilt. Aus diesem Grund ist es wichtig, dass du deine Webseite mit Open Graph-Tags versiehst, um die Kontrolle darüber zu haben, wie dein Inhalt auf Facebook angezeigt wird.

Ohne diese Tags verwendet der Facebook-Crawler interne Heuristiken, um Titel, Beschreibung und Vorschaubild für deinen Inhalt nach bestem Wissen automatisch auszuwählen. Du kannst diese Informationen mit Open Graph-Tags festlegen, um die höchstmögliche Qualität der Beiträge auf Facebook zu gewährleisten.

Hier ist ein Beispiel für mit Open Graph-Tags zur optimalen Anzeige auf Facebook formatierten Inhalt:

Markup-Beispiel

Hier siehst du beispielsweise, wie ein Artikel, ein Nachrichtenbeitrag oder ein Blogeintrag mit og:type="article" und verschiedenen anderen Eigenschaften versehen wird:

<meta property="og:url"                content="http://www.nytimes.com/2015/02/19/arts/international/when-great-minds-dont-think-alike.html" />
<meta property="og:type"               content="article" />
<meta property="og:title"              content="When Great Minds Don’t Think Alike" />
<meta property="og:description"        content="How much does culture influence creative thinking?" />
<meta property="og:image"              content="http://static01.nyt.com/images/2015/02/19/arts/international/19iht-btnumbers19A/19iht-btnumbers19A-facebookJumbo-v2.jpg" />

Die Eigenschaften beinhalten beschreibende Metadaten zu dem Artikel, die wir präsentieren möchten, wenn jemand den Artikel teilt.

Grundlegende Tags

Dies sind die grundlegendsten Meta-Tags, die du für alle Inhaltsarten verwenden solltest:

Tag Beschreibung

og:url

Die kanonische URL für deine Seite. Hierbei muss es sich um die URL ohne Anhänge handeln – also ohne Sitzungsvariablen, Parameter zur Nutzeridentifizierung oder Zähler. „Gefällt mir“-Angaben und Teilvorgänge für diese URL werden unter dieser URL zusammengefasst. Beispiel: URLs mobiler Domains sollten auf die Desktop-Version der URL als kanonische URL verweisen, um „Gefällt mir“-Angaben und Teilvorgänge über die verschiedenen Versionen der Seite hinweg zusammenzufassen.

og:title

Der Titel deines Artikels ohne Branding (z. B. der Name der Webseite).

og:description

Eine kurze Beschreibung des Inhalts – für gewöhnlich zwei bis vier Sätze. Diese Information wird unter dem Titel des Facebook-Beitrags angezeigt.

og:image

Die URL des Bildes, das angezeigt werden soll, wenn jemand den Inhalt auf Facebook teilt. Weiter unten findest du weitere Informationen. In unserem Leitfaden mit Best Practices erfährst du darüber hinaus, wie du ein qualitativ hochwertiges Vorschaubild festlegst.

fb:app_id

Um die Facebook-Insights zu nutzen, musst du die App-ID zu deiner Seite hinzufügen. Über Insights kannst du Analysedaten für den von Facebook stammenden Traffic deiner Webseite einsehen. Die App-ID findest du in deinem App Dashboard.


Es empfiehlt sich darüber hinaus, zwei zusätzliche Tags hinzuzufügen, um die Verteilung deines Inhalts zu verbessern und die Interaktion zu steigern:

Tag Beschreibung

og:type

Der Medientyp deines Inhalts. Dieses Tag beeinflusst, wie dein Inhalt im News Feed angezeigt wird. Wenn du keinen Typ angibst, wird der Standardtyp website verwendet. Bei jeder URL muss es sich um ein einzelnes Objekt handeln. Mehrere og:type-Werte sind also nicht möglich. Die vollständige Liste von Objekttypen findest du in unserer Referenz zu den Objekttypen.

og:locale

Die Ländereinstellung der Ressource. Dieser Wert lautet standardmäßig en_US. Du kannst auch og:locale:alternate verwenden, wenn Übersetzungen in anderen Sprachen verfügbar sind. Weitere Informationen zu den unterstützten Sprachen findest du in der Dokumentation zur Lokalisierung.


Eine vollständige Liste der standardmäßigen Objekteigenschaften findest du in unserer Referenz zu den Objekteigenschaften.

Testen deines Markup

Um zu überprüfen, wie der Facebook-Crawler dein Markup liest, gib eine URL in den Sharing Debugger ein. Dieser zeigt an, welche Meta-Tags der Crawler ausliest und welche Fehler aufgetreten sind.

Der Debugger löst darüber hinaus eine Auslesung deiner Seite aus – wenn also im HTML-Code deiner Seite Fehler enthalten sind, kannst du den Debugger zum Aktualisieren deines Inhalts nutzen. Weitere Informationen hierzu findest du unter Aktualisieren von Objekten.

Arten von Medieninhalten

Du kannst auch zusätzliche Tags hinzufügen, wenn deine Webseite Audio-/Videoinhalte oder Standortinformationen enthält. Eine Liste aller standardmäßigen Objekteigenschaften findest du in unserer Referenz zu den Objekttypen.

Video

Du kannst og:video für alle Inhaltsarten verwenden. In diesem Abschnitt wird beschrieben, wie du zusätzliche Tags zum Optimieren der Videoanzeige auf Facebook einsetzen kannst. Facebook unterstützt sowohl MP4- als auch Flash-Videos.

Verwende für die Tags og:video:url und og:video:secure_url eine sichere URL, damit deine Videos direkt im News Feed abgespielt werden können. Beachte, dass das Abspielen im News Feed aufgrund verschiedener Faktoren nicht garantiert werden kann.

Meta-Tag Beschreibung

og:video

Die URL für das Video. Wenn das Video direkt im News Feed abgespielt werden soll, musst du, wenn möglich, eine URL mit „https://“ verwenden.

og:video:url

Entspricht og:video

og:video:secure_url

Die sichere URL für das Video. Gib diesen Wert auch dann an, wenn du die sichere URL in og:video festgelegt hast.

og:video:type

MIME-Typ des Videos. Entweder application/x-shockwave-flash oder video/mp4.

og:video:width

Breite des Videos in Pixel. Diese Eigenschaft ist für Videos erforderlich.

og:video:height

Höhe des Videos in Pixel. Diese Eigenschaft ist für Videos erforderlich.

og:image

Gib ein Bild für eine Vorschau in hoher Qualität im News Feed an.


Bilder

Verwende diese Reihe von Eigenschaften für Inhalte, die mehr als ein Bild enthalten. Informationen zur optimalen Verwendung von og:image findest du in unseren Best Practices zum Teilen.

Meta-Tag Beschreibung

og:image

URL für das Bild. Um ein Bild zu aktualisieren, nachdem es veröffentlicht wurde, verwende eine neue URL für das neue Bild. Bilder werden basierend auf der URL zwischengespeichert und erst aktualisiert, wenn sich die URL ändert.

og:image:url

Entspricht og:image

og:image:secure_url

https://-URL für das Bild.

og:image:type

MIME-Typ des Bildes. image/jpeg, image/gif oder image/png

og:image:width

Breite des Bildes in Pixel. Gib die Höhe und Breite deines Bildes an, um zu gewährleisten, dass das Bild ab dem ersten Teilvorgang optimal geladen wird.

og:image:height

Höhe des Bildes in Pixel. Gib die Höhe und Breite deines Bildes an, um zu gewährleisten, dass das Bild ab dem ersten Teilvorgang optimal geladen wird.