Archive for the ‘ressources’ Category

C’est quoi les Monkeyformats ?

Thursday, May 1st, 2008

Ce ne serait pas élégant si les navigateurs intelligents pouvaient reconnaître les adresses, les dates et autres données structurées figurant sur les pages web ? Et ce même quand les données ne sont pas structurées ? (tout comme le fait l’application Mail d’Apple qui reconnaît les dates et les heures en fournissant à l’utilisateur lambda une interface pour faire des choses simples comme savoir les ajouter à son agenda)…

Et bien disons qu’avec les monkeyformats d’Albert de Klein, on fait juste là un (grand) pas en avant. Amusez-vous par exemple à extraire les hCards sur les Pages Jaunes : essayé à l’instant sur une simple requête “Aston Martin” à Paris et ça fonctionne !. Bravo et merci Albert. - xtof

P.S. Ce qui suit en-dessous est une traduction en cours publiée sous FairUse de la page monkeyformats.org, seul lien de référence.

monkeyformats

Albert de Klein : C’est quoi les Monkeyformats ?

Les Monkeyformats sont des scripts utilisateurs Greasemonkey qui ajoutent un balisage sémantique dans le navigateur Firefox aux sites web ne supportant pas encore les Microformats. Vous pouvez alors exécuter des actions sur ces Microformats avec Operator ou toute autre extension similaire.

Vidéo Monkeyformats

Pourquoi avons-nous besoin des Monkeyformats ?

L’adaptation des microformats peut utiliser un boost dans le monde car cela fait du Web un plus bel endroit. Les Monkeyformats permettent aux utilisateurs d’expérimenter les avantages des microformats sur des sites qu’ils utilisent tous les jours mais qui manquent à cette heure de balisage sémantique, et sans les contraindre à attendre que ces sites les ajoutent. Même si nous n’en sommes encore qu’aux prémisses, il existe déjà plusieurs monkeyformats disponibles qui ajoutent des microformats à quelques répertoires téléphoniques nationaux en Europe, aux services de billetteries, etc.

Exemple de Monkeyformat

hCard

Directory Pays Installation Auteur
Yellow Pages (Nouveau !) US Installer Albert de Klein
Pagine Bianchi Italie Installer Albert de Klein
British Telecom Royaume-Uni Installer Thom Shannon
Das Telefonbuch Allemagne Installer Albert de Klein
De Telefoongids Pays-Bas Installer Albert de Klein
Pages Jaunes France Installer Albert de Klein

hCalendar

Event listing Country Installation Auteur
Ticketmaster.co.uk Royaume-Uni Installer Albert de Klein
Lippupalvelu.fi Finlande Installer Albert de Klein
Billettservice.no Norvège Installer Albert de Klein
Ticnet.se Suède Installer Albert de Klein
Billetnet.dk Danemark Installer Albert de Klein
Ticketmaster.nl Pays-Bas Installer Albert de Klein

Comment puis-je utiliser ces Monkeyformats ?

Tout d’abord, vous devez installer à la fois l’extension Greasemonkey et l’extension Operator dans votre navigateur Firefox. Puis vous pouvez essayer quelques-uns des scripts utilisateurs provenant du répertoire Monkeyformat en les installant et en visitant les sites web pour lesquels ces microformats ont été écrits. Dans la plupart des cas, les signaux d’Operator devraient s’allumer dans la barre d’adresses après que vous ayez éxécuté une recherche indiquant que les microformats ont été ajoutés à la page. Puis vous pouvez par exemple envoyer ces hCards dans votre carnet d’adresses ou sur votre téléphone mobile.

Comment je crée mes propres microformats ?

Si vous voulez créer vos propres microformats, jetez un coup d’oeil aux scripts utilisateurs dans le repository. La plupart d’entre eux utilisent une combinaison de requêtes Xpath et de remplacements d’Expressions Régulières pour appliquer les microformats aux pages. Pour quelques sites c’est relativement facile d’appliquer les classes des microformats car tous les éléments sont en place et vous n’avez qu’à ajouter les classes appropriées. Dans la plupart des cas, vous devrez ajouter des éléments supplémentaires autour des adresses, des codes postaux ou des localités parce qu’ils ne sont pas entourés par des éléments à cette heure pour s’appliquer aux classes. Parfois, vous devrez même ajouter quelques éléments imbriqués pour rendre possible la structure des microformats.

Si vous créez des monkeyformats, partagez les S.V.P. avec d’autres dans le repository Userscripts.org. N’oubliez pas d’ajouter le tag monkeyformats pour faciliter la recherche.

Qu’est-ce que Greasemonkey ?

Greasemonkey est une extension pour le navigateur Firefox qui peut modifier l’apparence des sites web grâce à Javascript du côté client.

Qu’est-ce qu’Operator ?

Operator est une extension pour Firefox qui vous permet d’exécuter des actions sur les Microformats grâce à JavaScript.

C’est quoi les Microformats?

Les microformats sont un ensemble divers de spécifications qui vous permettent d’ajouter un balisage sémantique dans les pages HTML en utilisant des attributs de classes pré-définis.

Pour en savoir plus

Le concept complet des Monkeyformats est vraiment tout nouveau. Pour le moment, (et si vous savez lire le néerlandais) vous pourriez aussi jeter un oeil sur l’article que j’ai écrit pour Naar Voren, un magazine hollandais pour les travailleurs du web, dans lequel j’ai présenté le concept des Monkeyformats pour quelque information plus approfondie.

Amusez-vous avec le Web Sémantique !

Albert de Klein

Brian Suda - Encodage XFN, extraction et visualisations

Sunday, April 13th, 2008

Par Brian Suda. Traduction d’un article publié initialement le 21 février 2008 chez Dev.Opera. Seul le lien original fait référence.

Introduction

Dans cet article, j’exposerai un bel aperçu de XFN - le microformat pour décrire les relations entre personnes. Je regarderai rapidement ce que c’est et quel est le balisage requis pour ajouter de l’information sur vos sites, avant d’aller ensuite plus en profondeur, pour regarder les avantages dont vous pourrez tirer profit de cette donnée en l’extrayant et en l’utilisant de différentes façons. Extraire la donnée est plus facile que vous ne le pensez - il existe probablement une librairie déjà disponible pour votre langage ! Sinon, il existe aussi quelques services web qui pourraient faire le boulot que je vous présenterai en-dessous.

Remarquez que j’ai créé quelques exemples complexes pour accompagner les sections CSS et XSLT - vous pouvez télécharger le code ici.

Qu’est-ce que XFN ?

XFN veut dire “XHTML Friends Network” et c’est l’un des tout premiers microformats créé par le Global Multimedia Protocol Group. Il a émergé de la tendance générale à publier des liens vers d’autres sites dont vous appréciez la lecture. Sur votre blog, cela s’appelle une blogroll - il est commun de penser aux personnes à travers leurs sites web. Leur URL est une représentation de cette personne ; elle fait partie de son identité en ligne. XFN est une tentative pour codifier ces relations en utilisant du HTML standard.

XFN est très facile à utiliser - vous utilisez simplement quelques mots-clés intuitifs pour décrire les relations que vous avez avec d’autres personnes. Il existe un document XMDP qui décrit toutes les valeurs possibles XFN. Ces valeurs sont très basiques et capturent un large spectre de possibilités. J’avancerai avec vous à travers quelques exemples en-dessous. XFN est volontairement laissé vague ; il permet aux définitions de plus facilement se tordre dans le temps, et par conséquent nous obtenons une liste plus courte. Une liste plus verbeuse aurait été autrement trop longue et vous n’auriez pas pu décider exactement quelles valeurs utiliser, et elle n’aurait jamais pu être suffisamment granulée pour quiconque. Aussi XFN colle aux 80% des usages et ce rapidement et facilement, et en utilisant quelque chose de CHIC ou d’autres microformats pour coller à tous les cas particuliers.

Ces valeurs XFN sont ajoutées à l’intérieur des attributs rel (rel est un raccourci pour “relation”) des éléments a que vous utilisez pour lier ces personnes. L’attribut rel peut aussi apparaître sur l’élément link, mais du fait que les microformats se préoccupent de rendre les méta-données plus visibles, nous nous concentrerons seulement sur l’élément “a“. Un bel aspect de l’attribut rel est qu’il peut prendre un ensemble de valeurs séparées-non-ordonnées. Ceci veut dire que vous pouvez produire des déclarations XFN composées très simplement en listant plus d’une valeur, si la personne que vous liez a plus d’un type différent de relation envers vous. Ce qui suit est un tableau des valeurs possibles XFN, classées en catégories :

Amitié
(une
sélection)
Phys. Pro. Géo
(une
sélection)
Famille
(une
sélection)
Roman-
tique
Identité
contact met co-worker co-resident child muse me
acquaintance colleague neighbor parent crush
friend sibling date
spouse sweetheart

Implémentation

Ainsi prenons par exemple, Chris Mills, l’éditeur de mon article. Il a une bio d’auteur sur dev.opera.com, ainsi nous pouvons utiliser ce lien :

<a href="http://dev.opera.com/author/974138" rel=”">
Chris Mills</a>

Maintenant que j’ai ma structure basique, j’ai besoin de placer les valeurs appropriées pour mes relations avec Chris. Si je démarre simplement à gauche de la liste XFN et la parcours, je peux voir quelles valeurs je peux utiliser. La première catégorie est Amitié, qui décrit le niveau d’amitié que Chris et moi avons. Je sais comment contacter Chris, aussi contact est certainement approprié. Pour la plupart des personnes, ce pourrait être la relation maximale possible, mais je connais Chris mieux que cela, aussi je pourrais utiliser acquaintance. J’ai aussi travaillé avec Chris avant sur d’autres projets et l’ai rencontré à plusieurs occasions comme sur SxSWi et d.Construct, et nous avons pu discuter lors de plusieurs breuvages, par conséquent je pense que friend est la description qui colle le mieux. Quelques personnes réservent le terme friend aux personnes à qui elles laisseraient voir leurs enfants, quelques personnes sont amies avec quelqu’un qu’elles ont simplement rencontré durant 5 minutes ou admirent. Dans la catégorie amitié, il est possible de n’avoir qu’une seule valeur, aussi je baliserais Chris comme un friend. Le terme friend est souvent symétrique, ce qui veut dire que si je considère Chris comme un ami, il est probable qu’il me considère aussi comme un ami, mais ce n’est pas requis. Chris pourrait être encore bien plus strict sur sa définition de friend et de ne considérer seulement cette valeur que pour les quelques personnes sur la liste destinataires de sa carte de voeux. La définition de friend est ouverte à interprétation et changera avec le contexte et le temps. Du fait que la catégorie Amitié ne peut avoir qu’une seule valeur au plus, j’ai sélectionné le plus haut niveau de relation, friend.

<a href="http://dev.opera.com/author/974138" rel="friend“>
Chris Mills</a>

La prochaine catégorie est Physique. La seule option est met, et j’ai rencontré Chris à plusieurs occasions, aussi je peux ajouter cela à la valeur rel.

