Ergonomie, Rails et Architecture de l'information web (2.0)

On vient de me signaler que le quotidien gratuit 20 Minutes m’avait inclus dans le classement ”Top 50 Tech et Média” de son numéro du 10 avril 2007.

Non pas que cela m’en touchât une sans faire bouger l’autre, mais mais je vous préviens tout de suite, maintenant les interviews, c’est une pinte (par texto si vous n’êtes pas à Paris) minimum. Aujourd’hui 20 Minutes, demain la Creuse Active, et dans une semaine le Washington Post ?

Il en est du blog comme des charentaises : difficile d’aboutir à un bon résultat si l’on n’est pas parfaitement à l’aise dedans. De l’idée de base à la publication, une liste de mes outils favoris, histoire de parler de choses plus “légères” en ce beau vendredi de printemps :

Hébergement

J’héberge mon blog sur un serveur dédié chez 1&1, parce que j’aime bien être le maître chez moi.

Caractéristiques :

• Athlon64 3000+.
• 1Go de RAM.
• 2*80Go de disque dur en RAID 1.
• Bande passante : 100Mb full duplex.

Il est le résultat d’un deal avec mon épouse : troquer les 5 machines qui encombraient un placard de l’appartement augmentaient dramatiquement nos factures d’électricité contre une machine dédiée. Une seul condition : elle ne devait pas nous coûter plus cher que l’ancien système. Résultat, elle a récupéré sa penderie, et l’appartement est beaucoup moins bruyant.

Plate-forme

Typo, un outil de publication open source en Ruby on Rails sur lequel je développe à mes heures perdues. Comme ils disent outre-Atlantique, eat your own dogfood, montrez l’exemple en utilisant les applications que vous développez. L’outil a encore beaucoup de soucis de jeunesse, mais comme je travaille dessus, il prend peu à peu la forme que je veux lui donner.

Éditeur de billets

J’édite tous mes billets en HTML sur l’incroyable Textmate sous Mac OS X, que je n’échangerai pas pour 10 barils d’une lessive plus chère.

Outils de statistiques

J’en utilise 3, qui me donnent des résultats tous différents, ce qui fait que, finalement, j’en tiens assez peu compte :

• Google Analytics.
• Sitealizer, un outil récemment intégré à Typo et que vous ne trouverez que dans la version de développement.
• Awstats, un analyseur de logs Apache développé en Perl.

Il faut ajouter à cela les statistiques RSS de Feedburner.

Revenus et publicité

Je passe par la régie publicitaire Text Link Ads, qui m’a rapporté environ 360 dollars pour le mois de mars. La publicité est là pour financer le serveur et ainsi héberger gracieusement quelques amis.

Et puisqu’il parait que je dois refiler cette chaîne à 5 personnes, ce sera :

1. Stephanie Booth.
2. Thanh Nguyen.
3. Jean-Françcois Ruiz
4. Simple Entrepreneur
5. Qui voudra, j’ai la flemme de chercher plus loin.

Histoire de changer des classements d’affluence ou d’influence qui ne servent pour ainsi dire à rien en dehors de flatter l’ego de ceux qui s’y retrouvent en leur donnant l’impression d’être importants, OuiNon propose sa transposition des principaux blogs francophones sur une carte du monde, parmi lesquels j’ai la surprise de me trouver.

J’ai trouvé dans cette expérience une bonne occasion de caricaturer gentiment notre blogosphère, tout en essayant d’apporter un peu plus de sens, en termes de contenus et d’affinités, aux divers annuaires et classements existants. Cependant, tout cela comporte une forte dose de subjectivité et d’approximation. Ne transmettez surtout pas cette tentative cartographique à l’IGN ou au CNRS sinon je suis foutu !

La démarche du monsieur me plaît à plus d’un titre :

