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

Contrairement à la très majorité de mes compatriotes, j’utilise un clavier QWERTY américain. Plus exactement, un clavier américain accentué qui me permet d’écrire les caractères accentués, y compris les majuscules, et ce au prix d’une petite gymnastique mentale, du moins au début, à laquelle je ne fais plus attention depuis des années. J’ai commencé à utiliser un clavier américain dans les années 80, quand les limitations de mémoire de mon 8086 m’empêchaient de charger en même temps le clavier français et l’éditeur de Quick Basic 4.5. Je me suis rapidement rendu compte combien accéder à des touches indispensables comme [], {}, \ ou () sans devoir effectuer des acrobaties à rendre jalouses les contorsionnistes du Grand Cirque de Pékin pouvait être agréable.

Aujourd’hui, la très grande majorité des gestionnaires de session proposent une liste graphique des utilisateurs pouvant accéder à la machine afin que ceux-ci n’aient plus besoin de taper leur identifiant. Cet effort louable en matière de confort d’utilisation n’est certes pas exempt de soucis de sécurité, mais dans un environnement familial, il rajoute une touche de convivialité non négligeable. On retrouve ces fonctionnalités sous Windows XP, KDM, GDM, et probablement bien d’autres.

L’effort d’utilisabilité aurait pu être poussé un peu plus avant, notamment en permettant de choisir son clavier dès l’identification. La raison à cela ? Taper son mot de passe à deux à l’heure en cherchant fiévreusement ses touches sur un clavier totalement étranger a quelque chose de particulièrement pénible.

Edit :
Une feature request a été ouverte pour GDM et quelqu’un y avait déjà pensé sous KDM.

• Samedi, atelier Google Map.
• Jeudi, séminaire sur le Web Mobile
• Vendredi, conférence Paris on Rails

Le week-end commençant, ne vous étonnez donc pas de me voir arriver lundi avec une killer app en Rails utilisant la Google Map API à destination des PDA et téléphones mobiles.

L’initiative WMI W3C organisait aujourd’hui un séminaire d’une demi journée consacré au web sur les appareils mobiles, PDA et téléphone portables. Au programme, état des lieux, bonnes pratiques de création de sites à destination de ces outils, problèmes à résoudre à perspectives.

Quelques chiffres sur le web mobile.

• 28% des téléphones mobiles ont accès à Internet.
• 10% d’entre eux l’utilisent vraiment régulièrement.
• 41% des utilisateurs se déclarent insatisfaits par les sites à leur disposition.
• 3,2 millions de personnes ont utilisé leur téléphone mobile ou leur PDA afin d’accéder au web lors du mois de juillet 2006.
• Plus de 80% de la population mondiale est sous couverture GSM.
• 2 milliards d’êtres humains disposent aujourd’hui d’un téléphone mobile, ce nombre aura doublé dans 4 ans.

Selon Bango, durant les 18 derniers mois :

• Le nombre d’utilisateurs identifiables a été multiplié par 2,6.
• La durée moyenne des visites sur le web a été multiplié par 1.38.
• Le nombre d’utilisateurs redirigés d’un site web “normal” vers un site web pour mobile a été multiplié par 45.
• Le nombre d’utilisateurs étant arrivé sur un site mobile par SMS a crû de 140%. Ceci est du au fait que les claviers des appareils existants se prêtent mal à la saisie d’une URL.
• Le nombre de terminaux différents a décru de 58%.

De bonnes pratiques de développement sur mobiles.

• Concevez vos sites pour une résolution de 120*120 pixels.
• Limitez vos pages à 20ko, images comprises.
• Utilisez de préférence des images au format .gif et .jpg.
• Préférez un encodage en UTF-8.
• Utilisez du XHTML basic.

Et retenez ces 10 principes de développement, qui résument les 60 points des “best practices” émises par le W3C :

1. Faites vos sites pour un web unique (mobile et non mobile).
2. Conformez-vous aux standards du web.
3. Banissez les frames, les layouts basés sur les tables et les gifs transparents.
4. Optimisez la navigation.
5. Pensez aux utilisateurs en déplacement.
6. Faites attention aux éléments graphiques et aux couleurs utilisées. Préférez un contraste important entre le fond et les couleurs.
7. Faites de petites pages, utilisez de petites images.
8. Aidez les input utilisateurs.
9. Économisez la bande passante.
10. Ne vous reposez pas sur le javascript et les cookies.

