Twitter Cards

  • View
    481

  • Download
    0

Embed Size (px)

DESCRIPTION

Vortrag zum Einsatz Twitter-spezfischer Metadaten auf Websites, sogenannten Twitter Cards, zur Erzeugung von erweiterten (expanded) Tweets. Er wurde als Session von Lars R. H. Müller auf dem BarCamp am 16. August 2013 in Kiel gehalten.

Text of Twitter Cards

  • 1. Twitter Cards Referent: Lars R. H. Mller BarCamp Kiel 16. August 2013

2. Folie 2 Vorstellung Lars R. H. Mller Grnder und Geschftsfhrer 33 Jahre, verheiratet, zwei Tchter Studienabbrecher, Autodidakt Web- und Interfacedesigner Fachgruppenleiter Online-Marketing DiWiSH Blogger: Newsletter und Weizenbier 3. Wo fing das an? Was ist passiert? Und warum hast du recherchiert? 4. Folie 4 5. Folie 5 6. Folie 6 https://dev.twitter.com/docs/cards 7. Was sind Twitter Cards? Einmal im Schnelldurchlauf 8. Folie 8 Was sind Twitter Cards? "Anhnge" fr Tweets Einfache Metadaten Ergnzung des Open Graph Eigener URL Crawler Verbindung zu anderen Apps Mehr Aufmerksamkeit Noch nicht weit verbreitet 9. Folie 9 Twitter Card Typen Summary Card summary Large Image Summary Card summary_large_image Photo Card photo Gallery Card gallery App Card app Player Card player Product Card product 10. (Large Image) Summary Card Geeignet fr aktuelle Inhalte 11. Folie 11 Basics 1. Festlegen des Typen (Default = summary) 2. Twitter-Account der Website / des Herausgebers 3. Twitter-Account des Autors 12. Folie 12 Details vs. Open Graph 1. Titel der Seite (max. 70 Zeichen) 2. Kurzbeschreibung des Inhalts (max. 200 Zeichen) 3. URL eines reprsentativen Bildes (max. 120 px / 1 MB) 13. Folie 13 14. Folie 14 15. Product Card Geeignet fr Shops und E-Commerce 16. Folie 16 Beispiel Product Card 1. Festlegen des Typen 2. bergabe des ersten Wertepaares (z.B. Preis) 3. bergabe des zweiten Wertepaares (z.B. Farbe) 17. Folie 17 18. Ntzliches Tests, Crawler-Kontrolle, weitere Quellen 19. Folie 19 https://dev.twitter.com/docs/cards/validation/validator 20. Folie 20 Crawler Der Twitterbot beachtet die robots.txt Beispiel User-agent: Twitterbot Disallow: User-agent: * Disallow: / Sperrt alle Bots auer Twitter aus 21. Folie 21 Weitere Quellen Open Graph Protocol http://ogp.me/ http://developers.facebook.com/docs/opengraph/ schema.org http://schema.org/ Rich Pins http://developers.pinterest.com/rich_pins/ 22. Vielen Dank fr eure Aufmerksamkeit Lars R. H. Mller mueller@webworx.de twitter.com/larsicz www.webworx.de