<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="https://notiz.blog/wp-content/plugins/pretty-feeds/pretty-feed-v4.xsl" type="text/xsl" media="screen" ?>


<!--

	Feeds whisper secrets,
	In the RSS Club's embrace,
	Knowledge blooms in grace.

-->

<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:source="http://source.scripting.com/"
xmlns:creativeCommons="http://backend.userland.com/creativeCommonsRssModule"
>

<channel>
	<title>Metadaten &#8211; notizBlog</title>
	<atom:link href="https://notiz.blog/tag/metadaten/feed/" rel="self" type="application/rss+xml" />
	<link>https://notiz.blog</link>
	<description>a weblog mainly about the open, portable, interoperable, small, social, synaptic, semantic, structured, distributed, (re-)decentralized, independent, microformatted and federated social web</description>
	<lastBuildDate>Wed, 03 Apr 2024 10:46:28 +0000</lastBuildDate>
	<language>de</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>

<image>
	<url>https://notiz.blog/wp-content/uploads/2019/10/cropped-notizblog-icon-1-32x32.png</url>
	<title>Metadaten &#8211; notizBlog</title>
	<link>https://notiz.blog</link>
	<width>32</width>
	<height>32</height>
</image> 
<source:blogroll>https://reader.pfefferle.org/i/?a=opml&amp;get=c_2</source:blogroll>
<creativeCommons:license>https://creativecommons.org/licenses/by-sa/4.0/</creativeCommons:license>
<atom:link rel="hub" href="https://pubsubhubbub.appspot.com"/>
<atom:link rel="hub" href="https://pubsubhubbub.superfeedr.com"/>
<atom:link rel="hub" href="https://switchboard.p3k.io/"/>
<atom:link rel="self" href="https://notiz.blog/tag/metadaten/feed/"/>
<atom:link rel="search" type="application/opensearchdescription+xml" title="Search notizBlog" href="https://notiz.blog/wp-api/opensearch/1.1/document" />	<item>
		<title>TwitterCards minus TwitterCards</title>
		<link>https://notiz.blog/2013/05/03/twittercards-minus-twittercards/</link>
					<comments>https://notiz.blog/2013/05/03/twittercards-minus-twittercards/#comments</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Fri, 03 May 2013 06:21:14 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[FediBlog]]></category>
		<category><![CDATA[Metadaten]]></category>
		<category><![CDATA[Open Graph Protocol]]></category>
		<category><![CDATA[Twitter]]></category>
		<category><![CDATA[Twitter Cards]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=5105</guid>

					<description><![CDATA[Ich war nie ein großer Fan der Twitter Cards, was aber nicht wirklich schlimm ist, da Twitter das Open Graph Protocol als vollwertiges Fallback unterstützt&#8230; unterstützt hat&#8230; Seit ein paar Wochen scheint den feinen Herren das Open Graph Protocol aber nicht mehr auszureichen und meinen Links fehlt der schöne, kleine Teaser 🙁 Zum Glück reicht [&#8230;]]]></description>
										<content:encoded><![CDATA[
<figure class="wp-block-image aligncenter size-full wp-image-5107"><a href="http://garfieldminusgarfield.net/post/26271055"><img fetchpriority="high" decoding="async" width="500" height="148" sizes="(max-width: 500px) 100vw, 500px" src="https://notiz.blog/wp-content/uploads/2013/04/garfield-minus-garfield.png" alt="Garfield minus Garfield comic" class="wp-image-5107" srcset="https://notiz.blog/wp-content/uploads/2013/04/garfield-minus-garfield.png 500w, https://notiz.blog/wp-content/uploads/2013/04/garfield-minus-garfield-480x142.png 480w" /></a>
	<figcaption> Image from Garfield minus Garfield</figcaption>
</figure>



<p>Ich war nie ein <a href="https://notiz.blog/2012/06/22/twitter-cards/">großer Fan der <em>Twitter Cards</em></a>, was aber nicht wirklich schlimm ist, da Twitter das <em>Open Graph Protocol</em> als vollwertiges Fallback unterstützt&#8230; unterstützt hat&#8230;</p>



<p>Seit ein paar Wochen scheint den feinen Herren das <em>Open Graph Protocol</em> aber nicht mehr auszureichen und meinen Links fehlt der schöne, kleine Teaser 🙁</p>



<p>Zum Glück reicht aber ein Meta-Tag um das ganze wieder zum laufen zu bekommen. Twitter unterstützt verschiedene Arten von Previews, welche über <code>&lt;meta name="twitter:card" content="summary" /></code> festgelegt werden. Neben <code>summary</code> (für Texte) gibt es auch noch <code>photo</code> für Bilder und <code>player</code> für Audio/Video (die komplette Liste findet ihr <a href="https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards">hier</a>). Ich würde euch außerdem noch den <code>twitter:creator</code> empfehlen, mit dem ihr auf den Twitter-Account des Autors hinweisen könnt. Für meinen Blog sieht das wie folgt aus:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"twitter:creator"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"@pfefferle"</span> /&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"twitter:card"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"summary"</span> /&gt;</span></code></span></pre>


<p>Wenn ihr sicher gehen wollt ob ihr alles richtig gemacht habt, könnt ihr eure Seite mit dem <em><a href="https://cards-dev.twitter.com/validator">Twitter Card Validator</a></em> testen.</p>



<p>Den WordPresslern unter euch kann ich außerdem folgende Plugins empfehlen:</p>



<ul class="wp-block-list">
	<li><a href="http://wordpress.org/extend/plugins/opengraph/">Open Graph</a> &#8211; Keine Settings, kein Know-How, alles vollkommen Idiotensicher.</li>
	<li><a href="https://github.com/pfefferle/twitter-creator">twitter:creator</a> &#8211; Setzt zusätzlich die angesprochenen <code>twitter:creator</code> und <code>twitter:card</code>.</li>
</ul>



<p>&#8230;also viel Spaß beim <em>Twitter Cards</em> Boykott ;).</p>
<p>Thanks for reading this post via RSS. RSS is great, and you’re great for using it. ♥️</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2013/05/03/twittercards-minus-twittercards/feed/</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
			</item>
		<item>
		<title>Twitter Cards</title>
		<link>https://notiz.blog/2012/06/22/twitter-cards/</link>
					<comments>https://notiz.blog/2012/06/22/twitter-cards/#comments</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Fri, 22 Jun 2012 13:49:55 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[Dublin Core]]></category>
		<category><![CDATA[Facebook]]></category>
		<category><![CDATA[FediBlog]]></category>
		<category><![CDATA[Metadaten]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[OpenGraphProtocol]]></category>
		<category><![CDATA[Twitter]]></category>
		<category><![CDATA[websemantics]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=4301</guid>

					<description><![CDATA[Anfang der Woche hat Martin Weigert schon über Twitters Pläne, die eigenen Tweets mit noch mehr Medieninhalten zu erweitern, geschrieben: Immer mehr Partnerseiten können zusätzliche multimediale Inhalte im Kontext von Tweets darstellen. Ganz eindeutig ist bisher nicht, wohin diese Reise für Twitter geht. Aber ich habe mir nichts weiter dabei gedacht&#8230; Immerhin macht das Twitter [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>Anfang der Woche hat Martin Weigert schon über <a href="http://netzwertig.com/2012/06/19/twitter-von-einer-simplen-plattform-zur-destination-fuer-multimediainhalte/">Twitters Pläne</a>, die eigenen Tweets mit noch mehr Medieninhalten zu erweitern, geschrieben:</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow"><p>Immer mehr Partnerseiten können zusätzliche multimediale Inhalte im Kontext von Tweets darstellen. Ganz eindeutig ist bisher nicht, wohin diese Reise für Twitter geht.</p></blockquote>



<p>Aber ich habe mir nichts weiter dabei gedacht&#8230; Immerhin macht das Twitter ja schon seit einer ganzen Weile und ich meine mich zu erinnern, irgendwo gelesen zu haben, dass sie dazu <a href="http://oembed.com/">oEmbed</a> einsetzen&#8230; Also alles in bester &#8222;OpenWeb&#8220;-Ordnung 🙂</p>



<p>Aber, Geek der ich bin, hab ich mir gestern zufällig einen Quelltext angeschaut in dem ich auf folgendes entdeckt habe:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"twitter:card"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"summary"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"twitter:url"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"..."</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">name</span>=<span class="hljs-string">"twitter:title"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"..."</span>&gt;</span></code></span></pre>


<p>&#8230;und nach kurzem googlen bin ich auf die <a href="https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards"><strong>Twitter Cards</strong></a> gestoßen, Twitters eigenes, kleines <a href="http://ogp.me/"><strong>Open Graph Protocol</strong></a>. Mit den <strong>Twitter Cards</strong> bekommen Seitenbetreiber ein Set an Meta-Tags an die Hand, und Twitter kann diese Informationen nutzen um die tweets mit den oben erwähnten Mediendaten anzureichern.</p>



<div class="wp-block-image"><figure class="aligncenter"><img decoding="async" width="522" height="272" sizes="(max-width: 522px) 100vw, 522px" src="https://notiz.blog/wp-content/uploads/2012/06/twitter-card-web-summary.png" alt="Example Twitter Card" class="wp-image-4333" srcset="https://notiz.blog/wp-content/uploads/2012/06/twitter-card-web-summary.png 522w, https://notiz.blog/wp-content/uploads/2012/06/twitter-card-web-summary-480x250.png 480w" /></figure></div>



<p>&#8230;und ich wollte mich gerade darüber aufregen, warum Twitter dazu eine eigene Meta-Sprache erfindet, da bin ich in der <a href="https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards">Doku</a> ironischerweise auf folgendes gestoßen:</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow"><p>You&#8217;ll notice that Twitter card tags look similar to OpenGraph tags, and that&#8217;s because they are based on the same conventions as the Open Graph protocol. If you&#8217;re already using OpenGraph to describe data on your page, it’s easy to generate a Twitter card without duplicating your tags and data. When the Twitter card processor looks for tags on your page, it first checks for the Twitter property, and if not present, falls back to the supported Open Graph property. This allows for both to be defined on the page independently, and minimizes the amount of duplicate markup required to describe your content and experience.</p></blockquote>



<p>&#8222;Ok&#8220;, dachte ich&#8230; vielleicht reichen die <em>Open Graph</em> Properties ja nicht aus um alle Informationen, die Twitter braucht, abzubilden. Also hab ich mir mal die Mühe gemacht sie zu vergleichen:</p>



<figure class="wp-block-table alignwide"><table><thead><tr><th>Twitter Cards</th><th>Open Graph Protocol</th></tr></thead><tbody><tr><td><code>twitter:card</code></td><td><code>og:type</code></td></tr><tr><td><code>twitter:site</code></td><td><code>og:site_name</code></td></tr><tr><td><code>twitter:url</code></td><td><code>og:url</code></td></tr><tr><td><code>twitter:description</code></td><td><code>og:description</code></td></tr><tr><td><code>twitter:title</code></td><td><code>og:title</code></td></tr><tr><td><code>twitter:image</code></td><td><code>og:image</code></td></tr><tr><td><code>twitter:image:width</code></td><td><code>og:image:width</code></td></tr><tr><td><code>twitter:image:height</code></td><td><code>og:image:height</code></td></tr><tr><td><code>twitter:player</code> oder <code>twitter:player:stream</code></td><td><code>og:video</code> oder <code>og:audio</code></td></tr><tr><td><code>twitter:player:width</code></td><td><code>og:video:width</code></td></tr><tr><td><code>twitter:player:height</code></td><td><code>og:video:height</code></td></tr></tbody></table></figure>



<p>Es lässt sich also prinzipiell alles mit dem <em>Open Graph Protocol</em> abbilden, es fehlen lediglich die Felder <code>twitter:site:id</code> und <code>twitter:creator:id</code>. Aber wegen diesen zwei Feldern muss man doch nicht das ganze Format &#8222;kopieren&#8220;. Es reicht doch ein kleiner Absatz, wie man den <em>Open Graph</em> mit den proprietären Werten erweitert&#8230; So wie das auch <a href="https://developers.facebook.com/docs/sharing/opengraph">Facebook</a> praktiziert:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">html</span> <span class="hljs-attr">xmlns</span>=<span class="hljs-string">"http://www.w3.org/1999/xhtml"</span>
      <span class="hljs-attr">xmlns:og</span>=<span class="hljs-string">"http://ogp.me/ns#"</span>
      <span class="hljs-attr">xmlns:fb</span>=<span class="hljs-string">"https://www.facebook.com/2008/fbml"</span>&gt;</span>
      xmlns:twitter="https://dev.twitter.com/docs/cards"&gt;
  <span class="hljs-tag">&lt;<span class="hljs-name">head</span>&gt;</span>
    <span class="hljs-tag">&lt;<span class="hljs-name">title</span>&gt;</span>The Rock (1996)<span class="hljs-tag">&lt;/<span class="hljs-name">title</span>&gt;</span>
    <span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">property</span>=<span class="hljs-string">"og:title"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"The Rock"</span>/&gt;</span>
    <span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">property</span>=<span class="hljs-string">"fb:admins"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"USER_ID"</span>/&gt;</span>
    <span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">property</span>=<span class="hljs-string">"twitter:site:id"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"@USER_ID"</span>/&gt;</span>
    ...
  <span class="hljs-tag">&lt;/<span class="hljs-name">head</span>&gt;</span>
  ...
<span class="hljs-tag">&lt;/<span class="hljs-name">html</span>&gt;</span>
</code></span></pre>


<p>Hoffentlich überlegt sich das Twitter noch einmal&#8230; Wenn nicht, wird dank dieser (und folgender) Redundanzen der <code>&lt;head /&gt;</code> einer Webseite in ein paar Jahren mehr Informationen beinhalten wie der <code>&lt;body /&gt;</code>.</p>



<p>&#8230;welch ein Over-<code>&lt;head&gt;</code> 🙂</p>
<p>Hey there, RSS reader! You’re one of a special few, choosing this old-school yet awesome way of staying informed. Kudos!</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2012/06/22/twitter-cards/feed/</wfw:commentRss>
			<slash:comments>1</slash:comments>
		
		
			</item>
		<item>
		<title>Drew McLellan über Microformats</title>
		<link>https://notiz.blog/2008/08/13/drew-mclellan-ueber-microformats/</link>
					<comments>https://notiz.blog/2008/08/13/drew-mclellan-ueber-microformats/#comments</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Wed, 13 Aug 2008 06:41:16 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[FediBlog]]></category>
		<category><![CDATA[hKit]]></category>
		<category><![CDATA[Metadaten]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[Mikroformate]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=1056</guid>

					<description><![CDATA[Drew (der Macher von hKit) hat in den letzten Tagen zwei sehr kurzweilige Präsentationen über das Thema Microformats veröffentlicht die man sich unbedingt anschauen sollte, speziell wenn man bisher noch nicht all zu viel über Microformats weiß. Von der zweiten Präsentation gibt es auch ein Video.]]></description>
										<content:encoded><![CDATA[
<p><abbr title="Drew McLellan">Drew</abbr> (der Macher von <a href="https://github.com/drewm/hkit">hKit</a>) hat in den letzten Tagen zwei sehr kurzweilige Präsentationen über das Thema <a href="http://microformats.org"><em>Microformats</em></a> veröffentlicht die man sich unbedingt anschauen sollte, speziell wenn man bisher noch nicht all zu viel über <strong>Microformats</strong> weiß.</p>



<figure class="wp-block-embed-slideshare wp-block-embed aligncenter is-type-rich is-provider-slideshare">
	https://www.slideshare.net/drewm/what-brian-cant-never-taught-you-about-metadat
</figure>



<p><br/> Von der zweiten Präsentation gibt es auch ein <a href="https://vimeo.com/1290997">Video</a>.</p>



<span id="more-1056"></span>



<figure class="wp-block-embed-slideshare wp-block-embed aligncenter is-type-rich is-provider-slideshare">
	https://www.slideshare.net/drewm/the-clangers-guide-to-microformats
</figure>
<p>RSS readers like you are the secret sauce of the internet. Keep rocking and staying informed!</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2008/08/13/drew-mclellan-ueber-microformats/feed/</wfw:commentRss>
			<slash:comments>2</slash:comments>
		
		
			</item>
	</channel>
</rss>
