Emily Lewis : “Parvenir à la Sémantique avec les Microformats, 4ème partie - hCalendar”
Nous voici de nouveau à plonger dans le monde excitant (au moins pour moi) des microformats. Basé sur ce que j’avais plannifié au début, cet article marque le mi-parcours de la série. A ce stade, j’ai discuté de trois implémentations des microformats sur A Blog Not Limited :
- Spécifier les relations fondées sur les liens en utilisant l’attribut
reldans la 1ère Partie - Donner aux liens un “visage humain” en utilisant le microformat XFN dans la 2ème Partie
- Décrire les personnes, les sociétés et lieux avec le microformat hCard dans la 3ème Partie
Pas mal. Mais cela ne fait que gratter la surface des microformats.
Aussi, allons droit vers le microformat hCalendar, que j’utilise pour ajouter de la sémantique et de la structure à mon contenu pour les événements et activités basés sur des dates et heures.
Origines : iCalendar
iCalendar (ou iCal) est un standard pour partager des données de calendrier. Plus fréquemment, il est utilisé dans les échanges d’email, bien qu’il ne soit pas seulement limité à ce médium.
Comme la hCard, hCalendar a été introduit de manière à ce que les auteurs web puissent inclure des données iCalendar dans leurs pages web.
hCalendar est une représentation 1:1 du iCalendar, qui permet aux parseurs d’extraire de l’information d’événement provenant d’une page web de manière à ce qu’elle puisse être utilisée dans les programmes de calendriers (parmi d’autres usages).
Note historique : iCalendar est basé sur vCalendar (Virtual Calendar), qui est une application de calendrier en open source pour publier et maintenir des événements et rendez-vous en ligne. vCalendar a été développé avec le format de carte de visite électronique vCard.
Activités Fondées sur Date/Heure
Le microformat hCalendar décrit le type d’information à propos d’évènements (ou tout ce qui est basé sur les date/heure) que vous auriez sur un calendrier, à savoir (mais non limité) :
- Résumé
- Date et heure
- Lieu
- Description détaillée
- Récurrence
Les Bases
Tout comme hCard, hCalendar a quelques règles de base :
- Les propriétés et sous-propriétés sont exprimées sous des valeurs
class. - Du fait de la relation 1:1 avec iCalendar, les propriétés spécifiées hCalendar sont basées sur les noms de propriétés de iCalendar (à savoir,
vevent). - Les propriétés et sous-propriétés sont sensibles à la casse.
- La propriété “racine” ne peut pas être mélangée avec n’importe laquelle de ses propriétés. De ce fait,
<p class="vevent summary">est invalide.
Et même si ce n’est pas une règle, il est important de garder ça à l’esprit : le marquage utilisé importe peu.
Les valeurs de classe (propriétés/sous-propriétés) définissent le microformat hCalendar.
Ceci étant dit, j’encourage vraiment le marquage sémantique (et cela va sans dire valide).
Le Profil
Comme pour tous les microformats, il est recommandé de faire référence au profil hCalendar dans le <head> des pages web qui contiennent le microformat :
<head profile=”http://purl.org/uF/hCalendar/1.0/”>
Le W3C autorise plusieurs valeurs de profils, séparées par des espaces blancs, ainsi vous pouvez lister plusieurs profils si vous choisissez :
<head profile="http://gmpg.org/xfn/11 http://purl.org/uF/hCard/1.0/” http://purl.org/uF/hCalendar/1.0/“>
Cependant, si vous référencez des microformats-non-draft (et hCalendar est non-draft), vous pouvez utiliser à la place l’URL profil combinée, qui couvre tous les microformats non-draft :
<head profile="http://purl.org/uF/2008/03/“>
Si vous faites référence à la fois à des microformats non-draft et draft, vous pouvez utiliser ce profil combiné avec les profils pour les nouveaux/draft microformats.
L’exemple
Ce blog est encore relativement nouveau. Aussi, je n’ai pas eu beaucoup d’opportunités de lister de l’information d’évènement.
En fait, je n’ai qu’un exemple vivant, grâce à un article sur un BarCamp récent à Albuquerque où j’ai utilisé le microformat hCalendar :
<div class=”vevent”><p>
Oui, c'est un billet court, mais marquez ça dans vos agendas :
<a href="http://barcamp.org/BarCampAlbuquerque"
class=”url summary”>
<span class=”category”>BarCamp</span>
Albuquerque 3</a>
aura lieu ce week-end.
</p><dl><dt>Quand :</dt><dd><abbr class=”dtstart”
title=”2008-09-13T09:00:00″>13</abbr>–
<abbr class=”dtend” title=”2008-09-14T18:00:00″>14 septembre</abbr>,
à partir de 9h00 jusqu’à 18h00 les deux jours.</dd>
<dt>Où :</dt><dd class=”location vcard”>
<a class=”fn org url” href=”http://www.chefwhite.com/cjw_cafe.php”>CJW Cafe</a>
à <a href=”http://maps.google.com/maps” class=”adr”>
<span class=”street-address”>4801 Alameda
<abbr title=”Boulevard”>Blvd</abbr>
<abbr title=”Northeast”>NE</abbr>
</span>,
<span class=”locality”>Albuquerque</span>,
<abbr class=”region” title=”New Mexico”>NM
</abbr> <span class=”postal-code”>87113
</span>
</a>
</dd>
<dt>Quoi :</dt><dd class=”description”>
Un évènement de
<abbr class=”duration” title=”P2D”>deux jours</abbr> pour tout ce qui concerne le web — design (visuel, expérience, architecture de l’information), technologie (infrastructure, programmation), social et nouveaux médias, et d’autres trucs simplement vraiment cools.</dd></dl></div>
Les Parties de la Somme
Décomposons cet exemple avec ses parties.
La Racine : vevent
Vous remarquerez que la propriété racine dans mon exemple est vevent, plutôt que vcalendar. Ceci parce hCalendar a un élément racine optionne du vcalendar, qui n’est obligatoire que si vous décrivez plus d’un calendrier d’événements sur une page donnée.
Pour une page avec un unique calendrier d’événements, la propriété vcalendar est présumée sur la page elle-même.
Le fait que mon exemple soit un événement unique dans un “calendrier,” unique, je place toute mon information d’événement dans <div class="vevent">. Ceci indique que tout le contenu embarqué à l’intérieur décrit un événement unique.
Une fois de plus, l’élément conteneur pourrait être n’importe quoi (<dl>, <ul>, <p>, <span>, etc.) la <div> est simplement appropriée pour mon exemple.
Propriétés Requises : summary & dtstart
Les seules propriétés requises pour hCalendar (autres que la racine vevent) sont summary et dtstart.
summary
La propriété summary décrit un synopsis bref de l’événement. Le contenu embarqué par cette propriété est typiquement ce qui s’affiche dans un programme de calendrier sous le nom ou titre de l’événement.
Ainsi dans mon exemple, “BarCamp Albuquerque 3″ est contenu par summary, aussi c’est l’information qui s’affiche comme le nom/titre dans mon calendrier personnel :
<p>Oui, c'est un billet rapide, mais à marquer dans vos agendas : <a href="http://barcamp.org/BarCampAlbuquerque" class="url summary“><span class=”category”>BarCamp</span> Albuquerque 3</a> c’est ce week-end.</p>
dtstart
La propriété dtstart décrit les date/horaire pour le démarrage de l’événement. Dans mon exemple, “13″:
<dd>
<abbr class=”dtstart”
title=”2008-09-13T09:00:00″>13
</abbr>–<abbr class=”dtend”
title=”2008-09-14T18:00:00″>14 septembre</abbr>,
de 9h00 à 18h00 les deux jours</dd>
Date/Time Design Pattern
Remarquez que l’élément contenant pour dtstart est un <abbr>, là où l’information contenue est est “13″ et la valeur d’attribut title est “2008-09-13T09:00:00″:
<dd><abbr class=”dtstart”
title=”2008-09-13T09:00:00“>13</abbr>
–<abbr class=”dtend” title=”2008-09-14T18:00:00″>14 septembre</abbr>,
de 9h00 à 18h00 les deux jours</dd>
C’est l’approche actuellement recommandée pour définir l’information date/horaire dans un microformat — connue sous le datetime design pattern (qui est une extension du abbr design pattern).
Ce pattern a été développé pour supporter l’un des principes fondamentaux des microformats : designer d’abord pour les humains, ensuite pour les machines. Visant pendant tout ce temps, à fournir une information qui soit à la fois lisible par les humains et par les machines.
La logique est que les machines — tout comme les applications web — utiliseront la valeur title, alors que les navigateurs afficheront pour les humains le contenu embarqué par <abbr>.
Aussi, en tant que partie de la spécification pour utiliser ce “datetime pattern”, l’information date/horaire devrait être spécifiée dans un ISO 8601 :
- AAAA-MM-JJThh:mm:ss — “A” représente les nombres entiers de l’année, “M” représente les nombres entiers du mois, “J” représente les nombres entiers du jour, “h” représente les nombres entiers des heures, “m” représente les nombres entiers des minutes et “s” représente les nombres entiers des secondes.
- AAAA-MM-JJThh:mm:ssZ — “Z” est utilisé pour indiquer le GMT.
- AAAA-MM-JJThh:mm:ss+hh (ou -hh) — les “+hh” et “-hh” indiquent le décalage horaire en heure GMT.
Pour dire ça dans des termes un peu plus compréhensibles, 2008-09-30T13:00:00 = 30 septembre 2008, 13h00 (heure locale).
Le caractère “T” dans ces exemples sépare l’information de date de l’information d’horaire.
Si vous n’avez qu’une date, omettez simplement le “T” et l’information horaire le suivant. De même, si vous n’avez qu’un horaire, omettez le “T” et l’information de date le précédant.
Il existe néanmoins et hélas, quelques problèmes d’accessibilité avec ce pattern, problèmes que je décrirai plus tard dans cet article. A cette heure, continuons avec mon exemple.
Le Reste des Propriétés Date/Horaire
Il existe deux autres propriétés date/horaire (et optionnelles) que j’ai ajoutées : dtend et duration.
dtend
La propriété dtend décrit les date/horaire de la fin de l’événement. Dans mon exemple, “14 septembre”:
<dd>
<abbr class="dtstart" title="2008-09-13T09:00:00">13</abbr>
–<abbr class=”dtend”
title=”2008-09-14T18:00:00″>14 septembre</abbr>,
de 9h00 à 18h00 les deux jours</dd>
duration
La propriété duration décrit la durée (en temps) de l’événement.
Dans mon exemple, deux jours :
<dd class="description">Un évènement de <abbr class=”duration” title=”P2D”>deux jours</abbr> pour tout ce qui concerne
le web — design (visuel, expérience, architecture de l’information), technologie (infrastructure, programmation), social et nouveaux médias, et d’autres trucs simplement vraiment cools.</dd>
Tout comme pour l’information de date/horaire, l’information de durée est spécifiée en utilisant le “datetime design pattern”, où l’information “lisible-par-les-machines” est indiquée par la valeur title et l’”information-lisible-par les-humains” est contenue par le <abbr>.
Aussi, la valeur de “duration” title est spécifiée selon ISO 8601, qui indique que la valeur est précédée par un “P” pour indiquer une période de temps.
Cette période de temps peut être exprimée en années (Y), mois (M), semaines (W), jours (D), heures (H), minutes (M) et/ou secondss (S).
Voici quelques exemples pour clarifier cela :
- P2Y = durée de 2 ans
- P10D = durée de 10 jours
- P3H = durée de 3 heures
- P2W = durée de 2 semaines weeks
- P12DT8H30M = durée de 12 jours, 8 heures et 30 minutes
Parlons Accessibilité
J’ai rapidement évoqué dans la 3ème Partie qu’il y avait eu récemment quelques discussions sur les problèmes d’accessibilité avec le datetime design pattern.
Le point crucial du problème d’accessibilité est la façon dont les lecteurs d’écran interprètent les valeurs d’attribut title : ils les lisent/parlent.
Aussi, là où le datetime design pattern indique de mettre l’information ISO 8601 de date/horaire lisible par les machines dans le title, un lecteur d’écran déclame littéralement la valeur.
Imaginez entrendre ça à chaque fois que votre lecteur d’écran rencontre <abbr title="2008-09-30"> : “Deux mille huit tiret zéro neuf tiret trente.” Et c’est même encore pire pour les valeurs plus longues avec l’information sur l’horaire.
On peut soutenir que ceci n’est pas “human-friendly” pour ces utilisateurs.
A cette heure, ces problèmes n’ont pas été résolus. Il y a eu queques alternatives proposées, mais la communauté des microformats continue à discuter de la meilleure approche pour avancer afin de résoudre ces problèmes d’accessibilité et de rester cohérente avec l’esprit des microformats.
Pour moi et mon blog personnel, mes référents indiquent que je n’ai pas de visiteurs avec des lecteurs d’écran. Aussi, je ne suis pas préoccupée par l’implémentation du “datetime design pattern” sur ce blog.
Néanmoins, travaillant pour une grande entreprise, le manque d’accessibilité n’est tout simplement pas acceptable (pour moi et mon superviseur direct, même si je suis certaine que les “gros bonnets” pourraient moins s’en soucier).
Je suis désireuse de voir comment vont ces problèmes vont être résolus, de manière à ce que je puisse implémenter correctement l’information date/horaire en microformats et que cela puisse être encore supporté par tous les utilisateurs de lecteurs d’écrans.
Désormais, il est temps de revenir à l’exemple et des propriétés restantes utilisées …
Le Reste du Reste
Mon exemple comprend quatre propriétés supplémentaires (aussi optionnelles) : url, category, location and description.
url
La propriété url décrit un lien (<a>) pour l’événement :
<p>Oui c'est un billet rapide, mais marquez vos agendas : <a href="http://barcamp.org/BarCampAlbuquerque” class=”url summary”><span class=”category”>BarCamp</span> Albuquerque 3</a> c’est ce week-end.</p>
Vous remarquerez que j’ai ajouté la propriété url à la propriété summary. Ceci tout simplement parce que le contenu embarqué par le <a> était simplement la valeur pour mon summary. D’autres implémentations pourraient être différentes.
category
La propriété category décrit le type d’événement. Dans mon exemple, “BarCamp” :
<p>Oui c'est un billet rapide, mais marquez vos agendas :
<a href="http://barcamp.org/BarCampAlbuquerque" class="url summary">
<span class=”category”>BarCamp</span> Albuquerque 3</a>
c’est ce week-end.</p>
A la différence des propriétés évoquées plus haut, category peut utiliser un nombre illimité de fois. Quelques exemples communs de valeurs de category sont :
- Rencontre
- Expo
- Vacances
- Anniversaire
- Conférence
Dans un certain sens, category est un moyen de “taguer” l’événement. Aussi, si j’avais choisi de marquer mon exemple pour y inclure un lien vers le site principal du BarCamp, j’aurais aussi utilisé microformat rel-tag pour accompagner category :
<p>Vous pourriez vous demander ce qu'est un
<a href="http://barcamp.org/"
class=”category” rel=”tag”>BarCamp</a> ?
</p>
Souvenez-vous, rel-tag ne peut être uniquement utilisé que sur des liens (<a>).
location
La propriété location décrit où aura lieu l’événement.
<dd class=”location vcard”><a class=”fn org url”
href=”http://www.chefwhite.com/cjw_cafe.php”>CJW Cafe
</a> au <a href=”http://maps.google.com/maps” class=”adr”>
<span class=”street-address”>4801 Alameda
<abbr title=”Boulevard”>Bd</abbr>
<abbr title=”Northeast”>NE</abbr>
</span>,
<span class=”locality”>Albuquerque</span>,
<abbr class=”region” title=”New Mexico”>NM</abbr>
<span class=”postal-code”>87113</span></a>
</dd>
Dans mon exemple, je fournis le nom du lieu et son adressse. Néanmoins, ce peut être tout simplement le lieu, ou juste l’adresse ; les deux ne sont pas requis.
description
Pour finir, la propriété description décrit un synopsis plus détaillé de l’évènement que summary :
<dd class=”description”>Un évènement de
<abbr class=”duration” title=”P2D”>deux jours</abbr>
pour tout ce qui concerne le web — design (visuel, expérience, architecture de l’information), technologie (infrastructure, programmation), social et nouveaux médias, et d’autres trucs simplement vraiment cools.
</dd>
Ce Que Je N’ai Pas Ajouté
Il existe plusieurs autres propriétés souvent utilisées pour hCalendar que j’ai choisies simplement de ne pas ajouter à mon exemple :
dtstampindique les date/horaire à laquelle l’information hCalendar a été créée.last-modifiedindique les date/horaire à laquelle l’information hCalendar a été mise à jour.statusindique la confirmation d’événement. Les valeurs autorisées sont “cancelled,” “confirmed” et “tentative.”classindique la classification d’événement. Les valeurs autorisées sont “private,” “public ” et “confidential.”rruleindique la récurrence régulière d’un événement. Si cette propriété est utilisée, elle a une sous-propriété obligatoire defreqpour indiquer la fréquence de la récurrence, qui est spécifiée plus en profondeur par des qualifiants (à savoir,count,interval).rdateindique des événements qui arrivent irrégulièrement. La valeurtitlerenvoie les dates irrégulières (séparées par des virgules).
Et il en existe encore d’autres qui peuvent être utilisées. Regardez les exemples hCalendar sur le wiki pour plus de détails.
hCalendar + hCard
Peut-être que vous avez remarqué que mon marquage hCalendar comprenait des propriétés et sous-propriétés hCard :
<dd class="location vcard“>
<a class=”fn org url”
href=”http://www.chefwhite.com/cjw_cafe.php”>CJW Cafe</a> au
<a href=”http://maps.google.com/maps” class=”adr”>
<span class=”street-address”>4801 Alameda
<abbr title=”Boulevard”>Blvd</abbr>
<abbr title=”Northeast”>NE</abbr></span>,
<span class=”locality”>Albuquerque</span>,
<abbr class=”region” title=”New Mexico”>NM</abbr>
<span class=”postal-code”>87113</span></a>
</dd>
Comme je l’évoquais dans la 3ème Partie, combiner les microformats est facile, et là où cela produire du contenu contextuel, cela ajoute plus de valeur sémantique au contenu (et vous savez ce que j’en pense).
Pour aller plus loin, cela donne à l’utilisateur juste quelques autres types de données qui peuvent être extraites et utilisées, comme une vCard pour son carnet d’adresses.
Dans cet exemple, la propriété location du hCalendar fait sens pour être aussi marquée avec vcard. Même si je n’ai fait que rajouter la ville, j’aurais pu encore ajouter les propriétés/sous-propriétés de hCard.
Langage Naturel
J’ai parlé aussi d’utiliser les microformats en langage naturel (dans le flux de phrases normales) dans la 3ème Partie, et hCalendar ne fait pas exception à ce concept.
Vous remarquerez que dans cet exemple, quelques informations du hCalendar sont directement dans le flux de mon contenu.
J’aurais pu mettre toute l’information du hCalendar dans des phrases naturelles plutôt que de “découper” quelques-uns des détails dans des <dl> :
<div class=”vevent”>
<p>Oui, c'est un billet rapide, mais à marquer dans vos calendries :
<a href="http://barcamp.org/BarCampAlbuquerque"
class=”url summary”>
<span class=”category”>BarCamp</span> Albuquerque 3</a> c’est ce week-end,
<abbr class=”dtstart” title=”2008-09-13T09:00:00″>13
</abbr>–
<abbr class=”dtend”
title=”2008-09-14T18:00:00″>14 septembre</abbr>, de 9h00 à 18h00
<abbr class=”duration” title=”P2D”>les deux jours</abbr>.
</p><p class=”description”>Ce BarCamp de l’année traitera de tout ce qui concerne le web : design (visuel, expérience, architecture de l’information), technologies (infrastructure, programmation), social et nouveaux medias, et d’autres trucs qui sont tout simplement vraiment cools.</p>
<p class=”location vcard”>
<a class=”fn org url” href=”http://www.chefwhite.com/cjw_cafe.php”>CJW Cafe</a>
(sur <a href=”http://maps.google.com/maps” class=”adr”>
<span class=”street-address”>4801 Alameda
<abbr title=”Boulevard”>Blvd</abbr>
<abbr title=”Northeast”>NE</abbr>
</span>, <span class=”locality”>Albuquerque</span>,
<abbr class=”region” title=”New Mexico”>NM</abbr>
<span class=”postal-code”>87113
</span>
</a>) sera notre hôte pour l’événement.
</p></div>
Ajouter à votre Calendrier
Aussi sur l’article BarCamp Albuquerque 3, je fournis un lien aux utilisateurs pour qu’ils puissent ajouter l’événement à leurs programmes de calendrier :
Ce lien pourrait être une URL directe vers n’importe quel fichier iCalendar (à savoir, .ics, .ical, .ifb, .icalendar) avec votre information d’événement. En ce qui me concerne, j’ai utilisé le Service de Fils d’Evénements de Technorati.
En utilisant la technologie de Technorati, vous faites précéder simplement l’URL de la page où réside votre microformat avec http://feeds.technorati.com/events/, et puis utilisez l’URL résultante comme la valeur href de votre lien (<a>) :
<a href="http://feeds.technorati.com/events/http://www.ablognotlimited.com/articles/barcampalbuquerque-around-the-corner”
title=”Télécharger le fichier .ics “>
Ajoutez à votre calendrier</a>
Quand un utilisateur sélectionne ce lien, le fichier .ics est créé dynamiquement et il peut le télécharger ::
Les Apparences Comptent
Je l’ai répété plusieurs fois : le marquage importe peu (bien qu’il devrait idéalement être valide et sémantique).
Et même si les valeurs class (propriétés/sous-propriétés) sont essentielles pour le microformat, la CSS que vous utilisez pour styliser votre information hCalendar est uniquement dédiée à la présentation (pas pour dire que ce n’est pas important).
Je recommanderais néanmoins d’utiliser les valeurs class qui sont requises par hCalendar dans votre CSS, plutôt que d’ajouter de nouvelles classes pour le style. Ceci vous donne simplement une CSS plus maigre.
Pour un exemple sur la façon dont vous pouvez styliser un calendrier d’événements, jetez un oeil au superbe travail de Jeremy Keith qu’il a produit pour des calendriers en cascade.
Pour finir, vous pouvez produire tout ce que votre coeur désire. La présentation de votre hCalendar ne se limite qu’à vos talents en CSS.
Pourquoi s’en Soucier ? Les Avantages, Bien Sûr
Bien qu’ayant déjà traité des avantages dans cette série d’articles, ils valent toujours la peine d’être répétés, … essentiellement parce que les microformats sont si simples à mettre en oeuvre et qu’ils offrent tant de potentiels.
Je souhaiterais que plus de personnes les connaissent et les utilisent. Cela aiderait à accroître le nombre d’outils et d’applications qui les utilisent.
Une Fois de Plus : Sémantique
Oui, la sémantique. Vous devez croire que c’est mon concept favori. Oui, vous auriez raison.
Les microformats prennent les standards existants, comme les éléments XHTML, et ajoutent encore même plus de valeur sémantique au contenu qu’ils contiennent. Ceci aide de mon point de vue les auteurs web à créer de meilleurs sites qui deviennen t plus utilisables et accessibles tant pour les humains que pour les machines (comme les moteurs de recherche).
Pour aller plus loin, le fait d’adopter la sémantique (même sans microformats, mais dans le marquage en lui-même) fait partie du support des standards ; des moyens standardisés de développer des sites. Ceci profite non seulement aux utilisateurs (et ceci concerne aussi les machines), mais assi aux designers/développeurs et aux équipes. Cela profite à tous.
Et, une fois de plus, ces approches posent une fondation (sémantiquement riche) pour Le Web Sémantique, tout en nous permettant simultanément de tirer profit du web et des technologies d’aujourd’hui.
Cool Shit
Je comprends tout à fait que la sémantique et les standards relèvent pour certains de discussions philosophiques. En fin de compte, soit vous “captez” ou non.
Si vous êtes dans le dernier camp, considérez quelques-uns des outils plutôt cools et utiles disponibles aujourd’hui qui savent tirer profil du microformat hCalendar.
Extensions Navigateur
Il existe tout un paquet d’outils navigateurs qui extraient l’information hCalendar provenant d’une page web de façon à pouvoir l’exporter et l’utiliser dans des applications qui supportent iCalendar.
- L’extension Operator pour Firefox extrait l’information hCalendar et vous permet de l’ajouter dans votre application préférée de gestion de calendrier (elle fait de même avec l’information hCard pour votre carnet d’adresses) :
- Aussi pour Firefox, l’extension Tails Export détecte l’information hCalendar (tout comme pour hCard) et l’extrait pour l’exporter dans votre application de calendrier :
- Le plugin microformats pour Safari fonctionne comme les extensions Firefox, en extrayant pour vous l’information hCalendar (et hCard) afin de l’ajouter à votre programme de calendrier.
- Le bookmarklet microformats extrait lui aussi l’information hCalendar que vous pouvez exporter dans votre application de calendrier :
Autres Services
- X2V de Brian Suda est une feuille de style XSLT qui extrait l’information hCalendar provenant d’une page web pour créer un fichier iCalendar .ics.
- Technorati offre un moteur de recherche de microformats qui indexe l’information microformatée (hCalendar, hCard et hReview) provenant d’URLs proposées et rend cette information disponible pour la recherche.
- Elias Torres a créé un script Greasemonkey hCalendar + Google Calendar Reminders qui identifier l’information hCalendar sur une page web et fournit une icône pour ajouter cet événement à votre Calendrier Google.
- Un autre script GreaseMonkey de Les Orchard vous permet de modifier les champs de formulaire texte de Firefox pour devenir des générateurs hCalendar : Magic Microformat Forms.
Il existe encore plein d’implémentations hCalendar que je n’ai pas mentionnées.
Pression Par les Pairs
Si ces ressources ne vous ont pas fait tourner la tête, alors peut-être qu’un peu de pression par les pairs le fera. Bon nombre de services leaders aujourd’hui utilisent hCalendar (et d’autres microformats) :
- Le site d’événement de Yahoo, Upcoming utilise hCalendar, de façon à ce que pendant que les utilisateurs naviguent dans les événements, ils puissent aussi les importer dans leurs applications de gestion de calendrier.
- MapQuest Local supporte aussi hCalendar, tout comme les microformats hCard et celui de géolocalisation.
- TripIt utilise le marquage hCalendar pour ses itinéraires.
- Last.fm utilise hCalendar pour ses annonces de concerts.
- Le géant du réseau social, Facebook, utilise hCalendar pour l’information d’événements.
Et il existe encore plus d’exemples hCalendar dans la jungle…
Bon, vous savez que vous voulez y aller. Essayez tout simplement. Croyez-moi, vous aimerez.
Outils pour une Production Plus Facile
Aussi, si j’ai pu parvenir à vous “vendre” les microformats, vous pourriez être ravi(e) de savoir qu’il existe quelques outils qui vous faciliteront la vie pour les implémenter (à l’inverse du codage à la main, sans mentionner le fait de se rappeler de toutes les propriétés/sous-propriétés) :
- Le hCalendar Creator est un formulaire qui génère du marquage hCalendar et les propriétés/sous-propriétés que vous lui proposez. Copiez et collez. Ne pourrait pas être plus simple.
- Pour Textpattern, vous disposez du plugin pnh_mf et de JMC_Event_Manager pour ajouter du contenu microformaté à votre site/blog Textpattern.
- WordPress a aussi quelques plugins qui aident les auteurs web à ajouter des microformats à leurs blogs/sites WordPress : Structured Blogging (aussi disponible pour MovableType) et WP-Microformats.
- Grâce à WaSP, il existe une extension microformats pour Dreamweaver conçue pour DW 8, MX et au-dessus.
- Le Conference Schedule Creator vous aide à créer un programme complet de conférence avec tous les événements marqués avec hCalendar.
A venir en 5ème Partie
Voilà c’est tout ce que j’ai pour hCalendar (est-ce assez ?).
La prochaine fois, dans Parvenir à la Sémantique avec les Microformats, 5ème Partie, je vous emmènerai en détail sur le microformat hAtom pour le contenu syndiqué comme les billets de blogs.
D’ici là …
♥ Share the Love
- ♥ Delicious
- ♥ Digg
- ♥ Ma.gnolia
- ♥ StumbleUpon
- ♥ Design Float
Note : Cette traduction s’inscrit dans la poursuite de travaux visant à mieux faire connaître les microformats. L’article original d’Emily Lewis a été publié le 1er octobre dernier sur son blog personnel. Seul le lien original fait référence. Vous pouvez aider à raffiner cet article en éditant directement le code posé sur la page miroir de mon wiki-personnel. Merci d’avance. xtof