<a href="http://dev.opera.com/author/974138" rel="friend met“>
Chris Mills</a>

L’ordre des valeurs XFN n’est pas important ; le fait qu’elles soient séparées par des espaces veut dire que toutes ces valeurs s’appliquent. La prochaine catégorie est Professionnel. Celles-ci décrivent quelques relations professionnelles que vous pourriez avoir eues avec des personnes. Chris et moi travaillons tous deux dans le même secteur et écrivons pour dev.opera.com, par conséquent je dirais qu’il est un colleague. L’autre option est co-worker, mais nous ne travaillons pas pour la même société, aussi je n’utiliserai probablement pas ça. Ces deux valeurs professionnelles sont symétriques, aussi si je suis un “co-worker” de Chris, alors il est aussi un “co-worker” avec moi, et il en est de même pour “colleague” - si nous travaillons tous les deux dans le même secteur, alors nous devrions tous les deux nous considérer l’un et l’autre comme “colleague”.

<a href="http://dev.opera.com/author/974138"
rel="friend met colleague“>
Chris Mills</a>

Dans le reste des catégories, je ne trouve pas quelque valeur qui corresponde à Chris, aussi je n’ai pas besoin d’ajouter quelque valeur supplémentaire à mon attribut rel.

La dernière catégorie dans XFN est Identité, elle n’est utilisée que pour vos propres sites, pas pour les sites des amis. La seule valeur ‘rel‘ est ‘me‘ qui, quand elle est symétrique, permet la consolidation d’identité à travers différentes pages sur internet. Si mon site web suda.co.uk a un lien vers mon profil flickr, je peux utiliser rel="me". Puis son profil flickr, je peux utiliser rel="me" pour faire un lien arrière vers suda.co.uk. Si je peux faire ça sur toutes mes différentes pages profils sur Twitter, upcoming et autres, alors n’importe quel crawler XFN rel-me pourra commencer à construire un profil unique de moi sur le Web, tout cela sans avoir à dire à chaque site isolé ce qu’il en est de tous mes autres profils.

Outils pour créer XFN

Si cela vous semble difficile à mémoriser, pas de panique - il existe beaucoup d’outils pour vous aider. Il existe une version web du créateur XFN en différentes langues pour vous aider à démarrer rapidement. Il existe aussi des plug-ins pour Dreamweaver et Wordpress. De plus en plus de plugins sont en train d’apparaître, aussi soyez sûr de vérifier la page wiki sur XFN pour votre langage favori ou votre système de gestion de contenu.

Problématiques avec XFN

Il y a toujours eu quelques problématiques ouvertes avec XFN. Je ne m’y attarderai pas ici, mais ci-dessous je souligne quelques points communs et regarderai comment nous pouvons avoir intérêt à les connaître.

  • Par exemple, il n’existe pas de moyen de dire ex-ami de 1990-2000. XFN existe dans le maintenant. C’est plus un cas limite et ne peut pas être représenté dans XFN.
  • La définition de ‘friend’ est peut-être trop vague. C’est une zone grise - quelques-uns la considèrent trop vague, et d’autres disent de laisser le langage évoluer et la définition de “friend” changera tout autant. Personnellement je suis d’accord avec la dernière proposition - si nous nous efforçons d’améliorer la précision de la terminologie, nous pourrions sur-compliquer les choses et aboutir à 400 définitions supplémentaires de l’amitié que personne n’utiliserait de toutes façons.
  • XFN n’a pas suffisamment de relations professionnelles telles que “manager” ou “vendor”. Le truc génial à propos du HTML est que vous pourriez écrire rel="co-worker manager". Un parseur XFN trouverait encore la valeur ‘co-worker’ et d’autres parseurs spécifiques extrairaient vos valeurs personnalisées telles que ‘manager’. Les microformats sont aussi basés sur les pratiques existantes, aussi du fait que de plus en plus de personnes publient leurs relations professionnelles, celles-ci pourraient être classées dans le XFN à une date ultérieure. Rien n’est figé dans la perpétuité.

Comment extrayez-vous la donnée XFN ?

Il y a beaucoup de façons pour que vous puissiez extraire la donnée provenant du HTML, et j’étudierai dans cette section quelques-unes des plus populaires.

JavaScript

Javascript complète naturellement le HTML, ainsi c’est un langage idéal pour parser le XFN à partir du DOM. Le Javascript pourrait être chargé à l’intérieur de la page onLoad, il pourrait faire partie d’un bookmarklet, ou même être compilé dans un script greasemonkey. Voici un peu de code simple pour que vous puissiez démarrer.

// get all 'a' elements

var links=document.getElementsByTagName("a");
var xfnValues=['friend','acquaintance','contact','met','co-worker','colleague','co-resident','neighbor','child','parent','sibling','spouse','kin','muse','crush','date','sweetheart','me']

// boucle et recherche les attributs rel

for(var i=0;i<links.length;i++){
  var link = links[i];
  // regarde pour voir si le lien a un attribut rel et href
  if(link.getAttribute("href")&&link.getAttribute("rel")) {
    // reçoit la valeur rel
    var rel=link.getAttribute("rel");
    // boucle à travers les valeurs connues XFN
    for(var j=0;j< xfnValues.length;j++) {
      // cherche des correspondances
      var regex=new RegExp('\\b'+ xfnValues[j]+'\\b',"i");
      if(rel.match(regex)) {
        // fait quelque chose ici
      }
    }
  }
}

Drew McLellan a un outil génial rel-Lint, qui vous aidera à trouver les problèmes communs avec votre XFN et d’autres balisages.

CSS

En utilisant CSS, vous pouvez facilement styliser les données XFN. Il existe beaucoup de façons d’y parvenir, y compris les couleurs d’arrière-plan, ou en utilisant :after {content:"xxx" } pour ajouter un astérisque ou une image. Wolfgang Bartelme a produit quelques très belles images à cette intention qui sont une licence généreuse.

Les valeurs XFN sont ajoutées aux attributs rel des éléments a.
Ainsi, la première partie de toute déclaration CSS serait de styliser le a, à partir de là nous construirons des valeurs spécifiques XFN pour le stylisme.

a{ background-color: yellow; }

Ceci donnera un arrière-plan jaune à tous les liens, mais j’ai besoin d’être plus spécifique ici - ensuite je voudrais ne cibler que les éléments a avec un attribut rel. Ceci est possible avec le sélecteur d’attribut CSS.

a[rel] { background-color: yellow; }

Ceci n’appliquera le style qu’à tous les liens qui contiennent aussi l’attribut rel. L’étape suivante est de s’assurer que les attributs rel sélectionnés ont des valeurs XFN - nous ne voulons tout simplement pas n’importe quel attribut rel.

a[rel="friend"]{ background-color: yellow; }

Bien que cela soit correct, ça ne trouvera que des éléments a qui ont une valeur unique rel de friend. Souvenez-vous que l’attribut rel peut prendre une liste de valeurs séparées. S’il y a d’autres valeurs sur l’attribut rel, ce sélecteur ne collera pas et le style ne sera pas appliqué. Aussi, j’ai besoin d’ajouter un autre morceau d’information à ma syntaxe de sélecteur CSS.

a[rel~="friend"]{ background-color: yellow; }

En utilisant ~=" au lieu de simplement =, cela dit au navigateur d’accorder la chaîne friend dans n’importe quelle liste de valeurs séparées-par-des-espaces, comme tout simplement friend. Remarquez que ceci n’est pas supporté dans IE6, mais ce l’est dans la plupart des autres navigateurs modernes. Pour finir, il est aussi possible de chaîner ensemble ces valeurs :

a[rel~="friend"][rel~="co-worker"] { background-color: red; }

Ceci vous permet de styliser les combinaisons de personnes de valeurs XFN, je pourrais par exemple styliser les amis en jaune, mais les amis avec qui je travaille aussi auraient un arrière-plan rouge. Ceci est possible pour n’importe quelle combinaison, friend vs. friend et colleagues, muse vs. muse et met ; en utilisant CSS il est facile de cible ces relations particulières.

XSLT

XSLT est conçu pour convertir XML vers un autre format - vous pouvez très facilement extraire la donnée provenant du HTML en utilisant XSL et XPath, tant que le HTML est bien formé. (S’il ne l’est pas, vous pouvez utiliser une application comme TIDY pour le nettoyer). Pour toutes les personnes qui sont plus à l’aise avec Javascript qu’avec XPath, la plupart de la connaissance DOM se transfère, vous aurez juste besoin de vous familiariser avec la nouvelle syntaxe. Laissez-moi vous présenter un exemple. Tout d’abord, j’ai besoin de trouver tous les a n’importe où dans le DOM Tree. Pour faire ça, je démarre avec le chemin //.

//a