• Au niveau purement marketing, il réussit à faire relayer son initiative par de nombreux blogs influents, sans passer par la case de l’insulte gratuite comme d’autres ont pu le faire jusqu’ici.
• Le côté thématique et non qualitatif ou quantitatif de la démarche est intéressant. Pour une fois qu’un tel classement ne cherche pas à montrer qui a la plus grosse.
• Elle m’a forcé à réviser ma géographie d’Amérique Centrale : j’étais persuadé d’être au Nicaragua, je me retrouve en fait au Honduras.

Je suis juste un peu étonné de me retrouver parmi les blogs business / marketing moi qui pensais avoir un blog de geek. C’est toujours bon à savoir.

Petit changement dans la politique de commentaires sur ce blog : désormais, je modère tout par défaut. Évidemment, ça présente quelques inconvénients, mais aussi beaucoup d’avantages.

Les inconvénients : ayant pas mal de boulot, je ne publierai les commentaires que deux fois par jour, le matin et le soir.

Les avantages : il y en a un certain nombre.

• Réouverture des trackbacks, fermés pour cause de spam.
• La modération devrait virer 90% des commentaires inintéressants et élever un chouilla le niveau de la discussion : on n’envoie pas un commentaire en sachant qu’il risque fort de passer à la trappe.
• J’ai supprimé les rel="nofollow" dans les commentaires : il est normal que les gens qui participent à la valeur (hem) de ce blog puissent en profiter un peu.

Pour assurer la modération à priori, j’ai du modifier un peu le code de cette version de Typo. Cette fonctionnalité sera ajoutée à la version de développement. Je devrais permettre aux utilisateurs authentifiés de commenter tranquillement, tout ceci étant paramétrable.

[edit]
L’avantage des insomnies, c’est qu’elles autorisent beaucoup plus facilement la mise en pratique du vieil axiome ne remet pas à la release suivante ce que tu peux commiter le jour même.

Il se passe de drôles de choses depuis quelques jours : certes, j’ai regagné un Page Rank décent, mais en contrepartie, j’ai totalement disparu de Google.

Prenons mon nom de famille, par exemple : Villamil. Je suis passé de la première à la huitième page. Et c’est comme ça sur tous les mots clés sur lesquels j’avais un positionnement correct, voire plus que correct. Une idée quelqu’un ?

Il y a peut-être deux ans maintenant, Michel, David et moi avions évoqué l’idée de créer un clone de Wordpress plus propre, plus léger et plus rapide, et en PHP5. Nous étions depuis longtemps lassés des vulnérabilités de sécurité jamais corrigées, de son usinagazification et de la mainmise absolue de Matt sur le projet, insulte permanente à une communauté d’utilisateurs et de développeurs particulièrement active sans laquelle il serait jamais devenu ce qu’il est aujourd’hui. Depuis, Michel a développé son propre environnement de blog en Ruby on Rails, Dave s’est consacré à d’autres projets plus terre à terre, et je suis finalement passé sous Typo.

Pendant ce temps, l’idée a travaillé quelques uns des plus gros contributeurs de Wordpress, et pas des moindres. Chris J Davis, Richard Bowen, Scott Merrill, Owen Winkler et même Michael Heilemann ont décidé qu’eux aussi en avaient assez et se sont regroupés afin de créer Habari, la prochaine killer blogging application grand public en tenant compte des erreurs du passé.

Habari “neuf” en Swahili, comme dans “Quoi de neuf, docteur ?”, et la version de développement s’annonce déjà prometteuse.

L’administration générale du site.

La zone de saisie des billets.

Habari a bien su tirer les leçons de l’aventure Wordpress, aussi bien sur le plan technique qu’au niveau organisationnel. Développé en PHP5 avec MySQL 5 – des versions PostgreSQL et SQLlite sont aussi prévues – il s’appuie particulièrement sur les possibilités de programmation orientée objet du langage, et se tourne radicalement vers l’avenir puisqu’on ne peut pas vraiment dire que celui-ci soit particulièrement disponible en standard chez les hébergeurs grand public. Coté management des développeurs, le projet fonctionne désormais à la méritocratie : plus vous en faites, plus votre voix compte quand il s’agit de faire prendre un virage stratégique au projet, chose que je trouve plutôt saine et qui permet de faire venir du sang neuf actif assez régulièrement, donc de ne pas laisser mourir le projet parce que les développeurs principaux se consacrent à autre chose et bloquent le processus d’évolution de l’outil.

