Alien Road Company

Open Graph: Erstellen Sie auffällige Social-Media-Snippets

Open Graph: Erstellen Sie auffällige Social-Media-Snippets

Jeder möchte Inhalte erstellen, die auffallen, die Markenbekanntheit fördern und in der Online-Marketing-Welt leicht zu teilen sind.

Open Graphs-Tags sind eine Möglichkeit, mehr Aufrufe in sozialen Medien zu erzielen. Diese nützlichen Tags bestimmen, wie Ihre Linkvorschauen in sozialen Medien angezeigt werden. Wenn jemand einen Link von Ihrer Website teilt, sieht er die wichtigsten Teile Ihrer Webseite in der Vorschau.

Was ist Open Graph?

2010 führte Facebook Open Graph-Meta-Tags ein, um das Teilen von Websites auf der Plattform zu erleichtern. Twitter und LinkedIn haben seitdem Open Graph-Meta-Tags übernommen, um die Benutzererfahrung zu verbessern.

Wenn Sie eine URL in ein Facebook-Eingabefeld einfügen, wird wahrscheinlich eine Linkvorschau angezeigt. Vor Open Graph-Meta-Tags hatten Sie keine Kontrolle darüber, wie Ihre Linkvorschau angezeigt wurde, und manchmal zeigte Facebook den falschen Inhalt an.

Open Graphs-Meta-Tags helfen Benutzern, ihre Social-Media-Linkvorschauen zu optimieren, sodass Benutzer immer die wesentlichen Informationen sehen.

In den folgenden Bildern sehen wir ein Beispiel für Meta-Tags, die in den Code einer Webseite eingefügt sind. Wenn jemand die URL zu dieser Webseite auf Facebook postet, sehen wir eine stilisierte Linkvorschau:

Warum sind Open Graph-Tags wichtig?

Soziale Medienkanäle sind eine stetige Quelle für Webverkehr und Conversions. Mit der richtigen Mischung aus Strategie und Design können Sie Benutzer davon überzeugen, zu Ihrer Website durchzuklicken, um mehr über Ihre Marke zu erfahren, einen Kauf zu tätigen und vieles mehr.

Open Graph-Meta-Tags verbessern die Linkvorschauen Ihrer Webseite auf eine Weise, die die Aufmerksamkeit Ihres Publikums erregt. So sieht eine Linkvorschau für eine Webseite ohne Open Graph-Meta-Tags auf Facebook aus:

Sehen wir uns eine Linkvorschau für eine Webseite mit Open Graph an. Im Vergleich dazu sehen wir ein größeres Bild und eine fettgedruckte Überschrift sowie eine gekürzte URL.

So verwenden Sie Open Graph

Facebook listet in seiner offiziellen Dokumentation 17 Open Graph-Tags auf, aber nur vier sind erforderlich, damit Facebook Ihre Webseite versteht. Sie verwenden die Tags, indem Sie sie im Backend der Webseite zwischen die -Tags setzen.

Die vier erforderlichen Tags sind:

OG: Titel für den Titel des Artikels

OG: Typ, um den Typ des Objekts anzugeben, das Sie hochladen (Artikel, Video usw.)

OG: Bild für die URL des Hauptbilds

OG: URL, um die tatsächliche URL anzugeben, zu der der Benutzer weiterklickt

Sie können Verwenden Sie andere OG-Tags, wie:

OG: Audio (verbinden Sie eine Audiodatei mit Ihrem Beitrag)
OG: Beschreibung (fügen Sie eine kurze Beschreibung hinzu)
OG: Determinator (geben Sie das Wort an, das in einem Satz vor dem Titel des Objekts erscheint)
OG: Site-Name (listen Sie die Site auf, von der das Objekt stammt)
Andere Formen von Open Graph
Twitter Cards

Twitter Cards funktionieren ähnlich wie Open Graph, da Sie anpassen können, wie Ihre Linkvorschauen in Tweets erscheinen. Wenn Sie eine URL in das Eingabefeld von Twitter einfügen, werden automatisch ein Titel und ein Hauptbild generiert:

Sie können weiterhin Open Graph-Tags mit Twitter verwenden; die Plattform implementiert lediglich ihr eigenes Tag-System vor Open Graph.

Twitter Cards haben jedoch eine Anforderung: Bilder sollten eine Größe von 1024 x 512 Pixeln haben. Sie können das Erscheinungsbild Ihrer Twitter Card mit dem Card Validator überprüfen.

Testen Ihrer Open Graph-Ergebnisse

Es kann hilfreich sein, Ihre Open Graph-Implementierung zu testen, um sicherzustellen, dass sie beim Posten funktioniert. Zum Testen stehen Ihnen einige Optionen zur Verfügung, darunter:

Site Audit Tool

Das Site Audit Tool umfasst über 120 Onpage- und technische SEO-Checks für jeden Teil Ihrer Website. Ein solcher Check gibt an, wie viele Ihrer geprüften Seiten Open Graph-Markups haben.

So beginnen Sie mit dem Site Audit Tool:

Rufen Sie das Site Audit Tool über das Dashboard Ihres Projekts auf. (Wenn Sie kein Projekt eingerichtet haben, müssen Sie ein Projekt für Ihre Website erstellen, um das Site Audit Tool verwenden zu können.)
Konfigurieren Sie die Einstellungen des Audits über die Einstellungsfelder des Tools. Sie können den Crawling-Umfang des Audits festlegen und alle nicht zugelassenen Seiten einschließen. Wählen Sie „Site Audit starten“ aus.
Wenn das Audit abgeschlossen ist, verwenden Sie den thematischen Markup-Bericht auf der Registerkarte „Übersicht“, um alle Seiten mit Open Graph-Markup anzuzeigen:

Aus dem obigen Beispiel geht hervor, dass 78 % der Seiten kein Markup haben. Wenn Ihre Ergebnisse ähnlich aussehen, sollten Sie erwägen, Ihren wichtigsten Seiten Open Graph-Markup hinzuzufügen.

Facebook Object Debugger

Da Facebook das Open Graph-Protokoll verwendet, um zu bestimmen, was angezeigt werden soll, wenn ein Link verfügbar ist, bietet das Unternehmen ein Debugger-Tool zum Testen Ihres Open Graph-Codes. So verwenden Sie das Tool:

Navigieren Sie zum Debugger-Tool von Facebook.
Geben Sie die URL der Seite ein, die Sie scrapen und untersuchen möchten.
Wählen Sie Debug.

Wenn es Probleme mit Ihrem Link gibt, gibt das Tool eine Warnmeldung zurück:

Weitere Möglichkeiten zum Überprüfen strukturierter Daten
Twitter Card Validator
LinkedIn PostInspector
Google Rich Snippets-Testtool
OpenGraph für Ruby
OpendGraph für Java
Wichtige Erkenntnisse

Open Graph ist eine einfache Ergänzung Ihrer Webseite, die bemerkenswerte Ergebnisse für Ihre Marketingkampagnen bringen kann. Das Erscheinen Ihrer Inhalte in sozialen Medien kann mehr Benutzer anziehen und diese schließlich in Verkäufe umwandeln.

Wenn Sie neu in der Arbeit mit Open Graph-Code sind, gibt es viele Tools, mit denen Sie testen können, ob Ihre Implementierung funktioniert. Probieren Sie ein Site-Auditing-Tool oder ein beliebiges Tool aus, mit dem Sie Ihre strukturierten Daten überprüfen können.

Tags:

Leave A Comment