Notez que ces recommandations se basent sur les critères d’accessibilité du WAI. Cela ne garantit pas pour autant que les contenus produits sur les mobiles seront 100% accessibles aux déficients visuels ou aux aveugles.

Le navigateur mobile idéal

Michael Smith nous présente la vision d’un navigateur mobile idéal selon Opéra.

Un bon navigateur mobile devrait pouvoir :

• Reformater un texte (même disposé sur plusieurs colonnes) en une seule afin d’éviter le scrolling horizontal.
• Redimensionner une image à la taille de l’écran utilisé, pour les mêmes raisons qu’évoquées ci-dessous.
• Proposer un mode “desktop”, c’est à afficher le site tel qu’il apparaîtrait sur un navigateur traditionnel.

Michael considère ces critères comme minimaux et souhaiterait aussi voir les navigateurs mobiles pouvoir :

• Réduire, ou faire disparaître (expand / collapse) les longues listes de liens généralement utilisées pour la navigation, et qui empêchent un accès rapide au contenu.
• Découper les grosses pages en pages de taille plus raisonnable (autour de 10ko) en suivant leur sémantique structurelle afin de s’adapter à la fois aux écrans et aux limitations de mémoire de ces outils.

Et là encore, il considère que c’est le minimum.

Je rejoins tout à fait la position de Mike. La très grande majorité des sites web n’offriront jamais de version dédiée aux mobiles. L’adaptation des contenus doit donc se faire coté navigateurs quand la feuille de style “handhelds” n’est pas disponible. En supprimant la feuille de style normale et appliquant une découpe aux pages trop longues, on obtient des sites utilisables.

Et Michael d’en rajouter une couche à propos du navigateur idéal qu’il verrait bien :

• Avoir une API de scripting permettant de détecter et utiliser les fonctionnalités des appareils (comme le GPS).
• Ce qui permettrait de créer des applications web pour les services géo localisés.

Problèmes à résoudre

• Il existe plus de 200 outils mobiles différents.
• Certains utilisent du XHTML 1.1, d’autres du XHTML basique, d’autres du xHTML…
• Aucun n’a le même support de CSS que le voisin.
• Certains supportent le javascript et les cookies, d’autres non.

Aujourd’hui, la solution utilisée est de formater la page en fonction du device utilisé : menu déroulant ou cases à cocher ? Puis d’envoyer des pages générées dans le bon langage. Autant dire que seuls les plus gros peuvent se l’offrir, et le contenu créé par les utilisateurs est fort peu disponible sur le web mobile.

On voit pourtant apparaître des outils de blogging, de partage de photos… les réseaux sociaux sont très actifs dans la téléphonie mobile, et on les comprends. Quoi de plus communiquant qu’un téléphone ou un PDA ?

Perspectives

Le web mobile est probablement l’avenir des pays en voie de développement, principalement pour les services comme :

• Les services gouvernementaux.
• L’éducation.
• La santé.
• La banque.
• Les affaires.

Quelques chiffres :

• Inde : taux de pénétration des PC : 2%, stable, contre 11% pour les téléphones mobiles, avec une croissance de 47% par an.
• Chine : taux de pénétration des PC : 8%, contre 30% pour les téléphones mobiles.
• Maroc : 4 lignes fixes pour 100 habitants (chiffre inchangé depuis 1995), contre 24 téléphones mobiles.

L’utilisation des SMS pour accéder à tous ces services explose dans les pays en développement.

Conclusion

Les présentations des intervenants sont accesibles sur le site du séminaire.

La pente est forte, mais la route est longue, alors au travail !

Je rentre tout juste de l’apéro organisé à l’occasion des Journées Mondiales de l’Utilisabilité, organisé par Frédéric Cavazza. Excellente occasion de rencontrer des spécialistes d’une discipline à laquelle je m’intéresse et que j’ai la chance de côtoyer quotidiennement dans mon travail. Proposer des outils simples, pratiques, intuitifs, rapides (et qui marchent) est particulièrement important si l’on veut attirer et fidéliser une clientèle grand public sur le web.

Frédéric en profitait pour lancer les cafés de l’ergonomie à Paris, une initiative des plus intéressante : les ergonomes (badges oranges) se font payer à boire par les non ergonomes (badges verts dont je faisais partie) en échange d’une analyse de leur site.