Si le projet vous intéresse, sachez que tout le monde est invité à y contribuer. Commencez par lire l’appel à contributeurs, et venez les rejoindre sur le canal IRC #habari@irc.freenode.net. Et si vous venez de Wordpress, il existe déjà un script d’importation vous permettant de faire le pas.

À la fin de l’année dernière, j’ai commencé à m’intéresser au positionnement de ce site sur les moteurs de recherche. J’ai alors contacté Sébastien Billard qui tient l’excellent blog Référencement, Design et Compagnie afin qu’il me fasse profiter de ses lumières. Suite à ses réponses, j’ai commencé une refonte structurelle – et ergonomique – qui a amené à la version actuelle. Un mois plus tard, retour sur les améliorations effectuées et sur les résultats obtenus.

Conseils Structurels

• Remplir le champ <title> à l’aide du titre du billet suivie de la mention “Frédéric de Villamil.com”. Cela permet aux outils de référencement de bien distinguer les pages les unes des autres.
• Dans la structure du code, mettre le contenu de chaque billet avant la navigation, de telle sorte qu’il se retrouve à la première place. Là aussi, il s’agit d’éviter que les moteurs de recherche ne considèrent les contenus comme semblables d’une page à l’autre. Techniquement, cela se fait en jouant sur la position des éléments : le contenu, placé avant dans le code, est placé dans un float: right;, tandis qu’on laisse la navigation dans le flot de la page.
• Supprimer le lien sur le titre du billet en mode lecture puisqu’il pointe de toute manière vers la page en cours. Cela rajoute en plus un bon point pour l’accessibilité.
• Mettre le message “Répondre à ce billet” dans une balise <h3> et non une balise <h2>, cette dernière étant déjà utilisée par le titre du billet, hiérarchiquement supérieur au formulaire de réponse dans la structure de la page.

Conseils éditoriaux

• Ajouter une tagline reprenant les principaux mots clé du site. Sébastien m’avait suggéré “Ergonomie, web design, métiers du web : le blog de Frédéric de Villamil”, mais ma préférence est finalement allée à “Webdesign, Ergonomie et Métiers du Web (2.0)”. Côté sémantique structurelle, le titre du blog se trouve dans une balise <h1> et l’accroche juste en dessous dans une balise <h2>.
• Supprimer le paragraphe de présentation placé en haut de chaque page. Relativement long, celui-ci leurrait les outils de recherche en leur faisant croire que toutes les pages étaient semblables. Le résultat était catastrophique, puisque Google ne recensait que 4 pages différentes, et plus de 1500 doublons. Le paragraphe de présentation a finalement rejoint la navigation, en bas de page.
• Faire figurer les catégories sur l’ensemble des pages, et particulièrement sur celles des billets. Seul problème, je ne voulais plus de sidebar sur ce blog. J’ai finalement décidé de déroger en ce qui concerne les catégories, pour des raisons purement ergonomiques : ce système permet au lecteur d’embrasser le contenu du dernier billet et les thématiques du site d’un seul coup d’oeil, sans retomber dans la pollution visuelle entraînée par une sidebar “fourre tout”.
• Soumettre le site à des annuaires afin de varier la provenance de mes liens entrants, principalement des blogs à ce jour.

Les résultats

Source : google.com, les chiffres de google.fr peuvent être différentes.

Je referai le point sur ces mots clé dans 6 mois, afin de constater les évolutions à venir, en faisant une vérification sur ces mots clé chaque premier du mois, et en les comparant à mes statistiques en entrée. Je remercie Sébastien pour ces conseils qui ne m’ont absolument rien coûté, puisque la bière promise n’a pas encore été commandée. J’espère que vous pourrez à votre tour en profiter pour accroître la visibilité de votre site.

