Endlich denkt beim Thema „Usability“ auch mal jemand an die Entwickler 🙂

Google hat über die letzten Wochen eine Usability-Studie zu Microdata durchgeführt und die Spezifikation wurde auch gleich entsprechend der Ergebnisse angepasst.

<address itemscope itemtype="http://microformats.org/profile/hcard">
 <strong itemprop="fn">Alfred Person</strong>
 <span itemprop="adr" itemscope>
  <span itemprop="street-address">1600 Amphitheatre Parkway</span> <br>
  <span itemprop="street-address">Building 43, Second Floor</span> <br>
  <span itemprop="locality">Mountain View</span>,
  <span itemprop="region">CA</span> <span itemprop="postal-code">94043</span>
 </span>
</address>

Die Änderungen:

  • Aus item wird itemscope.
  • Der Typ wird über itemtype und nicht mehr über item bzw. itemscope angegeben.
  • Das Attribut itemid wurde eingeführt, um z.B. auf ISBN-Nummer zu verweisen itemid="urn:isbn:0-330-34032-8".

Über den neuen HTML-Tag <itemref /> (alternativ: <itemfor />) werde ich im zweiten Teil von „Microdata – wie Microformats bloß besser…“ eingehen (zum ersten Teil).

Jetzt muss ich nur noch meine alten Artikel zu Microdata anpassen… das hat man nun davon, wenn man über Drafts berichtet 😉

David Recordon stellt auf O’Reilly – Radar zwei der spannendsten Ergebnisse des gestrigen PortableContacts Hackathon (bei Six Apart) vor:

Joseph Smarr and Kevin Marks of Google hacked together a web transformer that integrates Microformats, vCard, and the Portable Contacts API. Given Kevin’s homepage which is full of Microformats, they’ve built an API that extracts his profile information from hCard, uses a public API from Technorati to transform it to vCard, and then exposes it as a Portable Contacts API endpoint. Not only does this work on Kevin’s own page, but his Twitter profile as well which contains basic profile information such as name, homepage, and a short bio.

Ein schönes Beispiel was man mit semantisch ausgezeichneten Informationen machen kann und dass Microformats eben auch (ohne viel Aufwand und mit ein bisschen Transformation) in höherwertige APIs integriert werden können… also keine hCard wurde umsonst geschrieben 🙂

Brian Ellin of JanRain has successfully combined OpenID, XRDS-Simple, OAuth, and the Portable Contacts API to start showing how each of these building blocks should come together. Upon visiting his demo site he logs in using his OpenID. From there, the site discovers that Plaxo hosts his address book and requests access to it via OAuth. Finishing the flow, his demo site uses the Portable Contacts API to access information about his contacts directly from Plaxo. End to end, login with an OpenID and finish by giving the site access to your address book without having to fork over your password.

Dazu brauche ich nicht mehr sagen, als: Implementieren! Sofort und überall 😉

Gestern bin ich auf das Portable Contacts Projekt gestoßen…

The momentum began building for ‚data portability‘ last year, and we are now at a point where there is strong support for the principle that users should be in control of their data and have the freedom to access it from across the web.

[…]

The goal of Portable Contacts is to make it easier for developers to give their users a secure way to access the address books and friends lists they have built up all over the web.

[…]

…we’re using existing standards wherever possible, including vCard, OpenSocial, XRDS-Simple, OAuth, etc.

…was für mich nichts anderes als eine Trotzreaktion auf Data Portability ist!

Da spricht man von einheitlichen Standards und Portabilität, schafft es aber nicht, gemeinsam an einem Projekt zu arbeiten… Ich sehe kaum Erleichterung darin, statt verschiedener proprietärer APIs (z.B. Google’s GData Contacts API oder Microsoft’s Live Contacts API) wahrscheinlich mind. genauso viele unterschiedliche standard APIs (Data Portability oder Portable Contacts) implementieren zu müssen!

…irgendwie ironisch!

Warum sollte nur die Ausgabe ((X)HTML) semantisch anreichern und die Eingabe vernachlässigen?

Beim spielen mit dem hCard-Mappers und der Firefox-Microformats-API kam mir die Idee, auch Formulare semantisch auszuzeichnen…

In dem Artikel Use the new microformats API in your Firefox 3.0 Extensions beschreibt Rob Crowther wie man mit Hilfe der Firefox-Microformats-API eine hCard speichert um sie zum Ausfüllen verschiedener Formulare weiterverwenden zu können.

Das Problem: Das Prinzip funktioniert leider nur bei Formularen die dem festgelegten Aufbau entsprechen. Im Fall des Beispiels wäre das:

