• NERD TALK: CONTENT LIEBE?! EINE ODE AN DIE OPEN-GRAPH-META-TAGS
  • Jan Peiniger Digital Creative / Blogger / Sport Addict
  • Digital Native Optimist Blogger pushing-limits.de Sport Addict Tech Nerd
  • pemediapemedia pemediaquintly quintly
  • pemedia GmbH Agentur für digitale Technologien Gründung: 2008 Teamstärke: 18
  • Technologie ist unser Antrieb!
  • TALK DIRTY TO ME! NERDY
  • Meta? … Tags? … WTF? Wofür sollen die nochmal gut sein?
  • Oberflächlich betrachtet Richtig eingesetzte og (Open Graph) meta tags sorgen dafür, dass Links zu eurem Content in den Social Networks entsprechend dargestellt werden.
  • So stellt man sich das vor:
  • Was passiert eigentlich,… wenn ich einen Link auf Facebook teile?
  • ... Hier kommt der Content
  • Soweit alles easy! Gut aussehen wollen wir ja alle.
  • MORE THAN MEETS THE EYE! The Open Graph Protocol
  • ogp.me "The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook."
  • Zwei Videos? Nö! og:type website og:type video
  • Multimedia Inhalte direkt im Newsfeed
  • Videos, Shops, Viewer… auf diese Weise sind multimediale Inhalte direkt im Newsfeed möglich. Auf dem Desktop leider nur unter der Nutzung von Flash. In den Smartphone-Apps besteht die Möglichkeit in native Apps zu linken oder auf spezielle HTML5 Landingpages zu verweisen.
  • Und was machen Blogs? og:type article
  • Und was machen Shops? og:type product
  • ... und viel, viel mehr: https://developers.facebook.com/docs/reference/opengraph/object-type/product/
  • Schonmal was von Open Graph Stories gehört? Wie man mit "Webseiten" interagieren kann.
  • Apps erlauben Interaktionen Ich lese, laufe, höre, kaufe, schaue, spiele, etc über og:title auf og:site_name
  • Noch ein letzter -tag Zwar kein og: aber trotzdem enorm nützlich. Er ermöglicht den Zugriff auf die Facebook Domain Insights und bietet tiefere Einblicke in die demographische Struktur der Seitenbesucher. facebook.com/inisghts (ganz nach unten scrollen)
  • One tag to rule them all:
  • Don't forget about Twitter! twittercards:
  • Auch Twitter kann "schön" Genau wie über Open-Graph-Objekte gibt es Twitter Cards in verschiedensten Ausführungen: Summary, Image, Gallery, App, Product, etc… dev.twitter.com/cards/overview
  • Hilfreiche Tools: Facebook URL Debugger: https://developers.facebook.com/tools/debug/ Facebook API Explorer: https://developers.facebook.com/tools/explorer/ Twitter Card Validator: https://cards-dev.twitter.com/validator
  • Be a Nerd! Mit ein technischem Wissen und Neugier lässt sich einfach mehr aus dem eigenen Content in der freien Wildbahn herausholen.
  • PEMEDIA GMBH DEVS & DESIGNERS WANTED!
Please download to view
All materials on our website are shared by users. If you have any questions about copyright issues, please report us to resolve them. We are always happy to assist you.
...

Content-Liebe auf den ersten Blick? Nur mit den richtigen OPENGRAPH META TAGS! #AFBMC

by allfacebookde

on

Report

Category:

Marketing

Download: 0

Comment: 0

28,352

views

Comments

Description

Download Content-Liebe auf den ersten Blick? Nur mit den richtigen OPENGRAPH META TAGS! #AFBMC

Transcript

  • NERD TALK: CONTENT LIEBE?! EINE ODE AN DIE OPEN-GRAPH-META-TAGS
  • Jan Peiniger Digital Creative / Blogger / Sport Addict
  • Digital Native Optimist Blogger pushing-limits.de Sport Addict Tech Nerd
  • pemediapemedia pemediaquintly quintly
  • pemedia GmbH Agentur für digitale Technologien Gründung: 2008 Teamstärke: 18
  • Technologie ist unser Antrieb!
  • TALK DIRTY TO ME! NERDY
  • Meta? … Tags? … WTF? Wofür sollen die nochmal gut sein?
  • Oberflächlich betrachtet Richtig eingesetzte og (Open Graph) meta tags sorgen dafür, dass Links zu eurem Content in den Social Networks entsprechend dargestellt werden.
  • So stellt man sich das vor:
  • Was passiert eigentlich,… wenn ich einen Link auf Facebook teile?
  • ... Hier kommt der Content
  • Soweit alles easy! Gut aussehen wollen wir ja alle.
  • MORE THAN MEETS THE EYE! The Open Graph Protocol
  • ogp.me "The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook."
  • Zwei Videos? Nö! og:type website og:type video
  • Multimedia Inhalte direkt im Newsfeed
  • Videos, Shops, Viewer… auf diese Weise sind multimediale Inhalte direkt im Newsfeed möglich. Auf dem Desktop leider nur unter der Nutzung von Flash. In den Smartphone-Apps besteht die Möglichkeit in native Apps zu linken oder auf spezielle HTML5 Landingpages zu verweisen.
  • Und was machen Blogs? og:type article
  • Und was machen Shops? og:type product
  • ... und viel, viel mehr: https://developers.facebook.com/docs/reference/opengraph/object-type/product/
  • Schonmal was von Open Graph Stories gehört? Wie man mit "Webseiten" interagieren kann.
  • Apps erlauben Interaktionen Ich lese, laufe, höre, kaufe, schaue, spiele, etc über og:title auf og:site_name
  • Noch ein letzter -tag Zwar kein og: aber trotzdem enorm nützlich. Er ermöglicht den Zugriff auf die Facebook Domain Insights und bietet tiefere Einblicke in die demographische Struktur der Seitenbesucher. facebook.com/inisghts (ganz nach unten scrollen)
  • One tag to rule them all:
  • Don't forget about Twitter! twittercards:
  • Auch Twitter kann "schön" Genau wie über Open-Graph-Objekte gibt es Twitter Cards in verschiedensten Ausführungen: Summary, Image, Gallery, App, Product, etc… dev.twitter.com/cards/overview
  • Hilfreiche Tools: Facebook URL Debugger: https://developers.facebook.com/tools/debug/ Facebook API Explorer: https://developers.facebook.com/tools/explorer/ Twitter Card Validator: https://cards-dev.twitter.com/validator
  • Be a Nerd! Mit ein technischem Wissen und Neugier lässt sich einfach mehr aus dem eigenen Content in der freien Wildbahn herausholen.
  • PEMEDIA GMBH DEVS & DESIGNERS WANTED!
Fly UP