<?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>hAccessibility &#8211; notizBlog</title>
	<atom:link href="https://notiz.blog/tag/haccessibility/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>hAccessibility &#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/haccessibility/feed/"/>
<atom:link rel="search" type="application/opensearchdescription+xml" title="Search notizBlog" href="https://notiz.blog/wp-api/opensearch/1.1/document" />	<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>Hey there, RSS reader! You’re cool. Keep being awesome! 😎</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>hCard Links</title>
		<link>https://notiz.blog/2007/10/15/hcard-links/</link>
					<comments>https://notiz.blog/2007/10/15/hcard-links/#respond</comments>
		
		<dc:creator><![CDATA[Matthias Pfefferle]]></dc:creator>
		<pubDate>Mon, 15 Oct 2007 15:06:43 +0000</pubDate>
				<category><![CDATA[Open Web]]></category>
		<category><![CDATA[hAccessibility]]></category>
		<category><![CDATA[hCard]]></category>
		<category><![CDATA[Microformats]]></category>
		<category><![CDATA[Mikroformate]]></category>
		<category><![CDATA[XFN]]></category>
		<guid isPermaLink="false">http://notizblog.org/2007/10/15/hcard-links/</guid>

					<description><![CDATA[Jeremy beschreibt in seinem Weblog wie man mit Hilfe des abbr Tags eine vollständige hCard für Links erstellen kann. Sein Problem: I would still make his name a hyperlink but what can I do about making this text into an hCard? Should I change my writing style and refer to everyone by their full formated [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p><a href="http://adactio.com"><abbr title="Jeremy Keith">Jeremy</abbr></a> beschreibt in seinem <a href="https://adactio.com/journal/1358">Weblog</a> wie man mit Hilfe des <code>abbr</code> Tags eine vollständige hCard für Links erstellen kann.</p>



<p>Sein Problem:</p>



<blockquote class="wp-block-quote is-layout-flow wp-block-quote-is-layout-flow">
	<p>I would still make his name a hyperlink but what can I do about making this text into an hCard? Should I change my writing style and refer to everyone by their full formated name even if the context and writing style would favour just using their first name?</p>
</blockquote>



<p>Will man eine hCard erstellen bei der nur der Vorname angezeigt wird, wird natürlich auch nur der Vorname ins Adressbuch übernommen:</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">"vcard"</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"fn url"</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"http://example.com/"</span>&gt;</span>
    Max
  <span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
</code></span></pre>


<p>Die Lösung des Problems ist die Nutzung des <code>abbr</code> Tags:</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">"vcard"</span>&gt;</span>
  <span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"url"</span> <span class="hljs-attr">rel</span>=<span class="hljs-string">"friend met"</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"http://example.com/"</span>&gt;</span>
    <span class="hljs-tag">&lt;<span class="hljs-name">abbr</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"fn"</span> <span class="hljs-attr">title</span>=<span class="hljs-string">"Max Mustermann"</span>&gt;</span>
      Max
    <span class="hljs-tag">&lt;/<span class="hljs-name">abbr</span>&gt;</span>
  <span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">span</span>&gt;</span>
</code></span></pre>


<p>Schicke Idee, fragt sich nur ob der Vorname als <em>Abbreviate</em> (Abkürzung) durch geht und die Nutzung von <code>&lt;abbr></code> <a href="https://www.webstandards.org/2007/04/27/haccessibility/">gerechtfertigt</a> ist.</p>
<p>Hey there, RSS reader! You’re cool. Keep being awesome! 😎</p>]]></content:encoded>
					
					<wfw:commentRss>https://notiz.blog/2007/10/15/hcard-links/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