<h1>hCardFormFiller Target Form</h1>
<form action="#" method="post">
    <label>Name: <input type="text" id="name" /></label><br />
    <label>Email: <input type="text" id="email" /></label><br />
    <label>Home page: <input type="text" id="homepage" /></label><br />
    <label>Street Address: <input type="text" id="address1" /></label><br />
    <label>City: <input type="text" id="address2" /></label><br />
    <label>Region: <input type="text" id="city" /></label><br />
    <label>Postcode: <input type="text" id="postcode" /></label><br />
    <input type="submit" />
</form>

Warum nicht gleich das Formular als hCard-From aufbauen?

<form action="#" method="post" id="vcard" >
  <fieldset id="fn">
    <legend>Name</legend>
    <label for="given-name">Vorname:</label>
      <input type="text" id="given-name" />
    <label for="family-name">Nachname:</label>
      <input type="text" id="family-name" />
  </fieldset>
  <label for="email">Email:</label>
    <input type="text" id="email" />
  <label for="url">Homepage:</label>
    <input type="text" id="url" />
  <fieldset id="adr">
    <legend>Adresse</legend>
    <label for="street-address">Straße:</label>
      <input type="text" id="street-address" />
    <label for="locality">Stadt:</label>
      <input type="text" id="locality" />
    <label for="region">Region:</label>
      <input type="text" id="region" />
    <label for="postal-code">Postleitzahl:</label>
      <input type="text" id="postal-code" />
  </fieldset>
  <input type="submit" />
</form>

Das Einheitliche Format für Ein- (Formular) und Ausgabe (Microformats) hätte zur Folge, dass keine aufwendigen Mapper (wie z.B. hCard-Mapper) mehr nötig wären um ein Formular per hCard auszufüllen…

Schöne neue Welt 🙂

Eigentlich bringt das iPhone, mit WLAN und einem (fast) vollwertigen Safari, die besten Voraussetzungen um Microformats zu verarbeiten.

Nach der Frage von Rauno

[…] Weißt du von einer Möglichkeit, Microformats aus Firefox in den iPhonekalender zu exportieren? […]

und nach Wojteks Kommentar…

[…] I prefer bookmarklets but this will come handy for sure too. […]

habe ich mir überlegt, es sollte doch möglich sein, Microformats mit einem Bookmarklet direkt auf dem iPhone nutzbar zu machen…

Prinzip ist einfach, Bookmarklet (z.B. von Leftlogic oder Technorati) im normalen Safari Bookmarken, iPhone Safari mit normalem Safari über iTunes syncen, das wars… (wem das zu schnell ging kann sich das hier nochmal in Ruhe am Beispiel eines del.icio.us Bookmarklets anschauen.)

Das Bookmarklet funktioniert super:

IMG_0056.JPG

…aber der §$%!& iPhone Safari kann keine vCard oder iCalendar Dateien verarbeiten!

IMG_0057.JPG

Mach ich irgendwas falsch? Sogar mein popliges Sony Ericsson Handy erkennt vCards und weiß dass sie ins Adress-Buch gehören!

Naja… Wie schon im Titel erwähnt: Es könnte so einfach sein.

(Dickes Danke an Florian (.dean) fürs testen und die Screenshots und an Marco, dessen iPhone ich kurz entführen durfte)

Vor ungefähr einem Jahr habe ich schonmal über einen Microformats Bluetooth-Export mit Hilfe von Tails-Export geschrieben. Da sich aber nach und nach der Operator als DAS Microformats-Addon für den Firefox durchgesetzt hat, wurde natürlich auch das Bluetooth-Script portiert.

Das Mac-Script findet man auf der Seite von Michael Kaply (direkter Link).

“Send to Bluetooth Device” action for sending ICS and VCF files via Bluetooth. Works with the hCard and hCalendar microformats.

…und seit letztem Monat gibt es auch ein Windows-Script von Thom Shannon (direkter Link).

I’ve modified the Mac only bluetooth user script for operator to work on windows. It’s based on this script, and originally inspired by Johns hack of Tails.

Wer sich viel mit Microformats beschäftigt, ist sicher schon öfters über den Begriff RDFa gestolpert. Die Idee, (X)HTML semantischer zu machen, ist bei beiden Formaten gleich, der Unterschied liegt hauptsächlich in der Syntax.
Während Microformats ausschließlich auf HTML 4.01 bzw. XHTML 1.0 validen Tags und Attributen basiert:

<div class="vcard">
  <span class="fn">Max Mustermann</span>
  <a class="email" href="mailto:max.mustermann@example.org">
    max.mustermann@example.org
  </a>
</div>

Beispiel hCard

…basiert RDFa auf dem klassischen RDF und mit XHTML 2.0 neu eingeführten Attributen wie z.B. property und about:

<body xmlns:contact="http://www.w3.org/2001/vcard-rdf/3.0#">
  <span property="contact:fn">Max Mustermann</span>
  <a rel="contact:email" href="mailto:max.mustermann@example.org">
    max.mustermann@example.org
  </a>
</body>

Beispiel vCard RDF in RDFa

