====== Metadata ====== Übersicht über Protokolle/Formate mit denen Metadaten für unterschiedliche Zwecke (Suchmaschinen, Social Media Interaktionen, Webseiten Vorschau, Einbinden von Resourcen) in Webseiten eingebunden werden können. ===== Übersicht ===== * Google ersetzt bei den Breadcrums das erste Element durch die base URL der Seite (nicht der des ersten Elements) und lässt das letzte weg. * Firefox, Vivaldi und Chromium hängen ihren Namen mit "-" an '''' im Fenstertitel -> Am besten die Elemente im Title auch mit "-" Trennen. * Immer Canonical URLs setzen, es könnten ja auch andere Webseiten mit Query Parametern auf die Seite Verlinken und damit einen weiteren Eintrag in Suchmaschinen erzeugen. ==== Protokolle ==== ^ Protokoll ^ Vorschau meiner URL / Webseite mit ... |||||^ Semantische Auszeichnung\\ vom gesamten Dokument ^ Nutzer ^ | ::: ^ Title ^ Description ^ Thumbnail ^ Autor ^ Meinem HTML ^ Multimedia anstatt\\ Thumbnail | ::: | ::: | | schema.org | (V) | (V) | (V) | | (X) | | (V) | Suchmaschinen | | Open Graph | (V) | (V) | (V) | %%(%%(V)%%)%% | (X) | (V) | (X) | Sozial Media Platformen | | Twitter Cards | (V) | (V) | (V) | (X) | (X) | (V) | (X) | Sozial Media Platformen | | oEmbed | (V) | (X) | (V) | (V) | (V) | (V) | (X) | Alles was nicht Groß ist\\ (Private Blogs, News Seiten, ...) | ===== schema.org ===== * Gesponsort von Google, Bing, Yahoo und Yandex (vmtl. daher auch verwendung?) * Wird definitiv von Google verwendet ===== Open Graph ===== * Doku by [[http://ogp.me/|ogp.me]], [[https://developers.facebook.com/docs/sharing/webmasters|Facebook]] (und [[http://developer.mixi.co.jp/en/connect/mixi_plugin/mixi_check/spec_mixi_check/|mixi.jp]]) * ''<html prefix="og: http://ogp.me/ns#">'' nicht vergessen * Die Höhe/Breite eines Bildes dient dazu damit es beim ersten Aufruf schon richtig dargestellt wird. * ''og:url'' ist die Kanonische URL ===== Twitter ===== * [[https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/markup|Alle Tags]] * Twitter verwendet das Open Graph Metadatum, wenn das korrespondierende Twitter Datum fehlt. * Keine namespace definition in ''<html>'' (im gegensatz zu Open Graph) * Für summary Cards, einfach keine twitter Metatags definieren, sondern nur Open Graph * Cards werden ca. wöchentlich neu gecrawled, Für immage updates muss(?) man die URL ändern [([[https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/troubleshooting-cards]])] * Twitter verträgt kein ''name="title"'' und ''name="description"'' in den meta-Tags, Schema.org Attribute sind aber OK. ==== Standard tags ==== <WRAP center round important 60%> Twitters doku ist stark out-dated. Vmtl. gild: Alle Angaben der //summary// Card gelten für alle Cards (bis auf //twitter:image// bei //summary_large_image// Cards) </WRAP> ^ twitter:card ^ summary \\ (default) ^ summary_large_image ^ player ^ app ^ ^ twitter:title | 1 Zeile (Web) / 2 Zeilen (Mobile) || //(Keine Angabe)// | //(Nicht vorhanden)// | ^ twitter:description | 3 Zeilen (Web) / //Nicht Sichtbar// (Mobile) || Max 200 Zeichen || ^ twitter:image | 1:1; Min 144x144 | 2:1; Min 300x157 | Min 68.600 Pixel \\ (Seitenverhältnis wie player, Bild nur fallback) | //(Nicht vorhanden)// | ^ twitter:image:alt | Max 420 Zeichen ||| | Für alle Bilder gild: 4096x4096; <5MB; JPEG, PNG, WEBP und GIF (nicht animiert) ==== Spezielle Tags ==== Alle ungetestet * **twitter:player**: * **twitter:player:width**: * **twitter:player:height**: * **twitter:player:stream**: * **twitter:app:name:iphone**: * **twitter:app:id:iphone**: * **twitter:app:url:iphone**: * **twitter:app:name:ipad**: * **twitter:app:id:ipad**: * **twitter:app:url:ipad**: * **twitter:app:name:googleplay**: * **twitter:app:id:googleplay**: * **twitter:app:url:googleplay**: ==== Deprecated ==== * **twitter:site**: [(tw-dep-site-creator>[[https://twittercommunity.com/t/what-does-twitter-site-and-twitter-creator-tags-do/52696]])] * **twitter:site:id**: [(:tw-dep-site-creator)] * **twitter:creator**: [(:tw-dep-site-creator)] * **twitter:creator:id**: [(:tw-dep-site-creator)] * **twitter:domain**: [([[https://stackoverflow.com/a/32586464]])] ==== Weiteres ==== * **twitter:dnt**: "Do Not Track" Anweisung für Widgets. Hat nichts mit Cards zu tun [([[https://developer.twitter.com/en/docs/twitter-for-websites/webpage-properties/overview.html]])] ===== Analyse ===== * Das Analysescript: [[https://gist.github.com/Skrupellos/878a01242e985b965ec66927aba74608|metana.py]] * Wenn eine Description vorhanden war, war es immer die selbe. * Die YouTube Daten aus der Analyse könnten falsch sein. <hidden Ergebnis der Auswertung anzeigen (langer Text)> <code> ### https://www.youtube.com/user/RSFinternet <title> 1) Reporters sans frontières - YouTube meta - title 1) Reporters sans frontières meta - og:tite 1) Reporters sans frontières meta - twitter:title 1) Reporters sans frontières <h1> 1) Reporters sans frontières ### https://www.youtube.com/watch?v=5OOslRIRZ2k <title> 1) Press conference - 2016 World Press Freedom Index - Washington - YouTube meta - title 1) Press conference - 2016 World Press Freedom Index - Washington meta - og:tite 1) Press conference - 2016 World Press Freedom Index - Washington meta - twitter:title 1) Press conference - 2016 World Press Freedom Index - Washington <h1> 1) Press conference - 2016 World Press Freedom Index - Washington ### https://de.wikipedia.org/wiki/Reporter_ohne_Grenzen <title> 1) Reporter ohne Grenzen – Wikipedia <h1> 1) Reporter ohne Grenzen ### https://ebay.us/wWgf3M <title> 1) Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713 | eBay meta - og:tite 1) Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713 | eBay meta - twitter:title 1) Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713 <h1> 1) <span class="g-hdn">Details zu</span> Fotos für die Pressefreiheit 2018 Reporter ohne Grenzen e V 9783937683713 ### https://stackoverflow.com/q/1740341 <title> 1) semantic web - What is the difference between RDF and OWL? - Stack Overflow meta - og:tite 1) What is the difference between RDF and OWL? meta - twitter:title 1) What is the difference between RDF and OWL? <h1> 1) What is the difference between RDF and OWL? ### https://www.amazon.com/dp/1539836835 <title> 1) SAFETY GUIDE FOR JOURNALISTS A handbook for reporters in high-risk environments: United Nations Educational Scientific and Cultural Organization, Reporters Without Borders: 9781539836834: Amazon.com: Books meta - title 1) SAFETY GUIDE FOR JOURNALISTS A handbook for reporters in high-risk environments: United Nations Educational Scientific and Cultural Organization, Reporters Without Borders: 9781539836834: Amazon.com: Books ### https://www.imdb.com/title/tt1323594 <title> 1) Despicable Me (2010) - IMDb meta - title 1) Despicable Me (2010) - IMDb meta - og:tite 1) Despicable Me (2010) <h1> 1) Despicable Me <span id="titleYear">(2010)</span> ### https://twitter.com/skruppy_/status/1091814026416398337 <title> 1) Skruppy on Twitter: "1) https://t.co/CVOCYgV57g hatte Git repo mit ihrem code und Passwörtern im web root 😯2) Bounty = Gemeinnützige Spende (50% von Devs, Dankbarkeit und so) https://t.co/XaNeTHPkcF" meta - og:tite 1) Skruppy on Twitter <h1> 1) Skruppy ### https://twitter.com/skruppy_ <title> 1) Skruppy (@skruppy_) | Twitter <h1> 1) Skruppy ### https://www.instagram.com/reporterohnegrenzen <title> 1) Reporter ohne Grenzen (@reporterohnegrenzen) • Instagram photos and videos meta - og:tite 1) Reporter ohne Grenzen (@reporterohnegrenzen) • Instagram photos and videos ### https://www.instagram.com/p/BtV8o9fjkR8/ <title> 1) Reporter ohne Grenzen on Instagram: “Bundeswirtschaftsminister Peter #Altmaier reist am Wochenende nach #Ägypten. Er muss die #Freilassung aller wegen ihrer Arbeit inhaftierten…” meta - og:tite 1) Reporter ohne Grenzen on Instagram: “Bundeswirtschaftsminister Peter #Altmaier reist am Wochenende nach #Ägypten. Er muss die #Freilassung aller wegen ihrer Arbeit inhaftierten…” ### https://en.zalando.de/zalando-happy-birthday-gift-card-box-light-blue-zzgz000bs-k11.html <title> 1) Zalando HAPPY BIRTHDAY - Gift card box - light blue - Zalando.de meta - og:tite 1) HAPPY BIRTHDAY - Gift card box - light blue @ Zalando.de 🛒 meta - twitter:title 1) HAPPY BIRTHDAY - Gift card box - light blue - Zalando.de <h1> 1) HAPPY BIRTHDAY - Gift card box ### https://www.etsy.com/listing/645132564/monty-python-collage-t-shirt <title> 1) Monty Python Collage T Shirt | Etsy meta - og:tite 1) Monty Python Collage T Shirt <h1> 1) Welcome to Etsy! <h1> 2) Monty Python Collage T Shirt ### http://www.spiegel.de/kultur/gesellschaft/a-1244288.html <title> 1) Reporter ohne Grenzen: Mindestens 80 Journalisten 2018 getötet - SPIEGEL ONLINE meta - og:tite 1) Reporter ohne Grenzen: Weltweit mindestens 80 Journalisten getötet - SPIEGEL ONLINE - Kultur <h1> 1) Reporter ohne Grenzen: Mindestens 80 Journalisten 2018 getötet ### https://github.com/Skrupellos <title> 1) Skrupellos (Skruppy) · GitHub meta - og:tite 1) Skrupellos - Overview <h1> 1) Skruppy Skrupellos ### https://github.com/Skrupellos/sir <title> 1) GitHub - Skrupellos/sir: Sir Tificate will help you to do automated TLS certificate rollovers, including TLSA updates. meta - og:tite 1) Skrupellos/sir <h1> 1) Skrupellos / sir </code> </hidden>