Je trouve un moment pour répondre à la chaîne qui a fait le tour de la blogosphère en quelques semaines et que m’a transmis Stéphane Thomas. Désolé Stéphane d’avoir été aussi long à répondre, mais il me fallait trouver des choses à narrer en rapport avec la thématique de ce blog, puisque j’ai pour principe de ne pas y raconter ma vie.

1– Je n’aime pas les chaînes

Petit, j’avais pour sacro-saint principe d’arrêter systématiquement ces chaînes stupides à base de cartes postales qui débarquaient à intervalles plus ou moins régulières dans la boite aux lettre parentale. Peu me chaulait qu’elles aient fait 15 fois le tour du monde à l’initiative d’une paralytique sourde et muette, et que mon acte me fasse courir le risque effroyable de voir brûler ma maison, perdre mon lapin nain d’une crise cardiaque, et voir mes numéros du loto sortir un jour où je n’aurais pas joué. L’entrepôt mitoyen a bien été ravagé par les flammes – et quelques tuiles de ma toiture par la gigue des pompiers – mais la maison maternelle est toujours là, le lapin nain de ma soeur va on ne peut mieux et profite d’une longévité exceptionnelle pour quelqu’un de son espèce, et je ne supporte pas les jeux de hasard.

Il en va de même pour les chaînes sur Internet, et je me retiens régulièrement pour ne pas ajouter les impudents transmetteurs à ma blacklist.

2– J’ai découvert Ruby en septembre 2003

J’étais à l’époque en mission chez EDF. Un matin, un ami qui était sur la même mission que moi a débarqué dans mon bureau tout excité “j’ai découvert un langage qui torche, ça s’appelle Ruby, et j’ai déjà fait [ajouter ici un truc de malade sachant qu’il avait découvert le langage la veille au soir]”.

Quelques mois plus tard, il débarque à nouveau dans mon bureau encore plus excité: “sur la mailing list de Ruby, ils viennent d’annoncer la création d’un framework qui va tout déchirer. Ça s’appelle Rails”.

3– Mon premier site web était en rouge et blanc sur fond noir avec des frames

Je me souviens d’une vraie soupe de balises faite sous le bloc note de Windows 3.11 pour Workgroup, avec déja un énorme problème : ce qui marchait chez moi sous Internet Explorer ne marchait souvent pas sur le Netscape de l’endroit où j’avais accès au Web. C’était il y a longtemps, très longtemps, dans une galaxie lointaine, très lointaine.

J’ai très vite changé mon fusil d’épaule, et jusqu’à l’avènement du tout javascript cliqua convi, j’utilisais à 90% lynx, un navigateur léger, simple, disponible partout, et particulièrement sensible à l’abandon de la structure en tableaux imbriqués. Malheureusement, il ne supporte pas Javascript, et l’absence quasi systématique de progressive enhancement ou au moins de gracefull degradation sur les sites grand public l’a tué.

4– J’ai découvert les réseaux sociaux avec Orkut

J’ai découvert Orkut à l’été 2003, à peu près en même temps que Parano d’ailleurs, un autre réseau social. Je me suis rapidement aperçu des grandes vérités des réseaux sociaux :

1. C’est épouvantablement chronophage.
2. Pour que ce soit intéressant, il faut y passer un temps considérable.
3. La mutation est tellement rapide qu’une absence de plus de deux jours équivaut quasiment à la mort. Les communautés à la mode ont changé, tout comme les gens influents, et plus personne ne vous (re)connaît. À l’époque, il fallait être actif sur ses réseaux sociaux quasiment 24 heures sur 24 d’une attention constante si on voulait comprendre un tant soit peu ce qu’il se passait.

5– Je n’aime pas le téléphone

Je n’aime pas le téléphone, je déteste ça même. On s’y fait spammer quasiment autant que sur les mails (enfin pas moi, mon portable est sur liste rouge), et c’est beaucoup moins pratique que le courrier électronique :

• On ne peut pas répondre quand on veut.
• On ne garde pas de suivi de la conversation.
• Malgré les progrès des conférences, c’est toujours aussi difficile de suivre une conversation à plus de deux.
• Je n’ai jamais trouvé comment envoyer un ficher Excel par téléphone