Eine gute Einführung in das Thema RDFa bietet das Video von Manu Sporny:

Rein Technisch gesehen ist RDFa, durch die Nutzung von Namespaces und die bessere Skalierbarkeit durch URIs, definitiv der bessere Standard. Ich denke trotzdem nicht dass RDFa die Microformats in näherer Zukunft ablösen wird, da RDFa nur unter XHTML 2.0 möglich ist und (meines Wissens) im Konkurrenz-Format (X)HTML 5.0 nicht angedacht wird. Es ist deshalb notwendig beide Formate weiter voranzutreiben und so weit wie möglich auf einem einheitlichen Standard, wie z.B. der vCard im oben beschriebenen Beispiel, aufzubauen. Während der Übergangsphase ist es so relativ einfach mit GRDDL zwischen den beiden Formaten zu transformieren.

In seinem Artikel „RDFa vs microformats“ beschreibt Evan Prodromou die für ihn notwendigen Schritte für die Zukunft von RDFa:

  1. RDFa gets acknowledged and embraced by microformats.org as the future of semantic-data-in-XHTML
  2. The RDFa group makes an effort to encompass existing microformats with a minimum of changes
  3. microformats.org leaders join in on the RDFa authorship process
  4. microformats.org becomes a focus for developing real-world RDFa vocabularies

Mal schauen wie es wirklich kommt und was sich in Zukunft durchsetzen wird…

Wer sich für das Thema interessiert, kann ja mal Semantic Radar für Firefox ausprobieren. Semantic Radar macht (ähnlich wie Operator für Microformats) RDF und RDFa Inhalte in Webseiten sichtbar.

OpenID Logo„OpenID ist ein dezentrales System zur Identifizierung“ (WikiPedia).
OpenID bietet die Möglichkeit, Login Daten an zentraler Stelle anzugeben und diese als Authentifizierung für andere Webseiten zu verwenden. Simple Registration Extension (kurz SREG) ist eine Erweiterung zu der OpenID Authentifizierung, der einen simplen Profil-„Austausch“ erlaubt.
SREG ist, wie der Name schon sagt, „nur“ ein Simples Format, deshalb wurde eine Erweiterung mit dem Namen Attribute Exchange (AX), welches wesentlich mehr Informationen beinhaltet, entwickelt.

Chris Messina stellt sich in seinem Artikel „hCard for OpenID Simple Registration and Attribute Exchange“ die Frage warum bei der Definition der ersten AX-Typen (genauso wie bei SREG) versucht wird, Profil-Daten neu zu definieren, anstatt auf bestehende Standards wie die vCard (RFC2426) zurück zu greifen. Er argumentiert sein Anliegen mit der weiten Verbreitung der vCard und seines XHTML Pendants der hCard:

Most importantly, however, hcard and vcard is already widely supported in existing applications like Outlook, Mail.app and just about every mobile phone on the planet and in just about any other application that exchanges profile data.

Weiterlesen

vCard ExplorerDer vCard Explorer ist ein kleines Tool (leider nur für den Mac) zum Anzeigen von vCards und hCards, ohne sie direkt in das Adressbuch importieren zu müssen.

Weitere Features:

  • Durchsuchen der aktuell geöffneten URL in Safari nach einer hCard
  • Kein Importieren der vCards in das Adressbuch nötig für die Darstellung.
  • Anzeigen der Adresse in Google maps
  • Importmöglichkeiten von vCard und hCard in das Apple Adressbuch

Einige Screenshots und einen Screencast findet man auf der offiziellen Homepage.

Here are some code snippets to use the gorgeous X2V microformats XSLT files from Brian Suda with PHP 5 and libxslt (PHP 5 includes the XSL extension by default).

hCard to vCard:

To parse a XML or XHTML document, it has to be valid. To tidy the XML file, you can use a service from the W3C:

$xml_string_tidy = file_get_contents("http://cgi.w3.org/cgi-bin/tidy?docAddr=".urlencode($uri));

Then you have to create the HTML DOM…

@$document = new DOMDocument();
@$document->loadHTML($xml_string_tidy);

and the XSLT DOM…

$stylesheet = new DOMDocument();
$stylesheet->load('hcard2vcard.xsl');

Create a new XSLT Processor, load the Stylesheet…

$processor = new XsltProcessor();
$processor->importStylesheet($stylesheet);

and run the transformation.

$result = $processor->transformToDoc($document);
$str = $result->saveXML();

Now $str contains the transformed code.
To send the vCard header with PHP, try

header("Content-Disposition: attachment; filename=contact.vcf");
header("Content-Type: text/x-vcard; charset=UTF-8 name=contact.vcf");
echo $str;

If you want to use the vCard extension .vcf instead of .php you have to add something like that to your .htaccess file

RewriteEngine On
RewriteBase /
RewriteRule ^contact.vcf /hcard2vcard.php [L,QSA]

I hope it works 🙂