Ceci trouvera n’importe quel élément a à n’importe quel niveau de profondeur (//) à partir du noeud racine, dans notre cas html. C’est très proche du document.getElementByTagName('a') en JavaScript. L’étape suivante est de raffiner notre sélection à tous les éléments a qui ont un attribut rel de friend.

//a[@rel='friend']

Les crochets ([]) fonctionnent presque de la même façon qu’avec nos crochets CSS. Le @ est utilisé pour dire que c’est un attribut, ainsi @rel est l’attribut rel et il doit être égal à friend. Le problème avec cette expression XPath est le même qu’avec la problématique CSS ; il trouvera les valeurs rel qui ne contiennent seulement que la chaîne friend ; Je veux trouver friend n’importe où dans une liste séparée par des espaces.

XPath nous donne un peu plus d’outils que CSS ; nous pouvons ajouter la fonction contains() pour trouver la chaîne friend à partir de la valeur d’attribut générale rel. contains() prend deux paramètres - la chaîne complète suivie par la sous-chaîne que vous recherchez.

//a[contains(@rel,'friend')]

Ceci trouvera n’importe quel élément a qui a un attribut rel qui contient la sous-chaîne friend. Le problème est que cela trouvera aussi la chaîne friendship parce que friend est contenu dedans. Pour résoudre cela, je peux garnir les deux côtés de l’attribut rel avec des espaces et chercher le terme aussi garni d’espaces. Cela paraît compliqué, mais ce ne l’est pas. Il y a deux fonctions supplémentaires à noter dans cet exemple - normalize-space() qui retire l’espace-blanc non voulu (équivalent à trim() dans d’autres langages de programmation) et concat(), qui fusionne simplement les chaînes ensemble. Dans cet exemple nous concaténons un espace blanc avant et après les attributs normalisés rel.

//a[contains(concat(' ', normalize-space(@rel), ' '),' friend ')]

En utilisant XPath, vous pouvez maintenant trouver les éléments qui correspondent à vos requêtes. Il est désormais possible d’extraire cette donnée et de la styliser, de la transformer et de la sauvegarder pour un accès ultérieur.

Expressions Régulières

Vous pouvez aussi utiliser des Expressions Régulières pour extraire la donnée. Ceci est plus compliqué, mais quelques personnes sont plus à l’aise avec les Regexes qu’avec XSLT. Je ne suis pas un expert des Expressions Régulières - il y a probablement un meilleur moyen, plus optimisé de produire ça - mais cela fonctionne pour moi !

/<a(.*|\W*)(rel\s*=\s*\"([^\"]*)\")(.*|\W*)>(.*|\W*)<\/a>/i

Ceci trouvera tous les éléments a et tentera d’extraire les valeurs rel à l’intérieur d’un array que vous pourrez ensuite parser pour regrouper n’importe quelles valeurs ; vous pouvez ensuite faire tout ce que vous voulez avec la donnée.

L’expression régulière est non-sensible-à-la-casse ; nous avons spécifié qu’avec le /i sur la fin. Cela commence par le groupement d’une chaîne de <a - c’est la façon dont chaque lien ancre est écrit. Puis, cela cherche (.*|\W*). Le point (. regroupe n’importe quel caractère et le \W regroupe n’importe quel mot. Nous cherchons pour l’un d’entre eux zéro ou plus de fois. Ceci engloutira tout autre texte comme href="..." ou d’autres attributs qui ne sont pas les valeurs rel que nous recherchons. Nous avons besoin de faire ça de nouveau après la valeur rel pour engloutir aussi tout autre texte derrière. Le href ou les autres attributs peuvent être dans n’importe quel ordre, aussi nous avons besoin de gérer ces scénarios. La partie vraiment importante est (rel\s*=\s*\"([^\"]*)\"). Ceci regroupe la chaîne rel suivie par zéro ou plus de caractères espace blanc, puis un = suivi par plus d’espaces blancs optionnels. Le \" est la valeur d’échappement pour un caractère à double guillemets. C’est le début de notre liste séparée par des espaces de valeurs rel. Le ([^\"]*) dit à mon expression régulière pour saisir zéro ou plus de caractères qui ne sont pas (^) un double guillemet.

Une fois que vous faites tourner cette expression régulière, toutes les données dans la parenthèse sont rassemblées dans des valeurs array. La valeur véritable de l’attribut rel serait dans un item array [3] parce que c’est le troisième ensemble de parenthèses dans cette chaîne. Ceci est vraiment compliqué pour quelque chose qui semble vraiment simple dans d’autres langages, mais selon votre situation, votre niveau de confort et de langage de programmation, les expressions régulières pourraient être pour vous le meilleur choix.

Si aucun de ces morceaux de code ne sont votre tasse de thé, il pourrait y en avoir un disponible dans votre langage favori. La page XFN sur le wiki a une liste croissante d’applications et de librairies déjà écrites, ainsi c’est un endroit excellent pour démarrer votre prochain projet XFN.

Que pouvons-nous faire avec ces données ?

Ainsi tout cela est bien, mais certains d’entre vous doivent être en train de penser “Quelles sont les choses intéressantes que je puisse produire avec cette donnée, maintenant que je l’ai extraite ?” Une fois que vous avez extrait toute cette donnée du HTML, il est très facile de la stocker dans une base de données ou un fichier texte pour la retrouver ultérieurement. Vous êtes basiquement en train de stocker trois pièces de données - deux URLs (une URL#1 qui a une relation XFN avec la seconde URL) et une de type relation (la valeur de l’attribut rel.) Une fois que vous avez votre base de données, vous pouvez vous poser des questions comme “Montre moi toutes les URLs qui ont une relation de ‘contact ou colleague’ avec ’suda.co.uk’”

Dans cette section, j’étudierai quelques cas et sites qui vous permettent de faire un peu de ça dès aujourd’hui.

Six Degrés de Séparation

Le fameux phénomène du Petit Monde de Stanley Milgram a démontré qu’il existe une moyenne de 6 étapes entre deux personnes. Ceci est produit à travers un réseau complexe d’envois de lettres, et puis plus tard à nouveau via e-mail. En utilisant XFN, il est possible de cartographier les distances entre deux personnes via leurs relations. Le site RubHub trace les relations XFN et liste ceux qui se lient à vous et comment, avec ceux qui vous lient et comment. Les résultats pour mon site personnel, suda.co.uk, peuvent être vus dans la Figure 1. Mon ami Harry Halpin de mes années d’Université est lié à moi et dans mon exemple au-dessus, je lie vers Chris Mills. Ainsi un spider automatisé pourrait commencer par construire un réseau de qui est connecté à qui et à travers qui. Nous pouvons épancher cela à travers les contacts d’Harry et de Chris, et nous pouvons demander qui connaît qui et dans combien de sauts, ou s’il existe d’autres connexions mutuelles entre les deux parties. Avant, sans XFN, vous ne pouviez que deviner si un lien définissait une relation ou si c’était juste un lien. Maintenant que nous avons “typé” les liens, il est possible d’extraire plus de sens à partir d’eux.

A ma connaissance, il n’existe pas d’outil qui puisse répondre à des questions comme “à quelle distance est Jeffrey Zeldman de Brian Suda”. Le service RubHub vous permet de cliquer à travers chaque site de personne et de suivre leurs liens à l’infini, tout comme vous pouvez le faire avec IMDB pour voir quels acteurs ont travaillé avec d’autres. Ce type de donnée est juste en train de demander de construire un joli front-end visuel, ainsi vous pouvez poser des questions comme “Trouve le chemin entre suda.co.uk et zeldman.com”. Désormais, si seulement Kevin Bacon avait un site web avec XFN…

les résultats Rubhub pour suda.co.uk

Figure 1 : suda.co.uk résultats RubHub XFN

Comme vous pouvez le voir, le spider Rubhub a trouvé 6 liens externes qui pointent vers suda.co.uk avec différents types de valeurs XFN. Rubhub participe aussi à la consolidation d’identité à travers l’usage de liens rel-me - il sait qu’il existe trois autres pages que j’ai déclarées comme étant à moi. Ceci veut dire que tout lien XFN vers n’importe lesquelles de ces trois pages devrait être compté comme un lien vers suda.co.uk.

Graphe XFN

XFN Graph est une application similaire à celle de Many Eyes d’IBM, que je mentionnais dans un article précédent. Vous ensemencez cette application avec une URL et une profondeur. Elle crawlera ensuite l’URL et les liens vers la profondeur spécifiée pour une recherche de données XFN. Ceci vous permet de construire un graphe connecté entre les personnes. A partir de là, vous pouvez facilement inspecter les noeuds et fils pour trouver un chemin entre n’importe quelle paire de personnes.

graphe XFN Twitter

Figure 2 : Graphe XFN des amis de Brian Suda à partir de Twitter.

L’exemple dans la Figure 2 ne va qu’à un niveau de profondeur de 1, mais il est possible de continuer à crawler chacun de ces noeuds et de trouver leurs amis. Avec un niveau de profondeur de 2, il devient possible de chercher les amis d’amis, avec un niveau de 3 vous obtenez les amis d’amis d’amis et ainsi de suite.

Combiner ces données avec de l’information supplémentaire permet des mashups intéressants, vous pourriez par exemple combiner votre dossier d’e-mails envoyés avec votre liste d’amis XFN pour grouper vos amis selon la fréquence à laquelle vous les e-mailez. Vous pourriez aussi utiliser le @nomutilisateur de twitter pour voir quelles sont les personnes qui parlent à qui le plus souvent.

Nuages de tags

Le backnetwork est une brique logicielle pour les conférences et autres rassemblements. Il vous permet de vous ajouter vous-même avec quelques informations personnelles, puis vous pouvez construire calmement vos relations avec les autres participants. Il dispose de beaucoup de fonctionnalités intéressantes, mais celle sur laquelle je me concentrerai est le nuage de tags des relations.

Au fur et à mesure que vous vous connectez à d’autres participants présents, vous les étiquetez avec des valeurs XFN dans le système. Le nuage de relations tague ces valeurs XFN et leur assigne des poids. Un ami est plus grand qu’une connaissance, qui à son tour est plus grande qu’un contact. Si la relation est réciproque, alors la taille est augmentée encore plus. Ceci nous ramène à l’exemple de moi-même et Chris. Je le considère comme un ami, mais ce pourrait être réciproque. Dans cette instance, la taille du nom ne serait pas aussi grande que s’il avait été là. En utilisant ce jumelage rigolo, nous pouvons aussi commencer à évaluer les poids des liens, pas simplement le type.

Le nuage de relation de Brian sur le backnetwork de dconstruct 07

Figure 3 : nuage de relations du backnetwork d.Construct

La Figure 3 montre mon Nuage de Tags de d.Construct 07 - vous pouvez facilement voir à qui je suis connecté et avec quelle force. Les visualisations de type nuage sont populaires pour les tags et les mots, mais elles peuvent être aussi utilisées pour les personnes et la force des connexions. Ceci vous pemet de voir en un coup d’oeil à qui vous êtes le plus connecté. La plupart du temps, les personnes ne sont pas intéressées à la MANIERE exacte dont vous pouvez connaître quelqu’un, mais plutôt à la façon dont la connexion est grande et solide. Si vous voulez être présenté à quelqu’un en particulier, alors vous pouvez voir qui de vos amis a la connexion la plus solide vers cette personne. C’est la route avec le plus de succès.

Construire votre propre spider XFN

Construire votre propre spider n’est probablement pas la chose à conseiller. Ecrire le code, voyager le web, indexer les sites à la recherche de liens … tant que vous y êtes, pourquoi ne pas écrire un moteur de rcherche complet ? Heureusement, vous avez quelques options. Pour ceux qui doivent simplement faire tourner leurs propres applications, vous pourriez louer la donnée et le temps serveur provenant d’Alexa et crawler la donnée pour vous-même, ou vous pourriez utiliser la nouvelle API Google Social Graph.
Ceci vous permet de saisir une ou plusieurs URLs ; elle cherchera alors dans sa propre base de donées Internet les liens et rétroliens à partir de ces URLs qui disposent de liens XFN ou FOAF. J’ai saisi suda.co.uk, mon site personnel et claimid.com/briansuda, un autre site que j’utilise pour OpenID. Les résultats de cette trouvaille sont étonnants - regardez la Figure 4.

Les URLs de Brian connectées dans l'API Google Social

Figure 4 : Photo écran de mes URLs connectées dans l’API Google Open Social

Le service trouve 25 URLs qu’il connaît comme étant aussi à moi, et 4 de plus pour lequel il pense que c’est à moi. Ce service vous permet de consolider votre identité à travers la totalité de l’internet. Il personnifie ce pourquoi l’internet a été conçu, des sites vaguement joints, sans le besoin d’un serveur central où vous saisissez toute votre information. Vous pouvez vivre votre vie aux bords de ce graphe sur des sites web faisant chacun des tâches pour lesquels ils ont été conçus. Puis les services peuvent ensuite rassembler toutes ces données pour produire un profil unique vous concernant.

Non seulement, cela ne fonctionne pas uniquement pour des données vous concernant, mais aussi pour des données sur la manière dont vous êtes en rapport avec vos amis. La fonctionnalité trouvée dans le lien au-dessus permet à n’importe quel nouveau site de réseau social de vous demander une URL quand vous le rejoignez. Il peut ensuite utiliser l’API Google pour recevoir une liste des URLs d’amis que vous avez déclarés ailleurs sur l’internet. Ce nouveau site de réseau social ne vous oblige plus à passer des heures à écrire du code pour accéder aux APIs de différents sites ou de les scraper pour des données ; vous pouvez maintenant demander un service unique qui ait précédemment indexé les sites et relations. Google renvoie les données, en suggérant les URLs potentielles qui correspondent aux membres existants de ce nouveau réseau social et en vous demandant de migrer vos relations avec juste un clic.

Résumé

Comme nous l’avons vu, XFN est un moyen rapide et simple d’exprimer quelques relations basiques entre vous-même et d’autres à travers l’utilisation de pratiques HTML existantes. En balisant explicitement les données, vous donnez plus de sens à votre balisage, qui peut être alors utilisé pour générer de nouvelles visualisations et aussi utilisé pour créer un réseau de connexions pouvant être facilement migré de place en place. Aussi qu’attendez-vous ?

Ressources

Mots-clés : , , , ,

Note : Traduction en cours d’un article de Brian Suda paru chez DevOpera le 21 février dernier. Seul le lien original fait référence. Vous pouvez aider à raffiner cette traduction publiée sous “fair use” en éditant la page-miroir posée sur mon wiki. Merci - xtof.

Microformats : Combler les Lacunes du HTML

Sunday, April 6th, 2008

Traduction en cours d’un article paru dans SitePoint - Seul le lien original fait référence

Microformats - Combler les Lacunes du HTML

Dans cette référence, les sujets portent sur les standards (ou pour utiliser les termes du W3C, les “recommandations”) qui s’appliquent aux éléments et attributs du HTML/XHTML. Si vous les avez tous lus (dans ce cas, vous méritez une étoile d’or), il pourrait vous arriver de temps à autre de vous dire, “bon c’est bien fichu, mais comment puis-je baliser une adresse, comme celle où j’habite ?”. Ou peut-être que vous vous êtes posé la question “Comment devrai-je baliser quelque chose comme la date d’un évènement ?”. Si vous avez réfléchi à cela, alors vous avez déjà fait progresser mon scénario d’application des microformats. Mais qu’est-ce que les microformats et pourquoi devriez-vous vous y intéresser ?

Dans les saveurs actuelles du HTML et du XHTML, il existe un bon nombre d’éléments qui, dans l’environnement actuel, apparaissent comme étant complètement hors de propos. Par exemple, quand vous vous retrouvez à utiliser les éléments xmp ou tt. Je ne l’ai jamais fait. Également s’agissant des éléments semblant superflus et ayant été forgés par quelques scientifiques pour qui leur utilisation était limité en pratique, il semble vraiment qu’il y ait quelques omissions dans les spécifications (et par specs, je veux dire bien sûr “recommandations” - néanmoins la plupart des personnes normales font référence à elles en tant que specs !). L’exemple de l’adresse que j’ai éludé au-dessus est l’une de ces omissions.

Maintenant, pour ceux qui prêtent encore attention - et pour ceux qui ont dévoré les contenus de cette référence du début à la fin - on peut tout de même progresser à ce stade : “Ah, mais il existe un élément pour les adresses. Il s’appelle ‘address‘.” Mais hélas, vous faites fausse route. Un rapide retour à la référence pour address révélera que cet élément n’est pas utilisé pour baliser un endroit physique, mais qu’il est en fait réservé pour identifier la personne à contacter concernant une page Web et que par conséquent, il peut inclure une adresse e-mail ou un numéro de téléphone ou quelque chose de cet acabit. Si l’élément address est utilisé pour baliser un endroit (numéro, rue, localité, etc), il est en fait mal utilisé. Mais alors que devriez-vous faire ?

Entrez dans les Microformats.

L’idée derrière les Microformats est de combler ces lacunes existantes dans les standards actuels, tout en utilisant - et ceci est assez difficile - uniquement du HTML/XHTML standard et valide. Comment cela peut-il être possible ? En ajoutant à ces éléments standards un ensemble défini de valeurs d’attribut qui sont basées sur un standard pré-existant. Ainsi, si vous voulez par exemple baliser les informations de contact de quelqu’un, vous pouvez utiliser hCard, le microformat conçu à cette effet, qui est fondé sur le format plus ancien et standardisé de la vcard (l’usage de hCard sera entièrement décrit d’ici peu). Les différentes parties des informations de contact - nom de famille, prénom, localité, rue, etc. - sont toutes identifiées par un attribut de classe qui peut être appliqué à n’importe quel élément HTML ; vous pouvez aussi faire usage de ces noms de classe pour modifier le style.

Ce n’est pas dévoiler un secret très bien conservé que d’avancer que le mécanisme du Consortium du World Wide Web Consortium (W3C) peut vraiment s’enrayer, ce qui est très frustrant pour des développeurs Web, programmeurs et designers du monde entier. Néanmoins, avec les microformats c’est une autre histoire. Bien entendu, les ’standards’ pour les Microformats sont également révisés et validés par les pairs, mais cela se produit bien plus rapidement. Dans l’intervalle de temps durant lequel CSS3 a été discuté et mis à disposition par le W3C, pour ne garder à cette heure qu’une recommandation dans les travaux, la totalité du concept des microformats était né, et plusieurs standards définis, avec bien plus de microformats en discussion et approchant de leur version finale.

Pour le dire vite, si un mécanisme pour marquer le HTML pour un objectif spécifique doit être accepté (et, on l’espère, utilisé) comme un microformat, il a besoin de satisfaire tous ces points :

  • Le Microformat doit résoudre un problème (et non pas créer quelque schéma fantaisiste pour baliser quelque chose qui existe déjà ou ne le garantit vraiment pas).
  • Il devrait démarrer aussi simplement que possible.
  • Il devrait être conçu d’abord pour les humains, ensuite pour les machines.
  • Il devrait réutiliser des standards existants et largement adoptés (par ex. IETF).
  • Pour finir, il devrait encourager des développements/services décentralisés (par exemple les services d’agrégation).

Pour vous donner une idée sur la manière dont les microformats peuvent offrir un avantage à l’utilisateur, prenons un exemple du vrai monde chez Google.

Google Maps et hCard

Quand Google a ajouté du contenu microformaté à ses résultats de recherche, ç’aurait été tout sauf invisible pour la plupart des utilisateurs réguliers que quelque chose de nouveau ait été ajouté. Cela a probablement pris très peu de temps à leurs développeurs d’ajouter les attributs de classe supplémentaires aux résultats de recherche, aussi cela n’aura pas été un effort inutile. Mais pour bon nombre de personnes - moi y compris - ajouter le microformat hCard a offert une excellente nouvelle fonctionnalité. Pour que cette fonctionnalité opère, cela requiert l’ajout d’une barre d’outils dans le navigateur qui peut alors détecter la présence de microformats sur une page. Personnellement j’ai essayé l’extension Tails (pour Firefox) et aussi l’extension Operator (aussi pour Firefox). En supposant que vous ayez ajouté ces barres d’outils, voici ce à quoi vous pouvez vous attendre au moment d’utiliser Google Maps pour chercher des restaurants locaux avec l’extension Operator :

  • Recherche Google Maps pour une Maison du Curry dans votre quartier
  • Les résultats apparaissent sur la carte avec des pointeurs que vous pouvez cliquer et aussi une liste en bas sur le côté gauche. (Normalement c’est là où votre interaction s’arrête et vous pouvez produire une note des détails du restaurant avant de téléphoner pour réserver une table.)
  • Operator vous notifie de la présence de Microformats en affichant l’une des icônes de la barre d’outils (qui était précédemment grisée)
  • Le fait de cliquer sur l’icône mise en valeur révèle la liste des Maisons du Curry trouvées, et vous pouvez ensuite exporter chacune d’elles individuellement - ou toutes en une fois - vers le carnet d’adresses de votre ordinateur.
  • Si votre téléphone mobile est couplé à votre ordinateur via Bluetooth – quelque chose que beaucoup de gens font pour synchroniser leurs contacts et agendas - vous pouvez alors mettre rapidement tous ces contacts sur votre téléphone mobile.

Il y a peu de temps, j’ai fait tout ce qui est décrit au-dessus à des fins de démonstration (une démonstration en ligne est disponible sur http://www.youtube.com/watch?v=Kjp4BaJOd0M), et il était possible de chercher les établissements et d’obtenir tous leurs numéros de téléphone et adresses sur mon téléphone en moins de 60 secondes. Je ne serai plus jamais à court de Maison du Curry si je devais me retrouver dans un cas de besoin urgent de Poulet Tikka Masal sans accès à un annuaire téléphonique ou à l’Internet, je peux d’ailleurs remercier les microformats d’avoir rendu cela possible.

Un autre outil qui vaut la peine d’être mentionné à ce stade est Optimus (http://microformatique.com/optimus/) qui n’est pas une extension navigateur mais un service basé sur le Web. Il fournit un mécanisme pour transformer le contenu sur une page qui a été balisé sous un Microformat vers un autre format, actuellement XML ou JSON. Ce serait un job supplémentaire d’ajouter un lien vers votre site Web dans une section qui est utilisé sur tout le site (par exemple un fichier inclus dans l’en-tête ou le pied de page) et de ce fait fournir des formats alternatifs pour tous vos contenus microformatés. Comme le dit la ligne savoureuse du site Web : “Maintenant votre site Web pourrait vraiment être votre API avec la beauté des microformats et la puissance d’Optimus.”

Microformats – Constamment en évolution

Du fait de la nature d’émergence rapide des Microformats (rapidité relative comparée au W3C, au moins !), il n’est pas possible de décrire tous les microformats disponibles. Le temps que ceci s’imprime, la liste aura probablement évoluée. Néanmoins cela vaut la peine de jeter un oeil sur quelques microformats spécifiques et sans surprise il s’avère que ce sont ceux qui existent depuis le plus longtemps du fait qu’ils aient été les premiers à être définis et qu’ils ont été les plus utiles pour l’implémentation. Pour une liste complète des microformats, allez sur le http://microformats.org/wiki. Si vous souhaitez vous impliquer dans la discussion et aider à former de nouveaux microformats, vous pouvez rejoindre la liste de discussion sur http://microformateurs.org/discussion/.

Les Microformats décrits par cette référence sont :

Pour démarrer, nous jetterons un oeil à la hCard – l’un des meilleurs exemples de Microformats paru du fait de son potentiel d’usages.

Dans cette partie :

  • hCalendar
    fournit un mécanisme pour baliser les évènements (date, heure, lieu, etc.)
  • hCard
    fournit un mécanisme pour baliser les informations de contact
  • hreview
    standardise une méthode pour les revues critiques de produit, service
  • XFN
    identifie la relation sociale des liens entre les pages Web
  • rel- Microformats
    fournit une relation supplémentaire concernant la destination du lien

Microformat hAudio…

Tuesday, January 22nd, 2008

…ou comment donner du sens à vos playlists-HTML-audio partagées sur le Web ?

Appréciant depuis toujours divers styles de musique, j‘aimerais un jour m’essayer à donner du sens à quelques futures playlists audio qui berceront mes nuits durant les futures traductions à l’écran.

Depuis que Tantek a présenté une superbe démo de hAudio à l’OpenMedia Web, je piaffais d’envie de m’essayer à partager une première playlist vivante.

Aussi, en ce dimanche matin, je me jette pour tenter de comprendre et appliquer quelques instructions fraîchement traduites sur le wiki des microformats afin d’amorcer ce qui pourrait être une première liste haudio mise à jour au fil de l’eau.

Avertissement : Ce document est destiné au seul usage de recherche pédagogique et de démonstration. Sa publication s’inscrit naturellement sous Fair-Use pour inviter les auteurs et labels à publier des contenus mieux structurés. Tous les contenus audio proposés demeurent sous Copyright ECM Records GmbH.

En hAudio, ceci donnerait pour un futur exemple dans la jungle sorti droit de la discothèque :

keith jarrett - live at montreux

My Foolish Heart - Live at Montreux

  • Un album interprété par Keith Jarrett, Gary Peacock et Jack Dejohnette
  • Enregistré le 22 juillet 2001 à l’Auditorium Stravinsky (Montreux-Suisse), le disque est sorti le 8 octobre 2007 sous le label ECM.
  • Echantillon, Achat chez Amazon
  • Catégorie :
  • Durée totale : 50 minutes et 33 secondes
  • Prix : €20.00
  • Pistes sur le CD-1 :
    • 1. Four (9:09) - Compositeur Miles Davis.
    • 2. My Foolish Heart (12:25)
    • 3. Oleo (6:37) - Compositeur Sonny Rollins.
    • 4. What’s new (7:54) - Johny Burke - Robert Haggard
    • 5. The Song is You (7:43) - Oscar Hammerstein II - Jerome Kern
    • 6. What’s new (6:40) - Andy Razaf - Harry Brooks - Thomas Fats Waller

Pour aller plus loin :

Thomas Yadan écrivait :

L’un des plus grands pianistes de jazz au prestigieux festival de Montreux, l’affiche est belle. Et le résultat exaltant. Alors on se réjouit de la sortie de ce double album ‘My Foolish Heart’ enregistré à l’auditorium Stravinsky le 22 juillet 2001. Comme à son habitude, le pianiste ne lésine pas sur la durée du concert car le temps réel est un concept, qui bien heureusement pour le spectateur, lui échappe complètement. Si le trio, formé depuis 1983 avec Gary Peacock à la contrebasse et Jack Dejohnette (mention spéciale) à la batterie, excelle dans le be-bop, utilisant l’ancien au profit du moderne, il change d’optique aujourd’hui, avec cet album. Le pianiste, comme à son habitude, aime surprendre. Revisitant des standards récents de Miles, Monk ou Rollins, le concert se transforme en hommage explicite au ragtime et au piano stride.

Ainsi, on pourra deviner l’âme enjouée de Fats Waller et l’originalité de Scott Joplin, sans oublier évidement la touche si spécifique de Keith Jarrett. Si ‘Ain’t Misbehavin’ ou le légendaire ‘Honeysuckle Rose’ sont des productions authentiques de piano stride, les morceaux ‘Straight, no chaser’ ou ‘Oléo’ sont décisifs par leur générosité, offrant au pianiste des possibilités de variations insoupçonnables. On pourra tout de même sentir un effluve plus classique avec ‘Fives Brothers’. Quand à l’investissement des musiciens, elle demeure incontestable au regard de l’entente quasi-fusionnelle du trio. Un disque incontournable qui démontre encore une fois le talent et les ressources infinies de Keith Jarrett et de ses acolytes.

Code :

Le code ci-dessous comprend des sauts de ligne et quelques troncages pour des besoins de lisibilité. Vous pouvez y accéder aussi directement sur la page hAudio éditable posée sur mon wiki-personnel.


<div class="haudio" id="haudio-myfoolishheart">

<img class="photo" style="float:right;padding:0.5em;"
src="http://image.org/exemple-pochette.jpg"
alt="keith jarrett - live at montreux" />

<h2 class="album">My Foolish Heart - Live at Montreux</h2>
<ul>
<li>Un album interprété par 
<span class="contributor">
 <span class="vcard">
 <span class="fn org">
 <a class="url"
href="http://fr.wikipedia.org/wiki/Keith_Jarrett_%28musicien%29">
Keith Jarrett</a>, 
Gary Peacock et Jack Dejohnette</span>
</span>
</span>
</li>

<li>
Enregistré le
<abbr title="2001-07-22">22 juillet 2001</abbr> à l'
<span class="vcard">
<span class="fn org">Auditorium Stravinsky</span>
(<span class="locality">Montreux</span> -
<span class="country-name">Suisse</span>)
</span>,
le disque est sorti le
<abbr class="published" title="2007-10-08">
8 octobre 2007</abbr>
sous le label
<span class="vcard">
<a class="fn url org"
href="http://www.ecmrecords.com">ECM</a>
</span>.
</li>

<li>
<a rel="enclosure"
href="http://www.elanceur.org/Musique/KeithJarrett/Four.mp3">
Echantillon</a>,
<a rel="payment" href="http://tinyurl.com/3599wp">
Achat chez Amazon</a>
</li>

<li>
Catégorie :
<a class="category" rel="tag"
href=
"http://fr.wikipedia.org/wiki/Portail:Jazz">
Jazz</a>
</li>

<li>
Durée totale :
<abbr class="duration" title="PT50M33S">50 minutes
et 33 secondes</abbr>
</li>

<li>
Prix : <span class="price">
<abbr class="currency"
title="Euros 20.00">€20.00</abbr>
</span>
</li>

<li>Pistes sur le CD-1 :
<ul>
<li class="item">
<span class="position">1</span>.
<a rel="enclosure"
href=
"http://www.elanceur.org/Musique/KeithJarrett/Four.mp3"
class="title">Four</a>
(<abbr class="duration"
title="PT9M09S">9:09</abbr>)
- Compositeur <span class="contributor">
Miles Davis</span>.
</li>

<li class="item">
<span class="position">2</span>.
<a rel="enclosure" class="title" href=
"http://www.elanceur.org/Musique/KeithJarrett/MyFoolishHeart.mp3"
>My Foolish Heart</a>
(<abbr class="duration" title="PT12M25S">12:25</abbr>)
</li>

<li class="item">
<span class="position">3</span>.
<a rel="enclosure" class="title" href=
"http://www.elanceur.org/Musique/KeithJarrett/Oleo.mp3"
>Oleo</a>
(<abbr class="duration" title="PT6M37S">6:37</abbr>)
- Compositeur
<span class="contributor">Sonny Rollins</span>.
</li>

<li class="item">
<span class="position">4</span>.
<span class="title">What's new</span>
(<abbr class="duration" title="PT7M54S">7:54</abbr>)
- <span class="contributor">Johny Burke</span>
- <span class="contributor">Robert Haggard</span>
</li>

<li class="item">
<span class="position">5</span>.
<span class="title">The Song is You</span>
(<abbr class="duration" title="PT7M43S">7:43</abbr>)
- <span class="contributor">Oscar Hammerstein II</span>
- <span class="contributor">Jerome Kern</span>
</li>

<li class="item">
<span class="position">6</span>.
<span class="title">What's new</span>
(<abbr class="duration" title="PT6M40S">6:40</abbr>)
- <span class="contributor">Andy Razaf</span>
- <span class="contributor">Harry Brooks</span>
- <span class="contributor">Thomas Fats Waller</span>
</li>
</ul>
</li>
</ul>

<h2>Pour aller plus loin :</h2>
<p><cite class="vcard"><span class="fn">
Thomas Yadan</span></cite>
<a href="http://www.evene.fr/culture/agenda/keith-jarrett-13800.php?critiques">
écrivait</a> :</p>
<blockquote class="description">
<p>
L’un des plus grands pianistes de jazz au prestigieux festival de Montreux, l’affiche
est belle. Et le résultat exaltant.  Alors on se réjouit de la sortie de ce double album
‘My Foolish Heart’ enregistré à l’auditorium Stravinsky le 22 juillet 2001.
Comme à son habitude, le pianiste ne lésine pas sur la durée du concert
car le temps réel est un concept, qui bien heureusement pour le spectateur,
lui échappe complètement. Si le trio, formé depuis 1983 avec Gary Peacock
à la contrebasse et Jack Dejohnette (mention spéciale) à la batterie,
excelle dans le be-bop, utilisant l’ancien au profit du moderne,
il change d'optique aujourd’hui, avec cet album. Le pianiste, comme à son habitude,
aime surprendre. Revisitant des standards récents de Miles, Monk ou Rollins,
le concert se transforme en hommage explicite au ragtime et au piano stride.
</p>

<p>
Ainsi, on pourra deviner l’âme enjouée de Fats Waller et l’originalité de Scott Joplin,
sans oublier évidement la touche si spécifique de Keith Jarrett. Si ‘Ain’t Misbehavin’ ou
le légendaire ‘Honeysuckle Rose’ sont des productions authentiques de piano stride,
les morceaux ‘Straight, no chaser’ ou ‘<a href="http://www.elanceur.org/Musique/KeithJarrett/Oleo.mp3">Oléo</a>’
sont décisifs par leur générosité, offrant au pianiste des possibilités de variations
insoupçonnables. On pourra tout de même sentir un effluve plus classique avec
‘Fives Brothers’. Quand à l’investissement des musiciens,
elle demeure incontestable au regard de l’entente quasi-fusionnelle du trio.
Un disque incontournable qui démontre encore une fois le talent et les ressources
infinies de Keith Jarrett et de ses acolytes.
</p>

</blockquote>

</div>
</div>

Tantek Çelik : “Construire du contenu textuel ouvert sur le HTML”

Sunday, January 6th, 2008

Le Web est de loin le médium le plus victorieux dans l’histoire pour la publication et le partage de contenu ouvert. Concentrer les efforts pour promouvoir et permettre le contenu ouvert sur le Web d’abord et avant tout (plutôt que disons, des entrepôts de données propriétaires et des bases de données institutionnelles) a l’effet le plus fort pour habiliter le contenu ouvert en général.

Le contenu textuel sur le Web est dominé par le HTML (y compris le XHTML bien sûr) du fait de sa diffusion large et sa facilité de publication. Plus nous sommes capables d’utiliser le HTML comme un transporteur commun de morceaux d’informations de plus haute fidélité, plus nous hissons et enrichissons la publication et le partage de contenu textuel.

De ce fait, les microformats sont développés en ligne avec les pratiques et principes du “bon vieux pur HTML sémantique” (), ce qui veut dire, comme des extensions sémantiques valides vers le HTML. Le HTML sémantique en lui-même permet le partage de contenu ouvert avec des titres, des paragraphes et listes, etc. Les microformats se construisent sur cette fondation, plutôt qu’en réinventant (par ex. réutilise le HTML pour les listes et les listes imbriquées pour les structures, plutôt que d’inventer de nouvelles balises ou vocabulaire) et ne s’étendent seulement que pour de la sémantique communément publiée sur le HTML, comme celle de , des , des , du , etc.

Ces extensions peuvent être utilisées pour publier des documents contenant juste un type d’information pour une consommation par des applications spécifiques-par-domaine (par exemple une liste de contacts pour les carnets d’adresses, ou une liste d’évènements pour les outils de gestion d’agenda), ou beaucoup de types inter-mixés et imbriqués, embarqués dans un plus grand document qui les relie tous ensemble dans un contexte ayant du sens comme dans le cas d’un curriculum-vitae, signifiant que cet ensemble serait perdu si chaque type de donnée avait été isolé, retiré de son contexte et publié dans son propre silo de format pour un objectif spécifique.

Que ce soit de simples assemblages ou des documents composés, en construisant sur le HTML, tous ces usages fonctionnent bien non seulement pour eux-mêmes, mais embarqués et mélangés avec du contenu web existant, d’une façon qui soit bien comprise par les auteurs web, tout comme par les navigateurs et moteurs de recherche. Ceci contraste profondément avec les . Pour finir, c’est cette étendue très large, pour le contenu existant, les auteurs, les applications, les services de recherche et une variété de terminaux, qui rend le contenu textuel construit sur le HTML même plus ouvert vu d’une perspective pratique.

Traduction en cours. Source microformats.org - Seul le lien original fait référence. Vous pouvez aider à raffiner le contenu en éditant le code posé sur la page-miroir de mon wiki de travail. Merci.- xtof

Brian Suda : “Réseaux Sociaux Portables, Emmenez Vos Amis Avec Vous”

Sunday, December 2nd, 2007

Remarque : Ceci est une traduction à raffiner d’un article de Brian Suda paru sur SitePoint s’inscrivant dans l’effort de la portabilité du réseau social, un domaine à la croisée des chemins entre les microformats et OpenID. Considérez ce premier jet comme un brouillon à raffiner en éditant directement le contenu html posé sur un wiki-personnel.

L’idée serait de transcrire cet article sous forme de dias pour une présentation à prévoir au prochain BarCamp à Paris ? Tous les amateurs, microformateurs et fans d’OpenID sont naturellement les bienvenus pour venir aider à co-construire l’atelier. Passez-moi un coup de fil ou glissez-moi un mél si le sujet vous intéresse ? Christophe

Chariot Microformats : illustration de Matthew Magain pour SitePoint Brian Suda dans SitePoint : Portable Social Networks: Take Your Friends with You.

Réseaux Sociaux Portables : Emmenez Vos Amis Avec Vous

par Brian Suda

Publié initialement le 21 novembre 2007

Saviez-vous que 98.6% de la population mondiale est sur Facebook ? Ce n’est pas vrai bien sûr, mais les journalistes vous le feraient bien croire ! Il y a deux ans, ils disaient la même chose à propos de la croissance de MySpace. Mais en deux ans, une fois fatigué de Facebook et lorsque vos amis vous presseront de rejoindre encore un autre site, voudrez-vous vraiment démarrer à partir de zéro pour former une fois de plus toutes ces relations ? L’information est déjà là, pourquoi ne pouvez-vous pas la transférer d’un site à un autre ?

Bon, vous pouvez le faire ! C’est là où les réseaux sociaux portables entrent dans la danse.

Qu’est ce qu’un Réseau Social ?

Avant que nous ne puissions produire un réseau social portable, nous avons besoin de savoir ce qu’est un réseau social. Wikipedia décrit un réseau social comme :

[…] une structure sociale faite de noeuds (qui sont généralement des individus ou des organisations) qui sont liés par un ou plusieurs types spécifiques d’interdépendance, comme des valeurs, visions, idées, échanges financiers, amis, filiations familiales, aversion, [et ainsi de suite jusqu’à l’infini].

Ceci est une définition vraiment générale. Beaucoup de gens connaissent la fameuse expérience du petit monde de Stanley Milgram — plus connue sous le nom des “six degrés de séparation” — où Milgram a émis l’hypothèse (et l’a confirmée plus tard par l’expérimentation) que vous êtes lié par pas plus de 5 personnes à n’importe quelle autre personne sur la planète. Ces connexions entre les personnes sont ce qui définissent les réseaux sociaux — votre lien aux autres personnes est défini par votre capacité à retrouver l’information à partir de la meilleure source possible à travers ces connexions.

En préparant cet article, j’ai compté rapidement le nombre de sites de réseaux sociaux que j’utilise fréquemment. Il y en avait au moins vingt — et ce sans même compter les sites les plus populaires comme Facebook et MySpace. Ayant un penchant pour l’informatique et la technique, je ne pense pas être un bon indicateur des habitudes de réseautage social d’un utilisateur ordinaire, mais on peut dire sans se tromper qu’au cours d’une vie, un utilisateur ordinaire du web rejoindra beaucoup de sites différents. Et au fur et à mesure des modes et engouement, il voudra migrer d’un site à un autre : il ira là où ses amis iront et il discutera là où ses amis discuteront.

Si vous avez déjà décidé de rejoindre un nouveau réseau, vous savez combien il peut être frustrant de démarrer une fois de plus tout ce processus. Vous avez une fois de plus besoin d’inscrire les mêmes amis et de recontacter les mêmes connaissances. Faites le plusieurs fois de suite et vous vous retrouverez vous-même confronté à un mauvais cas de fatigue de réseau social.

En plus de cela, vous devrez convaincre vos amis de rejoindre le nouveau service ; l’effort exigé pour faire face à cette inertie est généralement de trop. Migrer les données, convaincre vos amis, bricoler vos préférences … Tout cela n’est que harassement, aussi les personnes ne le feront pas. Compte tenu d’un choix entre l’effort supplémentaire et le statu-quo, ils s’accrocheront au statu-quo.

Mouvement Libre de Données

Le mouvement libre de données est ce qui peut rendre un réseau social portable. La capacité de rentrer et sortir facilement vos données d’une application est clé, tant du point de vue du fournisseur que du consommateur.

La capacité de migrer facilement vos données a deux implications géniales. Tout d’abord, vous rejoindrez plus probablement un service qui respecte votre temps et vos données. Deuxièmement, cela incite les fournisseurs de services à rester honnêtes.

L’une des raisons pour lesquelles j’ai rejoint et j’apprécie désormais Flickr est le fait qu’à tout moment je peux récupérer les données que je possède sur le service et m’en aller. Ceci ne concerne pas seulement mes photos : cela comprend les données en rapport avec mes amis, et toutes les autres méta-données qui enrichissent mon réseau. Si Flickr tourne mal ou prend de mauvaises décisions, les utilisateurs peuvent aller ailleurs. L’équipe de Flickr sait cela, et s’assure que la société veille aux meilleurs intérêts de ses utilisateurs — autrement, Flickr n’aurait plus beaucoup de clients !

L’inverse de pouvoir posséder vos données est le verrou du fournisseur. Quelques fournisseurs de services ont mis en place un verrou qui est l’anti-thèse du réseau social portable : ils vous empêchent d’avoir un mouvement libre de vos données. Ils essayent de vous conserver comme client par la force à travers l’utilisation de formats propriétaires, de longs contrats, ou par un manque de fonctionnalité d’exportation. On vous empêche de prendre vos données avec vous dans l’espoir que les enquiquinements de migration de vos données seront supérieure aux enquiquinements offerts par leurs produits, par conséquent vous restez.

Mais le verrouillage effectué par le fournisseur avec la mise en place de formats propriétaires n’est pas la clé pour garantir un succès financier — contrairement à ce que pensent beaucoup de ces fournisseurs. Comme nous déposons en ligne de plus en plus de nos vies, de nos connexions et de nos données, la longévité et la propriété sont devenues les clés du succès des applications de réseau social. En tant que propriétaires de nos données, nous devrions exiger la capacité de les migrer de lieu en lieu comme nous le sentons. Faire partie de réseaux sociaux portables signifie que vous pouvez prendre vos données à tous les endroits que vous voulez. Vous avez passé beaucoup de temps et d’effort à assembler, réunir, annoter et organiser ces données — n’oubliez pas que ce sont les vôtres.

Vous Rendre la Vie Plus Facile

Le meilleur moyen d’acquérir de nouveaux clients est de faire qu’il soit très facile pour eux de s’inscrire. Une barrière basse à l’entrée rend l’enregistrement plus facile, ce qui veut dire que plus de personnes essaieront le service. Il doit y avoir aussi peu de difficultés, d’exigences et de questions que possible dans votre processus d’enregistrement. Avec chaque bouton à cocher, champ de formulaire et bouton que vous présentez à votre client, vous perdez du business potentiel. Il existe des technologies anciennes et nouvelles qui essayent de résoudre la problématique de baisser la barrière, certaines d’entre elles étant avérées plus payantes que d’autres.

Un Identifiant Unique

Un exemple récent d’enregistrement simple est OpenID. Dit simplement, OpenID est un système distribué pour les mots de passe. Cela vous permet de maintenir un nom d’utilisateur et un mot de passe uniques que vous pouvez utiliser pour vous connecter sur n’importe quel site qui comprend OpenID. Il n’y a pas de coût de licence, pas de coût d’installation et quiconque peut accepter les identifiants OpenID.

Quand je visite Dopplr, je peux utiliser OpenID pour m’identifier. Backpack a aussi une option pour une identification OpenID, comme le fait Magnolia, ainsi je peux utiliser quelques détails d’identifiant OpenID pour tous ces trois sites. OpenID excelle parce que je n’ai maintenant qu’à gérer qu’un seul nom d’utilisateur et un seul mot de passe pour tous les comptes sur plusieurs sites.

Pourquoi un site de réseau social voudrait permettre aux utilisateurs de s’identifier avec OpenID ? Parce que c’est la première étape pour commencer à baisser la barrière à l’inscription. Quand vous créez un nouveau compte de réseau social en utilisant votre OpenID, vous vous connectez dans le site de réseau social pour la première fois et OpenID vous renvoie en retour quelques morceaux de données : votre URL, votre nom (en option) et votre adresse email. Ces petits morceaux de données sont utilisés pour créer automatiquement un compte pour vous sur le site de réseau social. De ce fait, le temps passé à saisir de nouveau les données répétitives vous concernant est minimisé.

Si je voulais l’adoption la plus large possible pour mon application web ou mon site de réseau social, la première étape serait de faire en sorte qu’il soit plus facile et plus confortable pour les gens de s’inscrire et de créer des comptes. OpenID a aussi quelques fonctionnalités vraiment intéressantes, comme la liste-blanche. Un réseau social pourrait publiquement lister les URLs OpenID des personnes dans un groupe. D’autres réseaux sociaux pourraient utiliser cette liste d’URLs OpenID pour “pré-autoriser” des comptes, accélérant encore plus le processus d’inscription.

Les personnes utilisent cette fonctionnalité de pré-autorisation pour les commentaires des blogs. Souvent, quand je laisse un commentaire sur un blog sans avoir un compte, ce commentaire aura besoin d’être autorisé avant qu’il ne soit publié sur le blog. Si au lieu de cela, je déposais le commentaire et utilisais mon URL OpenID pour m’identitier, ce site pourrait m’avoir référencé dans une liste pré-autorisée d’URLs de confiance, et laisser mes commentaires être publiés. En effet, grâce à la liste blanche, je fais partie des sources pouvant automatiquement publier sans que soit nécessaire une autorisation à chaque publication. Il existe beaucoup d’autres utilisations pour les fonctionnalités OpenID sur votre site ; l’article court de Simon Willison titré “Six cool things you can build with OpenID” en explique quelques autres.

OpenID est aussi génial pour moi en tant que client. Si je veux modifier mon mot de passe pour l’ensemble de ma vingtaine de sites de réseaux sociaux, je change simplement mon mot de passe une seule fois chez mon fournisseur OpenID et il est renvoyé sur tous ces sites. Ceci parce qu’ils ne stockent pas mon mot de passe, juste mon URL OpenID. Cela me permet aussi de créer rapidement des comptes pour voir si ce nouveau service est quelque chose de valable.
Comme moi, vous avez probablement raté par le passé des tonnes d’opportunités de vous inscrire à des trucs cools parce que vous ne vouliez pas vous retrouver à saisir une fois de plus toutes vos coordonnées !

Je recommande que vous regardiez et que vous enregistriez aujourd’hui pour un compte OpenID. OpenID est génial pour faire rouler la balle, mais la prochaine étape pour baisser la barrière sur le réseautage social portable est d’y emmener aussi vos amis !

Partager Vos Connexions

Au moment de passer d’un site de réseau social au suivant, c’est une vraie corvée que d’inviter à nouveau tous vos amis et connexions, non ? Bon c’est en fait vraiment simple — tout cela descend dans le monde ensorcelant des attributs HTML, des microformats et de quelque chose appelé XFN. En utilisant les technologies suivantes, il est possible de créer de la donnée ouverte qui aide à la portabilité avec rien de neuf ou de plus complexe que le HTML basique que nous avons aujourd’hui.

XFN

XFN veut dire XHTML Friends Network. C’est une liste de valeurs rel qui définit les relations entre deux personnes via des URLs. Ces connexions s’étalonnent en partant d’un “contact” simple jusqu’à des relations plus complexes telles que “spouse”. Les valeurs rel peuvent aussi être séparées par des espaces, ainsi nous aurons des valeurs comme rel="contact met friend neighbor" pour définir des relations plus complexes. Ces valeurs sont les briques de base pour former l’ossature des réseaux sociaux portables.

Si nous définissions les relations en HTML, au dehors dans l’espace ouvert, d’autres services pourraient extraire l’information et la sémantique de façon à ce que cela puisse être utilisé dans tout autre réseau. La donnée ouverte est une rue à deux sens — le même fichier HTML marqué avec XF>N qui est utilisé pour afficher et exporter peut aussi s’utiliser pour importation à l’intérieur d’un autre service.
Exemple de blogroll :

<a href="http://exemple.org/blog/jean" rel="friend met">Jean Morris</a>
<a href=”http://blog.thierryj.com/” rel=”friend met colleague”>Thierry Jambon</a>

Vous pouvez accéder au constructeur de relations XFN sur http://gmpg.org/xfn/creator-fr.

Valeurs HTML rel

Aux côtés des valeurs XFN qui ont été créées, la spécification HTML définit plusieurs attributs natifs rel, une liste complète est disponible ici. Cette liste contient des valeurs comme Help, Glossary, Index et Start. Les valeurs intéressantes, au moment de traiter avec l’assemblage de données ouvertes, sont Next et Prev. Si un spider arrive sur une URL sur laquelle se situe de la donnée XFN, et rencontre un lien qui contien rel="next", le spider sait qu’il existe une autre page qui pourrait contenir de la donnée XFN. Le scénario inverse fonctionne tout aussi bien : si le spider atterrit sur la page 3, un lien rel="prev" dit au spider de revenir en arrière vers une page pour plus de données XFN. Ces valeurs rel sont très utiles pour les objectifs de pagination.

Twitter.com utilise la valeur rel="next"dans votre liste d’amis. Chacun de vos liens amis est marqué avec le microformat XFN décrivant la relation entre vous et cet ami-là. Si vous avez plusieurs listes d’amis, les attributs rel="next" et rel="prev" permettent aux spiders de savoir que ces pages sont toutes connectées les unes aux autres, et que toutes les données assemblées peuvent être regroupées ensemble.

Consolidation d’Identité

La valeur rel="me", un ajout récent à XFN, est une valeur puissante qui vous permet d’exécuter la consolidation d’identité. Cette tâche comprend quelques étapes simples :

  • Prenez votre blog comme point de départ, et faites des liens vers vos pages sur tous les sites de réseaux sociaux sur lesquels vous êtes inscrit. Maintenant, ajoutez simplement la valeur rel="me" à ces liens.
  • Allez sur votre page profil, et ajoutez un lien arrière vers votre blog avec la même valeur rel="me" dans le lien.

Fait ! Vous avez maintenant déclaré ces sites comme étant à “vous”, ce qui est utile quand vous vous construisez pour vous-même une identité unique à travers plusieurs sites sur l’internet. Le GMPG (Global Multimedia Protocols Group) offre plus d’information à propos de rel="me" et de la consolidation d’identité. Et l’outil de Recherche Plaxo Pulse sur le Graphe Ouvert peut aider à l’effort de consolidation. Saisissez une URL de départ, et il crawlera les liens rel=”me” et commencera à consolider l’information vous concernant.

hCard

Dans mon précédent article, j’évoquais ce qu’est une hCard, et comment vous pouvez en créer une. En bref, hCard est un moyen de représenter les personnes, sociétés, organisations et endroits en (X)HTML structuré.

Donnée Ouverte

Des outils comme le plugin Firefox Operator peuvent extraire la hCard et les données XFN et les combiner avec d’autres sites de façon bien utile.

Au moment d’importer des données à l’intérieur d’un nouveau réseau social, les formats comme XFN et hCard vous permettent de décrire tant la personne, que ses relations à vous. XFN est utilisé pour trouver des liens vers les personnes que vous considérez comme amis. hCard est utilisé pour extraire de l’information structurée à propos de ces amis, y compris des choses comme des URLs, des adresses email, des organisations et numéros de téléphone, toutes ces données pouvant être migrées à l’intérieur d’autres services à travers l’utilisation de données ouvertes.

Sites qui Permettent l’Importation de Données

Comme exemple pour aider les utilisateurs à éviter la tâche pénible de saisir à nouveau et encore et encore leurs informations, un site appelé GetSatisfaction.com leur permet de créer un profil-utilisateur basé sur l’URL d’une hCard. Au lieu de remplir les champs communs de formulaires fastidieux, les utilisateurs saisissent simplement leurs URLs hCard. GetSatisfaction ira alors chercher le HTML, le parsera pour la donnée hCard et remplira les champs correspondants.
Plusieurs sites ont déjà de l’information de contact marquée sous des hCards. Si vous disposez d’un compte Flickr, par exemple, votre page profil est encodée en hCard. Ainsi vous pourriez entrer l’URL de votre profil Flickr, ou peut-être une page de votre blog.

Idéalement, GetSatisfaction se souviendrait de cette URL, et si vous étiez amené à changer la donnée sur votre page de profil Flickr, GetSatisfaction mettrait cette information à jour. Tout comme le modèle de publication/abonnement de RSS, GetSatisfaction et les autres pourraient s’abonner à vos données de profil de contact encodées dans la hCard. Alors vous n’avez plus qu’un point unique de données qui a besoin d’être mis à jour, et tous les changements sont reflétés globablement.

Les nouveaux outils de microformats et de réseaux sociaux apparentés sont en train d’émerger. Dopplr, par exemple, offre aux utilisateurs la capacité de chercher des amis qui pourraient aussi utiliser le service. Ce simple outil vous aide à voir si quelqu’un que vous connaissez est membre du service ; alors vous pouvez vous connecter avec lui. L’inconvénient du service est que j’ai besoin de rentrer manuellement le nom de mes amis pour les chercher. Mon carnet d’adresses n’est pas immense, mais une fois de plus, c’est bien trop de travail que de chercher mes contacts un par un. Les microformats viennent à la rescousse ! Dopplr vous donne la possibilité de saisir une URL d’une page qui est encodée XFN. Dopplr parsera cette page là à la recherche de tous les liens XFN, cherchera automatiquement dans sa base de données les correspondances, et vous dira combien d’amis font partie de Dopplr. Dopplr ne fait que simplement réduire ma charche de travail : au lieu de me laisser tout seul chercher parmi des centaines de noms, un par un, Dopplr effectue à ma place une recherche sur une URL unique.

Je ne suis pas complètement déchargé de toute charge de travail cependant — j’ai encore beaucoup de travail à faire. J’ai besoin de maintenir une page HTML en ligne, qui ait toutes les URLs de mes amis marquées en XFN. Ceci semble beaucoup de travail juste pour démarrer, pour effectuer tout seul la maintenance,… Mais grâce à la portabilité, nous pouvons utiliser les données ouvertes des autres réseaux sociaux comme notre liste d’ensemencement d’amis. Mon compte Twitter par exemple, a une liste d’amis qui est marquée avec le microformat XFN. Dans Dopplr, je peux pointer vers cette URL d’Amis Twitter comme étant la liste d’amis que je veux importer. En fait, j’utilise un réseau social pour commencer à sauter dans un autre. A nouveau, il y a aussi la possibilité pour Dopplr de “s’abonner” à ma liste d’amis Twitter XFN. Ainsi à chaque fois que je mets à jour/ajoute un nouvel ami sur Twitter, Dopplr le trouvera et vérifiera si ces nouveaux amis sont aussi membres de ses services. Ceci veut dire que j’ai besoin de maintenir à jour moins d’endroits, parce que tous les services se nourrissent les uns des autres.

Anti-patterns

Tout ce qui semble aider les consommateurs à facilement démarrer leurs réseaux sociaux ou importer leurs données n’est pas une bonne idée. Plusieurs anti-modèles ont émergé, et vous devriez les éviter à chaque fois que c’est possible.

Quelques sites vous demandent de copier votre carnet d’adresses afin qu’ils puissent “vous aider à trouver des amis”. Ce qu’ils vous demandent véritablement est une liste des adresses email de vos amis de façon à pouvoir les spammer. La privauté est certainement un domaine gris — vos amis n’aimeraient surement pas être contactés par des tiers grâce à votre collaboration. Vous devriez y réfléchir à deux fois avant de copier toute donnée personnelle concernant vos amis sans leur permission. Tous les sites ne spammeront pas vos amis0, bien sûr, aussi soyez-en sûr et lisez bien les petites lignes.

Un autre danger que vous voudrez éviter sont les sites qui vous demandent les détails d’inscription (identitifants/mot de passe) de votre compte e-mail. C’est un trou de sécurité énorme. En transmettant cette information, vous donnez au fournisseur un accès à tous vos emails et amis, sans compter que vous lui offrez un accès vers les APIs à travers lesquelles il pourrait éditer et effacer votre information. Et, bien qu’aucun d’entre nous ne veuille l’admettre, nous utilisons souvent les mêmes mots de passe pour différents services. Fournissez votre mot de passe e-mail à un site, et ses propriétaires pourront non seulement récupérer vos e-mails, mais probablement aussi vos comptes en banque (et tout un tas d’autres services). Vous ne devriez jamais donner votre mot de passe à quiconque ! Créer des assurances de privauté nous dupe et nous donne une fausse image de sécurité — cela nous relaxe de penser que quiconque peut être de confiance et que tout sera sûr. Ce mauvais comportement est exactement ce que les phishers adorent chasser.

La capacité d’importer des données à partir d’un autre service est un outil génial, mais faire ainsi avec un nom d’utilisateur et un mot de passe est une mauvaise approche. Des sites comme Flickr, avec son API d’Authentification, l’AuthSub de Google et l’Authentification du Navigateur de Yahoo ont une bonne approche de l’authentification. OAuth est un essai d’authentification ouverte qui aidera à consolider le spectre de différentes méthodes d’authentification sur différents sites web.

En utilisant ces outils, vous pouvez autoriser d’autres sites à accéder à vos données avec des permissions finement granulées que vous réglez selon vos exigences — et non pas en donnant un accès complet à votre nom d’utilisateur et votre mot de passe. Si vous devez utiliser votre nom d’utilisateur et votre mot de passe, alors le développeur du réseau social n’importera pas vos données de façon correcte.

Vers une Vraie Portabilité

OpenSocial est un nouveau développement de Google qui est une étape dans la bonne direction. Même si cela ne permet pas la portabilité directe de votre réseau social, cela crée des crochets communs entre les réseaux sociaux qui implémentent l’API OpenSocial. Ceci veut dire qu’un développeur peut utiliser l’API People and Friends Data pour obtenir le profil d’un utilisateur, recevoir une liste d’amis et avec ça, obtenir tout aussi bien leurs profils.

Même s’il n’y a pas de bouton export (à cette heure), un simple widget pourrait être développé pour exporter vos données à l’intérieur de formats portables tels que XFN, hCard et FOAF.

OpenSocial en est à ses tous premiers pas, et le seul site qui implémente une API limitée est Orkut (une filiale de Google), mais c’est un pas très important pour créer des réseaux sociaux portables.

Promouvoir le Bon Comportement

Les sites qui vous permettent facilement d’importer et d’exporter vos données devraient être promus pour leurs bons comportements. Vous devriez essayer de fréquenter ces sites et faire pression sur les autres sites pour qu’ils suivent le mouvement.

Le Web fonctionne parce que tout le monde a le droit de faire un lien vers n’importe qui d’autre. Vos réseaux sociaux de vraie vie s’épanouissent parce que personne ne vous dit avec qui vous pouvez et ne pouvez pas être ami. Les réseaux en ligne ne devraient pas être différents. Le Web est mon réseau social ; il m’arrive simplement d’utiliser différents sites pour m’aider à les gérer, mais je ne veux pas que ces sites contrôlent tout comme le ferait un flic à un carrefour. Les réseaux sociaux ouverts résolvent tous ces problèmes.

Votre identité en ligne est à vous pour que vous la maîtrisiez comme vous aimez.

Pour plus d’information sur les réseaux sociaux portables, regardez ces sources :

Comment générer une vCard avec hCard ?

Saturday, November 3rd, 2007

Une question de Cyril posée il y a quelques jours sur Twitter :

Est ce je peux générer une vcard avec les microformats ?

Naturellement oui et merci de ton intérêt pour les microformats mon cher Cyril. hCard utilise une représentation 1:1 des propriétés et valeurs du standard vCard en XHTML sémantique. Bonne occasion pour te formuler une réponse sous forme de traduction d’un billet publié initialement le 27 janvier 2006 par Jesse Skinner. En espérant que ces quelques mots pourront t’éclairer précisément pour insérer une hCard sur ton blog. Cette traduction est naturellement publiée sous fair-use et comme d’habitude, seul le lien original fait référence. (Pour raffiner le contenu, les microfomateurs sont invités à commenter et/ou se rendre directement sur la page-miroir du wiki pour éditer/corriger directement le contenu.) — xtof.

hCard

Pour continuer ma discussion sur les microformats, jetons un coup d’oeil à la hCard.
Le microformat hCard est un moyen d’identifier de l’information de contact dans le HTML. Les gens peuvent utiliser des outils pour regarder à l’intérieur du HTML et extraire cette information sous une vCard. La vCard est un standard pour une carte de visite électronique. Il existe un bon nombre de valeurs que vous pourriez attendre (nom, numéro de téléphone, organisation, etc.) hCard sait prendre ces étiquettes et les utiliser comme des noms de classes autour des données dans le HTML.

Voici les valeurs les plus communes que vous pouvez utiliser dans hCard (pour la liste complète, regardez le wiki) :

  • fn (formated name ou nom formaté)
  • nickname (pseudo)
  • url
  • email
  • tel (téléphone)
  • adr (adresse)
  • org (organisation)
  • etc…

Chaque hCard démarre à l’intérieur d’un bloc qui a class="vcard". Ainsi une hCard très simple pourrait ressembler à cela :


<div class="vcard">
<span class="fn">Christophe Ducamp</span>
<a class="url"
href="http://claimid.com/xtof">http://claimid.com/xtof</a>
</div>

Quelques-uns de ces types ont des sous-propriétés. Par exemple la valeur tel contient type et ‘value‘. De cette façon vous pouvez spécifier des numéros de téléphone domicile et professionnel. Le type ‘adr a beaucoup de sous-propriétés ((post-office-box, extended-address, street-address, locality, region, postal-code, country-name, type, value). Une adresse pourrait ressembler à cela :


<div class="vcard">
<div class="fn">Christophe Ducamp</div>
<div class="adr">
<span class="locality">Paris</span>,
<span class="country-name">France</span>
</div>
</div>

Les noms de classes n’ont pas à signifier quoi que ce soit dans votre page. Néanmoins, vous pouvez toujours en tirer profit pour styliser votre information de contact. Vous pourriez aussi les styliser dans votre Feuille de Style Utilisateur de votre navigateur, ainsi vous pourriez les trouver pendant que vous surfez sur le web.

Le standard hCard est très flexible. Peu importe sur quels tags vous placez les classes. Cela ne doit certainement pas être obligatoirement entouré entre des balises div. Vous pourriez simplement marquer votre information de contact comme ça vous chante, et puis emballer les données dans des tags span pour assembler les données ensemble. Par exemple, elle peut figurer dans un texte normal à l’intérieur d’un paragraphe :


<p class="vcard">
Mon nom est <span class="fn">Christophe Ducamp</span>.
Je vis à
<span class="adr"><span class="locality">Paris</span>,
<span class="country-name">France</span></span>.
Je travaille pour la
<span class="org">Caisse Nationale des Caisses d'Epargne</span>.
J'anime un blog pour le groupe des microformateurs sur
<a class="url" href="http://microformateurs.org/">
http://microformateurs.org/</a>.
</p>

Il existe déjà beaucoup d’outils et encore plus à venir. Si vous ne voulez pas installer un plugin navigateur, ou si vous vous voulez donner à tous les visiteurs de votre site un moyen de télécharger votre hCard sous une vCard, X2V est un service qui fait tout simplement ça. Faites simplement un lien vers :

http://suda.co.uk/projects/X2V/get-vcard.php?uri=[URL avec une hCard]

Par exemple, cliquez ici pour télécharger une vCard de cette simple hCard :

Mon nom est Christophe Ducamp. Je vis à Paris, France. Je travaille pour la Caisse Nationale des Caisses d’Epargne. J’anime un blog pour le groupe des microformateurs sur http://microformateurs.org/.

hCard, comme d’autres microformats est merveilleusement simple et déjà incroyablement puissant. Vous pouvez commencer dès maintenant avec très peu de travail, sans attendre que le standard soit massivement utilisé. Dès qu’il y aura plus de personnes en quête de hCards (et de votre information de contact), votre site web leur facilitera les choses.

Brian Suda : “Microformats - Plus de sens pour votre marquage”

Sunday, October 28th, 2007

Ce qui suit est une traduction d’un article de Brian Suda paru en juillet dernier. Si vous faites partie des MicroFormateurs, vous pouvez aider à raffiner ce premier jet en lisant l’article original (seul lien de référence) et en cliquant ici pour modifier le contenu. L’idée suggérée par cet article est d’inviter tous les blogueurs MicroFormateurs blogueurs à mettre proprement à jour leurs listes d’amis en y ajoutant plus de sens sémantique. Les travaux pratiques ont démarré sur la page BlogRoll des Microformateurs restant ouverte à discussion et suggestions. Cette traduction est naturellement publiée sour Fair-Use. — xtof

Microformats : Plus de Sens dans Votre Marquage

Par Brian Suda

le 24 juillet 2007

fonctionnalités des microformats - sitepoint

Vous avez probablement dû entendre parler du terme “microformat” et supposé que ça faisait partie de
quelque mouvement feu de paille type web 2.0. Mais “microformat” n’est pas uniquement un nom amusant ou quelque marque déposée — ça fait partie d’une bien plus grande image. Aussi, que sontles microformats ?

Le site web officiel microformats.org (NDT : (fr)) définit ainsi les microformats :

Conçus d’abord pour les êtres humains et ensuite pour les machines, les microformats sont un ensemble de formats de données ouverts et simples, construits sur des standards existants et massivement adoptés.

En utilisant ces standards largement adoptés, les auteurs peuvent encoder une sémantique supplémentaire dans le marquage HTML des pages web. Ceci donne aux pages du sens allant au delà des exigences des valeurs frontales des éléments HTML, leur permettant d’être consommées, remixées et mélangées. Par exemple, en ajoutant quelque marquage sémantique à une page web qui décrit un événement à venir, les propriétés telles que les dates de l’événement peuvent être facilement extraites et utilisées par d’autres services et logiciels comme les calendriers et organiseurs personnels.

Les Microformats sont tout ce qui traite de la représentation de l’information sémantique encodée dans une page web, permettant à cette information d’être exploitée dans des manières qui n’avaient probablement jamais été conçues par l’auteur. L’idée de placer plus d’information sémantique directement dans le HTML n’a rien de nouveau — les gens dans l’industrie du web ont discuté de ce concept depuis plus de dix ans — mais à travers les efforts de beaucoup de bénévoles, suffisamment de documentation, de support, de librairies de code et d’outils ont été créés pour générer un élan derrière les microformats. L’idée est finalement en train de devenir réalité.

Maintenant si vos yeux se vitrent et si toute mention plus approfondie de sémantique, d’encodage, de formats de données ou même des standards vous renvoie simplement à YouTube, patientez. Je vais démontrer que l’utilisation des microformats est la simplicité en elle-même. Ce peut être seulement tout aussi difficile que de savoir ajouter un nom de classe à un élément unique H