Cela dit, si vous voulez m’offrir un Iphone, surtout ne vous privez pas.

Voilà, vous savez tout. Quant à moi, je ne transmettrai cette chaîne à personne, histoire de ne pas changer mes bonnes habitudes.

Intéressante discussion hier soir avec Delphine Dispa de passage à Paris sur la manière dont les flux RSS ont fait évoluer notre manière d’appréhender l’information, et sur les changements dans notre perception de l’information délivrée par notre agrégateur.

La collection d’un grand nombre de flux – parfois plusieurs centaines, 459 dans mon cas, dont certains très verbeux – entraîne une lecture plus sélective du contenu. Le choix de lire tel ou tel billet relève alors de critères tout à fait subjectifs comme la longueur de l’article, et surtout son titre. De là, la nécessité encore plus grande de doter ses billets de titres pertinents, précis et accrocheurs contenant les principaux mots clé résumant le texte à venir. Outre une forte utilité en termes de référencement, cette habitude permet aussi de ne pas passer à travers le tamis du filtrage humain.

Une autre manière de choisir son contenu est de le faire pré filtrer par les autres.

Malgré leur extrême verbosité, je récupère bon nombre de flux RSS provenant de Delicious : popular, css, design, html, ruby, webdev… Un lien et une description courte – moins d’une ligne – me permettent de savoir immédiatement si le contenu attenant est susceptible de m’intéresser. On pourrait un peu comparer cette habitude aux premiers weblogs – époque pré diaristes – ou aux linklogs comme il en existe encore.

Dans la même veine, je suis particulièrement les pelotes de liens de personnes dans le bon goût desquelles j’ai une entière confiance, qu’il s’agisse des “en vrac” de Tristan Nitot, du contenu des liens Delicious du jour de Stphanie Booth inclus dans son flux RSS général, ou des “linksluting” d’Utena.

Utiliser un “agrégateur humain” – l’expression est de Delphine – ne revient en rien à laisser autrui me dicter mes choix de lecture. Il s’agit simplement d’un premier filtrage basé sur la confiance, l’affinité ou la communauté des centres d’intérêt qui permet d’éliminer nombre de déchets tout en proposant près de 50% de contenu pertinent que je n’aurais pas retrouvé ailleurs.

Cela va faire un an qu’à force de publier des notes techniques sur feu mon blog personnel j’ai finalement décidé d’ouvrir celui-ci, consacré à mon métier et à mes centres d’intérêt connexes.

Un an plus tard, quelques statistiques comme ça en passant :

En interne

• 280 billets.
• 606 commentaires.

Fréquentation

• Plus faible jour de l’année : 84 visiteurs (8 janvier 2006).
• Pic de fréquentation le plus important : 7190 visiteurs (6 mai 2006)
• Moyenne sur l’année : 481 visiteurs par jour.
• Fréquentation totale : 175875 visiteurs.
• Pages vues : 658060.
• Pic RSS : 387 abonnés.

Referers

Hors moteurs de recherche et agrégateurs

1. Freenews.
2. Codex Wordpress.
3. Planet Ubuntu FR.
4. John TP.
5. Emily Robbins.
6. Standblog (quel honneur).
7. Glazblog.
8. 3 couleurs.
9. Totalement Crétin.
10. Biologeek.

Mots clé

1. Frederic de villamil.
2. Curiculum vitae.
3. Dedibox.
4. Blogooz.
5. Necctar.
6. Click.
7. Le meilleur blog français.
8. Photobucket
9. 3 column wordpress.
10. themes wordpress

Tags les plus couramment utilisés

1. Web2.0.
2. Web.
3. CSS.
4. Blog.
5. Blogging.
6. XHTML.
7. Microformats.
8. Typo.
9. Emploi.
10. Webdesign.

Et puisque l’homme de l’année, c’est vous, à vous de me dire ce que vous voulez y voir pour 2006… 2.0.