Ce site étant en pleine restructuration, je venais simplement nouer de nouveaux contacts autour d’une bière. J’ai toutefois pu exposer des idées qui me travaillent depuis quelques semaines, et il semble que je sois sur la bonne voie. Il me reste cependant énormément de travail pour formaliser la chose et aboutir à quelque chose de concret, et les journées ne durent que 24 heures.

Si l’événement vous intéressait mais que vous n’avez pas pu vous y rendre, vous pouvez en lire un rapide compte rendu chez Frédéric, en attendant l’arrivée des vidéos des conférences. D’ailleurs, si je ne devais garder qu’un seul usage des services de partage de vidéos en ligne, je crois que ce serait le partage de la connaissance.

Les offres d’emploi dans les technologies de l’information constituent généralement une bonne approche de l’état du marché. Sortis du langage très formel généralement utilisé dans la description des postes, l’utilisation de certains mots clés donnent des indications intéressantes sur les tendances en cours, aussi bien en matière de technologies que de projets.

Malheureusement, cela permet aussi de se rendre compte que de nombreux commerciaux jouent encore sur les mots clés du moment sans pour autant avoir la moindre idée de ce dont ils parlent, comme me le prouve cette annonce reçue ce matin :

La société souhaite réorganiser le site [insérer ici un site quelconque] et le doter de nouvelles fonctionnalités, en y intégrant des applications faisant appel aux nouvelles technologies de l’Internet, notamment celles en relation avec le Web 2.0.

Difficile de ne pas sourire quand je lis la liste des compétences requises :

• Fortes compétences en deéveloppement d’application Web interactives utilisant la programmation en langage objet et les technos AJAX
• PHP / MySQL, JavaScript, XHTML et CSS, DOM, XMLHttpRequest

Et je ne peux réprimer de tiquer en voyant la dernière ligne de l’offre :

En complément, les connaissances dans les domaines suivants seraient un plus :

• architecture client/server J2EE

J2EE… sooooo web 1.0.

Je viens de rejoindre l’initiative Dessine moi le web 2.0, lancée par l’agence Groupe Reflect.

Après Tristan Nitot, Bertrand Duperrin ou Frédéric Cavazza, c’est à mon tour de m’exprimer à propos du web 2.0 à travers une rapide interview :

1. Qui êtes vous et quel est votre rapport avec le web 2.0 ?
2. Si vous deviez expliquer le web 2.0 à tout un chacun, qu’est-ce que vous diriez ?
3. Qu’est ce que représente le “web 2.0 dans le monde d’aujourd’hui, quel impact sur la société, l’économie, la technologie et autres ?
4. Le web 2.0, et après ?

La réponse à toutes ces questions se trouve sur Le web 2.0 de Frédéric de Villamil. En ce qui concerne la question de la vie, de l’univers et du reste, la réponse est toujours 42… .0, évidemment.

Je rentre juste du septième Barcamp Paris, qui se tenait dans les gigantesques locaux de Google à deux pas de l’Opéra. Ambiance Google oblige, nous avons pu profiter de leur frigo, du fauteuil massant et des poufs Google.

Au programme, un atelier de présentation des possibilités de l’API Google Map, co animé par son auteur. Au bout du compte reste une grande question : et après, on fait quoi ? Un Pacman sur Google Map ?

Ah non, en fait, ça existe déjà.

J’ai ensuite animé une session sur les Microformats axée sur leur utilisation dans le cadre de l’ajout de valeur aux données issues des réseaux sociaux, particulièrement dans le domaine professionnel. Les slides sont disponibles sous forme de présentation S5 publiée sous Créative Commons.

Et les photos de la journée se trouvent sur mon compte Flickr.

Histoire de fêter l’avancement de mon projet et un week-end bien mérité, je partage ce gag trouvé dans le courrier des lecteurs du très sérieux magazine Famille Chrétienne :

Le site www.catholiens.fr que nous avons cité dans notre numéro de la semaine dernière, p. 74 est en réalité une parodie (renvoyant notamment à des sites pornos) du vrai site chrétien (d’origine belge) www.catholiens.org.
Avec nos vives excuses aux internautes qui auraient été piégés.

Je ne devrais pas trouver ça drôle – en fait je trouve ça aussi honteux que stupide en pensant aux enfants qui pourraient tomber dessus – et pourtant Dieu sait que ça m’a fait rire.

Text Links Ads, la régie publicitaire à laquelle j’ai confié ce site vient de lancer Review Me, une régie publicitaire dédiée aux blogs.

