<?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>abbr design pattern &#8211; notizBlog</title>
	<atom:link href="https://notiz.blog/tag/abbr-design-pattern/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:47:53 +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>abbr design pattern &#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/abbr-design-pattern/feed/"/>
<atom:link rel="search" type="application/opensearchdescription+xml" title="Search notizBlog" href="https://notiz.blog/wp-api/opensearch/1.1/document" />	<item>
		<title>Microdata &#8211; wie Microformats bloß besser&#8230; (Teil 1)</title>
		<link>https://notiz.blog/2009/08/10/microdata-wie-microformats-bloss-besser-teil-1/</link>
					<comments>https://notiz.blog/2009/08/10/microdata-wie-microformats-bloss-besser-teil-1/#comments</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Mon, 10 Aug 2009 20:30:32 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[abbr design pattern]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[include pattern]]></category>
		<category><![CDATA[Microdata]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[Mikroformate]]></category>
		<category><![CDATA[value class pattern]]></category>
		<category><![CDATA[XHTML]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=1790</guid>

					<description><![CDATA[Der Inhalt wurde an die neusten Änderungen der Microdata-Spezifikation angepasst. Letztes Update 30.01.2010. Microdata – wie Microformats bloß besser… (Teil 2): über &#8222;Namenskollisionen und Namespaces&#8220; und &#8222;Informationen Referenzieren&#8220; Wie schon erwähnt, vereint Microdata die Vorzüge von RDFa und Microformats in einem Standard&#8230; aber nicht nur das, Microdata (in Verbindung mit HTML5) bietet auch einige schicke [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>Der Inhalt wurde an die <a href="https://notiz.blog/2009/10/10/microdata-update-und-usability-studie/">neusten Änderungen der Microdata-Spezifikation</a> angepasst. Letztes Update 30.01.2010.
	<a href="https://notiz.blog/2011/06/26/microdata-wie-microformats-blos-besser-teil-2/">Microdata – wie Microformats bloß besser… (Teil 2)</a>: über &#8222;Namenskollisionen und Namespaces&#8220; und &#8222;Informationen Referenzieren&#8220;
</p>



<p>Wie schon <a href="https://notiz.blog/2009/06/18/microdata-semantisches-html5/">erwähnt</a>, vereint Microdata die Vorzüge von <a href="http://rdfa.info">RDFa</a> und <a href="http://microformats.org">Microformats</a> in einem Standard&#8230; aber nicht nur das, Microdata (in Verbindung mit HTML5) bietet auch einige schicke Lösungen für diverse <a href="http://microformats.org/wiki/issues">Microformats-Problemchen</a>.</p>



<h4 class="wp-block-heading">Das <em>abbr-design-pattern</em> oder das <em>value-class-pattern</em></h4>



<p><strong>Microformats:</strong></p>



<p>Das <em><a href="http://microformats.org/wiki/abbr-design-pattern">abbr-design-pattern</a></em> ist bisher wohl das <a href="http://www.google.de/search?q=microformats+accessibility+abbr">umstrittenste Pattern</a> im <a href="http://microformats.org/wiki/Main_Page">Microformats-Wiki</a>. Grund für die Kritik an dem Pattern ist die etwas <a href="https://notiz.blog/2008/06/24/bbc-und-das-alte-haccessibility-problemchen/">unorthodoxe Verwendung</a> des <code>&lt;abbr&gt;</code> Tags um maschinenlesbare Meta-Informationen bereit zu stellen.</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"vevent"</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">abbr</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"dtstart"</span> <span class="hljs-attr">title</span>=<span class="hljs-string">"2007-10-05"</span>&gt;</span>October 5<span class="hljs-tag">&lt;/<span class="hljs-name">abbr</span>&gt;</span>
  ...
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<p>Eine erste Alternative aus der Microformats-Community ist das <em><a href="http://microformats.org/wiki/value-class-pattern">value-class-pattern</a></em>, das zwar das Accessibility-Problem &#8222;behebt&#8220; aber noch lange keine Perfekte Lösung bietet.</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"vevent"</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">span</span> <span class="hljs-attr">class</span>=<span class="hljs-string">'dtstart'</span>&gt;</span>
    <span class="hljs-tag">&lt;<span class="hljs-name">span</span> <span class="hljs-attr">class</span>=<span class="hljs-string">'value-title'</span> <span class="hljs-attr">title</span>=<span class="hljs-string">'2007-10-05'</span>&gt;</span> <span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
    October 5
  <span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
  ...
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<p>Der HTML-Code wird durch weitere Elemente unnötig aufgeblasen und das Pattern basiert auf teilweise leeren Elementen.</p>



<p><strong>Microdata/HTML5:</strong></p>



<p>In HTML5 gibt es dagegen ein spezielles Tag um Zeit und Datum sowohl user als auch maschinenlesbar zu machen.</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">itemscope</span>
  <span class="hljs-attr">itemtype</span>=<span class="hljs-string">"http://microformats.org/profile/hcalendar"</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">time</span> <span class="hljs-attr">itemprop</span>=<span class="hljs-string">"dtstart"</span> <span class="hljs-attr">datetime</span>=<span class="hljs-string">"2007-10-05"</span>&gt;</span>October 5<span class="hljs-tag">&lt;/<span class="hljs-name">time</span>&gt;</span>
  ...
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<h4 class="wp-block-heading">Reine Meta-Informationen</h4>



<p><strong>Microformats:</strong></p>



<p>Eigentlich spricht es gegen die Prinzipien der Microformats-Idee, reine Metadaten zu verwenden: </p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow"><p>Visible data = more accurate data. By designing for humans first and making the data presentable (thus viewed and <em>verified</em> by humans), the data is inevitably more accurate, not only to begin with (as errors are easily/quickly noticed by those viewing the pages/sites), but over time as well; in that changes are noticed, and if data becomes out-of-date or obsolete, that&#8217;s more likely to be noticed as well. This is in direct contrast to &#8222;side files&#8220; and invisible data like that contained in <code>&lt;meta&gt;</code> tags.<br> &#8212; <a href="http://microformats.org/wiki/principles#effects_of_principles">Tantek Çelik</a></p></blockquote>



<p>&#8230;aber <a href="http://microformats.org/wiki/geo">GEO-Daten</a> sind z.B. Informationen die der Benutzer nicht unbedingt sehen muss.</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"geo"</span>&gt;</span>
 <span class="hljs-tag">&lt;<span class="hljs-name">span</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"latitude"</span>&gt;</span>37.386013<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
 <span class="hljs-tag">&lt;<span class="hljs-name">span</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"longitude"</span>&gt;</span>-122.082932<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<p><strong>Microdata/HTML5:</strong></p>



<p>In HTML5 gibt es für dieses Problem eine recht schicke Lösung: Laut der <a href="http://dev.w3.org/html5/spec/Overview.html#flow-content">Spezifikation</a> sind &lt;meta /&gt;-Tags im kompletten Quellcode (auch im <code>body</code>) erlaubt.</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">itemscope</span> 
 <span class="hljs-attr">itemtype</span>=<span class="hljs-string">"http://microformats.org/profile/hcard#geo"</span>&gt;</span>
 <span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">itemprop</span>=<span class="hljs-string">"latitude"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"37.386013"</span> /&gt;</span>
 <span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">itemprop</span>=<span class="hljs-string">"longitude"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"-122.082932"</span> /&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<h4 class="wp-block-heading">Fazit</h4>



<p>Selbst wenn sich <a href="https://html.spec.whatwg.org/multipage/microdata.html">Microdata</a> (item und itemprop) nicht durchsetzen sollte, sind &lt;meta&gt; und <a href="https://notiz.blog/2008/07/30/html5-is-made-for-microformats/">&lt;time&gt;</a> schon ein echter &#8222;Segen&#8220; für die <a href="http://microformats.org">Microformats-Community</a> 🙂</p>



<p>Im zweiten Teil nehm&#8216; ich mir das <a href="http://microformats.org/wiki/include-pattern">include-pattern</a> und das Problem der möglichen <a href="http://meiert.com/en/blog/20070913/microformats-and-pseudo-namespaces/">Namens</a>&#8211;<a href="http://meiert.com/en/blog/20090716/microformats-key-flaws/">Kollisionen</a> vor. <a href="https://notiz.blog/2011/06/26/microdata-wie-microformats-blos-besser-teil-2/">Microdata – wie Microformats bloß besser… (Teil 2)</a>: über &#8222;Namenskollisionen und Namespaces&#8220; und &#8222;Informationen Referenzieren&#8220;</p>
<p>RSS readers like you are the unsung heroes of the internet. Keep up the good work!</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2009/08/10/microdata-wie-microformats-bloss-besser-teil-1/feed/</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
			</item>
		<item>
		<title>Microformats: Value Class Pattern</title>
		<link>https://notiz.blog/2009/05/12/microformats-value-class-pattern/</link>
					<comments>https://notiz.blog/2009/05/12/microformats-value-class-pattern/#comments</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Tue, 12 May 2009 17:33:05 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[abbr design pattern]]></category>
		<category><![CDATA[Accessibility]]></category>
		<category><![CDATA[FediBlog]]></category>
		<category><![CDATA[GEO]]></category>
		<category><![CDATA[hAccessibility]]></category>
		<category><![CDATA[hAtom]]></category>
		<category><![CDATA[hCalendar]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[Mikroformate]]></category>
		<category><![CDATA[value class pattern]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=1539</guid>

					<description><![CDATA[Das bisher wohl größte Problem bei der Verwendung von Microformats ist (oder besser wahr) die Accessibility durch die etwas zweckentfremdete Verwendung des &#60;abbr />-Tags. Das so genanntes abbr-design-pattern diente hauptsächlich dazu (es gibt noch einige andere Anwendungsfälle), ein für den Menschen lesbares Datum auch für die Maschine lesbar zu machen und ist Bestandteil von Mikroformaten [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>Das bisher wohl größte Problem bei der Verwendung von <strong>Microformats</strong> ist (oder besser wahr) die <a href="https://notiz.blog/?s=haccessibility">Accessibility</a> durch die etwas zweckentfremdete Verwendung des <a href="http://microformats.org/wiki/abbr-design-pattern"><code>&lt;abbr /></code>-Tags</a>.</p>



<p>Das so genanntes <a href="http://microformats.org/wiki/abbr-design-pattern">abbr-design-pattern</a> diente hauptsächlich dazu (es gibt noch einige andere Anwendungsfälle), ein für den Menschen lesbares Datum auch für die Maschine lesbar zu machen und ist Bestandteil von <strong>Mikroformaten</strong> wie z.B. <a href="http://microformats.org/wiki/hCalendar">hCalendar</a>, <a href="http://microformats.org/wiki/hAtom">hAtom</a> oder <a href="http://microformats.org/wiki/hReview">hReview</a>.</p>



<p>Ein Beispiel: <code>&lt;abbr class="dtstart" title="2009-05-12">heute&lt;/abbr></code></p>



<p><a href="https://wiki.selfhtml.org/wiki/HTML/Elemente/abbr">SelfHTML über das abbr-Element</a>:</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow"><p>zeichnet einen Text aus mit der Bedeutung &#8222;dies ist eine Abkürzung&#8220;</p></blockquote>



<p>Selbst wenn man davon ausgeht, dass das Wort <em>heute</em> eine Abkürzung für das volle Datum <em>2009-05-12</em> ist, gibt es ein großes Problem mit Screen-Readern. Die meisten Screen-Reader sind so konfiguriert, dass sie statt der Abkürzung, das im title-Attribut angegebene, vollständige Wort lesen.<br/> Im Falle der <a href="http://microformats.org/wiki/abbr-design-pattern">abbr-design-pattern</a> im oben genannten Beispiel wäre das <em>2009-05-12</em> (gelesen &#8222;Zweitausendneun minus Fünf minus Zwölf&#8220;), also viel missverständlicher als <em>heute</em>.</p>



<p>Das <a href="http://microformats.org/blog/2009/05/12/value-class-pattern/">gerade angekündigte</a> <strong><a href="http://microformats.org/wiki/value-class-pattern">value-class-pattern</a></strong> soll dieses (und einige andere) Problem jetzt beheben.</p>



<p>Ein Datum, wie im Beispiel oben, würde mit dem <strong>value-class-pattern</strong> folgendermaßen aussehen:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">span</span> <span class="hljs-attr">class</span>=<span class="hljs-string">'dtstart'</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">span</span> <span class="hljs-attr">class</span>=<span class="hljs-string">'value-title'</span> <span class="hljs-attr">title</span>=<span class="hljs-string">'2009-05-12'</span>&gt;</span> <span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
  heute
<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span></code></span></pre>


<p>Erklärung:</p>



<ul class="wp-block-list">
	<li><em>dtstart</em> gibt immer noch an, dass es sich bei dem folgenden um ein Datum handelt</li>
	<li>Die folgende Klasse: <em>value-title</em> gibt an, dass sich <em>dtstart</em> auf das <em>title</em>-Attribut des <em>spans</em> bezieht</li>
	<li>Im <em>title</em> steht der maschinen-lesbare text</li>
</ul>



<p>Das neue Pattern beschreibt aber noch eine ganze Reihe an anderen Anwendungsfällen, am besten ihr überfliegt die Seite einfach mal selbst: <a href="http://microformats.org/wiki/value-class-pattern">http://microformats.org/wiki/value-class-pattern</a></p>



<p>&#8230;es sind übrigens alle Microformats-Nutzer aufgerufen, ihre Seiten und Parser auf das neue Pattern umzustellen, also viel Spaß dabei 🙂</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/2009/05/12/microformats-value-class-pattern/feed/</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
			</item>
		<item>
		<title>HTML5 is made for Microformats</title>
		<link>https://notiz.blog/2008/07/30/html5-is-made-for-microformats/</link>
					<comments>https://notiz.blog/2008/07/30/html5-is-made-for-microformats/#comments</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Wed, 30 Jul 2008 18:34:52 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[abbr design pattern]]></category>
		<category><![CDATA[GEO]]></category>
		<category><![CDATA[hCalendar]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[HTML5]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[RDFa]]></category>
		<category><![CDATA[Semantic HTML]]></category>
		<category><![CDATA[XHTML]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=1003</guid>

					<description><![CDATA[Naja, nicht wirklich aber immerhin hat es RDFa bis dato nicht in die HTML5 Spezifikation geschafft. Es gibt zwar einen Milestone&#8230; The HTML WG is encouraged to provide a mechanism to permit independently developed vocabularies such as Internationalization Tag Set (ITS), Ruby, and RDFa to be mixed into HTML documents. &#8230;aber wer weiß wie lange [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>Naja, nicht wirklich aber immerhin hat es <a href="http://www.w3.org/TR/xhtml-rdfa-primer/">RDFa</a> bis dato nicht in die <a href="http://www.w3.org/html/wg/html5/">HTML5 Spezifikation</a> geschafft. Es gibt zwar einen <a href="http://www.w3.org/2007/03/HTML-WG-charter.html#deliverables">Milestone</a>&#8230;</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow"><p>The HTML WG is encouraged to provide a mechanism to permit independently developed vocabularies such as Internationalization Tag Set (ITS), Ruby, and RDFa to be mixed into HTML documents.</p></blockquote>



<p>&#8230;aber wer weiß wie lange das noch dauert. Das heißt wohl, dass die Microformats noch eine gewisse Zeit lang als Übergangslösung her halten müssen. Aber das ist ne andere Geschichte&#8230;</p>



<p>Eigentlich wollte ich auf zwei HTML5 &#8211; Elemente eingehen, die eine schicke Alternative zu den bisherigen (in <a href="http://microformats.org/wiki/geo">vielen</a> <a href="http://microformats.org/wiki/hCal">Microformats</a> verwendeten) <a href="http://microformats.org/wiki/abbr-design-pattern">abbr-design-pattern</a> bietet.</p>



<h4 class="wp-block-heading">Der &lt;time />-Tag</h4>



<p>Das <code><a href="http://www.w3.org/html/wg/html5/#time">time</a></code> Element ermöglicht das kennzeichnen eines Datums in z.B. Blogposts o.Ä.</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow"><p>The primary use cases for these elements are for marking up publication dates e.g. in blog entries, and for marking event dates in hCalendar markup.</p></blockquote>



<p>Also:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">time</span> <span class="hljs-attr">datetime</span>=<span class="hljs-string">"2006-09-23"</span>&gt;</span>a Saturday<span class="hljs-tag">&lt;/<span class="hljs-name">time</span>&gt;</span></code></span></pre>


<p>statt:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">abbr</span> <span class="hljs-attr">title</span>=<span class="hljs-string">"2006-09-23"</span>&gt;</span>a Saturday<span class="hljs-tag">&lt;/<span class="hljs-name">abbr</span>&gt;</span></code></span></pre>


<p>Ein <a href="http://microformats.org/wiki/hCal">hCalendar</a> könnte dann so aussehen:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"vevent"</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">span</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"summary"</span>&gt;</span>event title<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">time</span> <span class="hljs-attr">datetime</span>=<span class="hljs-string">"2006-09-23"</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"dtstart dtend"</span>&gt;</span>a Saturday<span class="hljs-tag">&lt;/<span class="hljs-name">time</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<h4 class="wp-block-heading">Custom data attributes (data-)</h4>



<p>Ein <em>custom data attribute</em> ist ein frei benutzbares Attribut um Elemente mit <a href="https://de.wikipedia.org/wiki/Metadaten">Metadaten</a> anzureichern. Die einzige Vorgabe ist, dass es mit <code>data-</code> beginnen muss. Ein Beispiel:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"monkey"</span> <span class="hljs-attr">data-arms</span>=<span class="hljs-string">"2"</span>
     <span class="hljs-attr">data-legs</span>=<span class="hljs-string">"2"</span> <span class="hljs-attr">data-race</span>=<span class="hljs-string">"chimp"</span>&gt;</span>
  Cheetah
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<p>Ideal auch als <code>&lt;abbr /></code>-Ersatz bei z.B. dem <a href="http://microformats.org/wiki/geo">Geo-Microformat</a>.</p>



<p>Also:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"geo"</span> <span class="hljs-attr">data-latitude</span>=<span class="hljs-string">"49.5483"</span> <span class="hljs-attr">data-longitude</span>=<span class="hljs-string">"8.6661"</span>&gt;</span>Weinheim<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></code></span></pre>


<p>statt:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">abbr</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"geo"</span> <span class="hljs-attr">title</span>=<span class="hljs-string">"49.5483;8.6661"</span>&gt;</span>Weinheim<span class="hljs-tag">&lt;/<span class="hljs-name">abbr</span>&gt;</span></code></span></pre>


<h4 class="wp-block-heading">Fazit</h4>



<p>(X)HTML (egal ob XHTML2 mit RDFa oder X/HTML5) wird also definitiv ein semantisches Feuerwerk, ganz im Sinne von Tim Berners Lee&#8230;</p>



<p>Ich freu mich 🙂</p>
<p>You are a true RSS aficionado! While others are drowning in social media noise, you enjoy the simplicity and control of RSS. Congrats!</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2008/07/30/html5-is-made-for-microformats/feed/</wfw:commentRss>
			<slash:comments>4</slash:comments>
		
		
			</item>
		<item>
		<title>Der Safari ist schuld!</title>
		<link>https://notiz.blog/2008/07/22/der-safari-ist-schuld/</link>
					<comments>https://notiz.blog/2008/07/22/der-safari-ist-schuld/#comments</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Tue, 22 Jul 2008 06:41:08 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[abbr design pattern]]></category>
		<category><![CDATA[hCalendar]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[object]]></category>
		<category><![CDATA[Safari]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=964</guid>

					<description><![CDATA[Gestern habe ich durch Zufall den Schuldigen für die abbr-desing-pattern &#8211; Misere gefunden&#8230; Der Safari ist Schuld! Ursprünglich war das object-Tag zum Anzeigen des Datums vorgesehen: Aber&#8230; Unfortunately, to put it mildly, Safari&#8217;s &#60;object> support sucks. It doesn&#8217;t handle &#60;object> fallbacks, it doesn&#8217;t know when not to handle &#60;object> mime types that it doesn&#8217;t support, [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>Gestern habe ich durch Zufall den Schuldigen für die <a href="https://notiz.blog/2008/06/24/bbc-und-das-alte-haccessibility-problemchen/"><em>abbr-desing-pattern</em> &#8211; Misere</a> gefunden&#8230; Der Safari ist Schuld!</p>



<p>Ursprünglich war das <code>object</code>-Tag zum Anzeigen des Datums vorgesehen:</p>


<pre class="wp-block-code"><span><code class="hljs language-xml"><span class="hljs-tag">&lt;<span class="hljs-name">object</span> <span class="hljs-attr">data</span>=<span class="hljs-string">"20050125"</span>&gt;</span>January 25<span class="hljs-tag">&lt;/<span class="hljs-name">object</span>&gt;</span></code></span></pre>


<p>Aber&#8230;</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow">
	<p>Unfortunately, to put it mildly, Safari&#8217;s <code>&lt;object></code> support <em>sucks</em>. It doesn&#8217;t handle <code>&lt;object></code> fallbacks, it doesn&#8217;t know when not to handle <code>&lt;object></code> mime types that it doesn&#8217;t support, it doesn&#8217;t support <code>display:inline</code> on <code>&lt;object></code>, and it doesn&#8217;t do proper intrinsic sizing of <code>&lt;object></code> replaced elements.</p>
</blockquote>



<p>DANKE SAFARI! 😉</p>



<p>Quelle: <a href="http://tantek.com/log/2005/01.html#d26t0100">Tantek&#8217;s Thoughts</a></p>
<p>RSS readers like you are the unsung heroes of the internet. Keep up the good work!</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2008/07/22/der-safari-ist-schuld/feed/</wfw:commentRss>
			<slash:comments>2</slash:comments>
		
		
			</item>
		<item>
		<title>RDFa vs. Microformats</title>
		<link>https://notiz.blog/2008/06/25/rdfa-vs-microformats/</link>
					<comments>https://notiz.blog/2008/06/25/rdfa-vs-microformats/#respond</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Wed, 25 Jun 2008 13:11:05 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[abbr]]></category>
		<category><![CDATA[abbr design pattern]]></category>
		<category><![CDATA[BBC]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[RDFa]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=923</guid>

					<description><![CDATA[Die Ankündigung der BBC, alle Microformats die auf den abbr-design-pattern aufbauen, zu entfernen und sich in der Zwischenzeit mit dem Thema RDFa zu beschäftigen&#8230; In the meantime we&#8217;ll be looking at the possible use of RDFa (a slightly bigger S semantic web technology similar to microformats but without some of the more unexpected side-effects). &#8230;wurde [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>Die <a href="https://notiz.blog/2008/06/24/bbc-und-das-alte-haccessibility-problemchen/">Ankündigung der BBC</a>, alle Microformats die auf den <a href="http://microformats.org/wiki/abbr-design-pattern">abbr-design-pattern</a> aufbauen, zu entfernen und sich in der Zwischenzeit mit dem Thema RDFa zu beschäftigen&#8230;</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow">
	<p>In the meantime we&#8217;ll be looking at the possible use of RDFa (a slightly bigger S semantic web technology similar to microformats but without some of the more unexpected side-effects).</p>
</blockquote>



<p>&#8230;wurde von einigen Personen als direkter vergleich zwischen den beiden Formate (zugunsten von RDFa) gesehen und hat eine hitzige Diskussion entfacht.</p>



<p>Manu Sporny hat den <em>Dialog</em> in der <a href="http://groups.google.com/group/microformats/browse_thread/thread/55355dd6b76f8e83?hl=en">Microformats-Mailing-List</a> schön zusammengefasst.</p>



<p>Am interessantesten ist jedoch die <a href="http://www.bbc.co.uk/blogs/radiolabs/2008/06/microformats_and_rdfa_and_rdf.shtml">Antwort der BBC</a> auf dieses &#8222;Missverständnis&#8220;:</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow">
	<p>My original post on removing microformats from /programmes seems to have kicked off quite a debate. Unfortunately some of this seems to have resulted in RDFa people criticising microformats and vice versa. Which wasn&#8217;t really the intention.</p>
</blockquote>



<p>&#8230;und dass das Entfernen der <a href="http://microformats.org/wiki/abbr-design-pattern">abbr-design-pattern</a> auch nur temporärer Natur ist, bis das Problem behoben wurde:</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow">
	<p>This is hopefully only a temporary ban until the microformats community come up with an alternative to the abbreviation design pattern that doesn&#8217;t break BBC accessibility standards.</p>
</blockquote>



<p>Also&#8230; viel Aufregung um nichts&#8230;</p>



<p>Ich persönlich verstehe die Diskussion (Microformats vs. RDFa) nicht wirklich und kann mich eigentlich nur <a href="https://web.archive.org/web/20130531033506/http://evan.prodromou.name:80/RDFa_vs_microformats">Evan Prodromou</a> anschließen, der folgendes als <em>Idealfall</em> ansieht:</p>



<ol class="wp-block-list">
	<li>RDFa gets acknowledged and embraced by microformats.org as the future of semantic-data-in-XHTML
	</li>
	<li>The RDFa group makes an effort to encompass existing microformats with a minimum of changes
	</li>
	<li>microformats.org leaders join in on the RDFa authorship process
	</li>
	<li>microformats.org becomes a focus for developing real-world RDFa vocabularies
	</li>
</ol>
<p>RSS readers like you are the unsung heroes of the internet. Keep up the good work!</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2008/06/25/rdfa-vs-microformats/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>BBC und das alte hAccessibility Problemchen</title>
		<link>https://notiz.blog/2008/06/24/bbc-und-das-alte-haccessibility-problemchen/</link>
					<comments>https://notiz.blog/2008/06/24/bbc-und-das-alte-haccessibility-problemchen/#respond</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Tue, 24 Jun 2008 16:15:52 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[abbr]]></category>
		<category><![CDATA[abbr design pattern]]></category>
		<category><![CDATA[BBC]]></category>
		<category><![CDATA[hCalendar]]></category>
		<category><![CDATA[Microformats]]></category>
		<guid isPermaLink="false">http://notizblog.org/?p=920</guid>

					<description><![CDATA[Dass die abbr-design-pattern nicht das gelbe vom Ei sind (massive Probleme mit Screen-Readern), hat das Web Standards Project (WaSP) schon vor mehr als einem Jahr festgestellt, aber es bedarf meistens etwas Druck von außen damit sich wirklich etwas ändert. Nach der Ankündigung der BBC, alle Microformats (die das abbr-design-pattern verwenden) von ihren Seiten (speziell bbc.co.uk/programmes) [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>Dass die <a href="http://microformats.org/wiki/abbr-design-pattern">abbr-design-pattern</a> nicht das gelbe vom Ei sind (massive Probleme mit Screen-Readern), hat das Web Standards Project (WaSP) schon vor <a href="https://notiz.blog/2007/04/28/die-abbr-design-pattern/">mehr als einem Jahr festgestellt</a>, aber es bedarf meistens etwas Druck von außen damit sich wirklich etwas ändert.</p>



<p>Nach der <a href="https://www.bbc.co.uk/blogs/radiolabs/2008/06/removing_microformats_from_bbc.shtml">Ankündigung der <abbr title="British Broadcasting Corporation">BBC</abbr></a>, alle <a href="http://microformats.org">Microformats</a> (die das abbr-design-pattern verwenden) von ihren Seiten (speziell bbc.co.uk/programmes) zu nehmen, ist <a href="http://microformats.org/discuss/mail/microformats-discuss/2007-April/009350.html">die alte Diskussion</a> <a href="http://microformats.org/discuss/mail/microformats-dev/2008-June/000552.html">wieder in vollem Gange</a>.</p>



<p>Diskutierte Lösungen:</p>



<ul class="wp-block-list">
	<li><code>&lt;span class="dtstart data-20051010T10:10:10-0100">10 o'clock on the 10th&lt;/span></code></li>
	<li><code>&lt;span class="dtstart{2005-10-10T10:10:10-0100}">10 o'clock&lt;/span></code></li>
	<li><code>&lt;abbr class="dtstart data{2008-06-23}" title=June 23rd, 2008">Today&lt;/abbr></code></li>
	<li><code>&lt;abbr class="fancy data{2008-06-23} dstart" title=June 23rd, 2008">Today&lt;/abbr></code></li>
	<li><code>&lt;span class="dtstart" content="2008-06-23">Today&lt;/span></code> (Nicht XHTML 1.x valide)</li>
</ul>



<p>Noch mehr Infos zu dem Thema bekommt man im <a href="http://microformats.org/wiki/datetime-design-pattern#Machine-data_in_class">Wiki</a> oder über die <a href="http://microformats.org/discuss/mail/microformats-dev/2008-June/000552.html">Mailing-Liste</a>.</p>



<p>(via <a href="http://hackr.de/2008/06/24/accessibility-vs-machines">hackr</a>)</p>
<p>RSS readers like you are the unsung heroes of the internet. Keep up the good work!</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2008/06/24/bbc-und-das-alte-haccessibility-problemchen/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