Le principe est simple. Des annonceurs contactent des blogueurs inscrits sur le site et leur proposent de réaliser un billet sur leur produit. Si le blogueur accepte, il a 48 heures pour pondre son article et la régie le rémunère de la somme convenue à l’avance.

Le concept n’a rien de bien nouveau, et devrait faire hurler nombre de journalistes qui reprochent aux blogueurs de ne pas être soumis au même code de déontologie qu’eux. On peut le voir comme quelque chose de profondément malhonnête et injuste, en argumentant que seuls les blogueurs influents profiteront de ce système sans jamais l’admettre. Sauf que… la politique maison stipule bien que :

You must disclose that the post is a paid post in some way. Here are some ideas: “Sponsored Post:”, “The following is a paid review:” “Advertisement:”.

Ce billet est d’ailleurs sponsorisé par… Reviewme.

Je pense surtout que cela va permettre à des blogueurs qui ont su fédérer une forte audience de se voir récompensés de leurs efforts honnêtement et sans avoir à couvrir leur site de disgracieuses bannières. Sans compter que cela pourrait bien booster quelque peu hreview.

Et puisqu’on parle de Microformats, je vous rappelle que je parlerai demain de l’utilisation des microformats pour augmenter la valeur des données publiées sur les réseaux sociaux au septième Barcamp Paris.

Combien de fois ai-je vu des étudiants en stage de fin de cursus me déclarer “je veux être chef” avant même d’obtenir leur diplôme ? Et chef de quoi, d’abord ? Chef de projets, avant même sa première confrontation à un vrai projet dans le monde réel – comprendre celui de l’entreprise. Permettez moi de sourire : lors de mon passage à EDF, j’ai vu des centraliens pisser du Java sans rechigner 10 heures par jour, avant de pouvoir enfin obtenir le statut tant convoité.

On tient pourtant là un des (nombreux) paradoxes de bien des informaticiens :

Jeunes développeurs, ils craignent de le rester toute leur vie et n’ont rien de plus pressé que de quitter ce statut pour rejoindre le coté obscur de la force, peuplé de tableaux Excel, de présentations Powerpoint et de plateaux repas froids apportés par un traiteur en plein milieu d’une réunion marathon.

Chefs de projets, leur première inquiétude est de perdre pied sur le plan technique, et de ne plus pouvoir suivre ce que réalisent les développeurs placés sous leur responsabilité, voire d’effectuer des choix cohérents : CGI en C ou framework en PHP5 ? J2EE ou Ruby on Rails ?

On ne peut donner tort aux premiers : dans le monde impitoyable des sociétés de services, un développeur trop expérimenté coûte bien plus cher que ce que le marché accepte de le payer, ou alors c’est qu’il il fait du COBOL et maintient des applications plus vieilles que moi.

On peut donner pareillement raison aux seconds sur lesquels plane l’ombre de ces chefs de projets ou DSI de 55 ans, confortablement installés dans leur fauteuil en attendant la retraite, incapables de prendre une décision sensée puisqu’aux antipodes de la réalité, mais refusant de se remettre en question au nom du sacro saint principe de Dilbert qu’on ne doit pas nommer mais qu’on ne se gène pas pour appliquer au jour le jour. Ceux qui pensent que j’exagère manquent probablement encore d’expérience dans les méandres des grands groupes de notre beau pays.

Aux premiers, j’aurais envie de dire “patience” : vous apprenez la gestion de projets à l’école, et c’est très bien, mais avant de réclamer des responsabilités, souvenez-vous de ces deux proverbes :

La pratique n’est rien d’autre que la mise en application de la théorie… du moins en théorie.

et :

C’est au pied du mur qu’on voit le mieux le mur.

Quand aux seconds, je ne saurais leur conseiller meilleure alternative aux coûteuses formations dispensées par des instituts renommés que l’investissement au titre de vos loisirs dans un projet open source. Pas forcément à grosse dose, chacun selon ses possibilités mais vous n’en tirerez que des bénéfices :

• La dynamique de groupe de tels projets vous encouragera à participer.
• C’est une très bonne carte de visite pour le jour où un client fera une recherche sur votre nom sur Google.
• Le monde de l’open source est généralement très au fait des derniers changements technologiques auxquels vous risquez un jour d’être confronté.
• Vous nouez de nombreux contacts à l’international

En un mot : vous continuez à apprendre tout en vous amusant et vous rendant utile.