Toute bonne nouvelle ne venant jamais seule et comme je l’ai déjà mentionné, je reprends du service sur Web intention. Mais plusieurs précisions avant tout.

Au cours d’une rencontre avec Delphine Malassingne, nous avons partagé nos différentes visions de nos métiers, responsable qualité web. Nos visions étant complémentaires, l’idée d’un projet commun a rapidement germé.

w3qualité  (tout en minuscule !) est finalement né et les premières pages sont maintenant visibles. Ce projet a pour ambition de fournir des ressources (outils, articles, analyses, etc.) sur la qualité web… vaste sujet.

Les premiers retours que nous avons eu sont plus qu’encourageant et nous confortent dans l’idée que ce portail viendra combler un manque dans le web français. Merci à vous.

Nous avons proposé à plusieurs personnes qui gravitent autour du web et ayant une philosophie et une approche du web qui convergent avec les nôtres, de participer à cette aventure. L’équipe qui s’occupera de ce site est ainsi constituée de :

• Delphine Malassingne, responsable qualité web, secrétaire de Paris Web 2011, qualiticienne de valeurs et pile électrique du web
• Christophe Andrieu, directeur artistique freelance rare et de talent, dessinateur de talent et grand jappeur devant l’Internet
• Vincent Valentin, développeur front-end de génie qu’on ne présente plus
• Stéphane Deschamps, inénarrable expert en accessibilité, gourou 6ème dan et accessoirement un des fondateurs de Paris Web
• Sébastien Delorme, Monsieur WCAG, investi par le monarque de l’accessibilité numérique de la mission d’évangéliser les impurs
• et votre serviteur, modeste responsable qualité web et consultant UX

Belle équipe, n’est-ce pas ? Un peu de modestie ne nuit pas, surtout si elle est sincère

Nous avons, également, eu le plaisir de recevoir le parrainage d’Elie Sloïm, Mr Qualité Web, fondateur de Temesis et du projet Opquast ainsi que Frank Taillandier, maitre es Standards W3C. Qu’ils en soient ici chaudement remerciés.

Vous pouvez suivre l’actualité de w3qualité  sur Twitter.

w3qualité  va prendre son envol dans les prochaines semaines avec les premiers contenus.

En conséquence, la ligne éditoriale de Web intention va évoluer et se recentrer sur une partie du web qui me tient, également, à coeur depuis longtemps : la conception et plus précisément l’ergonomie et l’expérience utilisateur. J’y reviendrai dans un prochain billet.

Dans cette attente, je vous invite à garder un oeil sur les deux Scoopit, outil de veille et de curation, que je maintiens :

• Qualité web et testing
• Ergonomie web, IHM et UX

A ce propos, si vous êtes intéressé par l’utilisation de Scoopit, il me reste quelques invitations que je pourrais partager avec grand plaisir. Faites vos demandes dans le commentaires si vous êtes tenté par l’expérience.

Sinon que pensez-vous de ces annonces ?

Je tiens également à sincèrement remercier toutes les personnes (commentaires, Twitter, mail…) qui m’ont demandé de faire revivre Web intention. Le phoenix renait !

Voici une sélection de 12 plugins que j’ai trouvés particulièrement intéressants sur différents points. Certains offrent une profonde intégration de la notion d’accessibilité en respectant WCAG 2.0, d’autres (et c’est la majorité) améliorent grandement l’ergonomie des interfaces web et sont innovants pour l’expérience utilisateur.

1. jQuery-Accessible-RIA
   jQuery Accessible RIA est une collection de plugins jQuery conformes avec les guidelines WCAG 2.0 et les normes WAI-ARIA. On y compte un plugin de gestion de tableaux, un de validation de formulaire, un pour les onglets accessibles et une lightbox. Un projet à suivre.
2. FormToWizard
   Un plugin puissant qui permet de décomposer, de manière transparente, un formulaire long et indigeste en une suite de mini-formulaires avec affichage des étapes et la possibilité de naviguer dans ces étapes.
3. Sliding login panel
   A l’heure où les formulaires de connexion et d’inscription sont devenus légion mais posent toujours problème en matière d’architecture et de webdesign, voici un plugin qui permet d’obtenir une zone d’inscription ou de connexion propre et ergonomique.
4. Validation
   Le plugin ultime de validation de formulaire en live : propre, facile à utiliser, paramétrable à souhait. Indispensable !
5. Img Notes
   Un plugin simple qui permet d’ajouter des notes sur une image (comme le permet Flicker ou Facebook, par exemple)
6. ColorPicker
   Parmi la foultitude de colorpickers existants celui-ci me parait le plus équilibré, le meilleur rapport fonctionnalités/légèreté.
7. Pretty checkboxes
   Une méthode pour remplacer de manière innovante les « bêtes » cases à cocher. Propre et clair !
8. Créer un joli nuage de mots-clé avec Facelift et jQuery
   Un tutorial pour réaliser un nuage de mots-clé dont l’aspect peut mieux respecter une charte graphique et offrir un bien meilleur rendu. Aucun problème du coté SEO, le code est non obstrusif et respecte les standards.
9. selectToUISlider
   Un superbe plugin qui permet de réaliser des sliders à une ou 2 entrées grâce à des <select> pour des sélections d’intervalles, par exemple. A noter l’accessibilité du plugin.
10. jqGrid
    Voici une solution de gestion avancée de datagrid. jqGrid permet d’afficher et de manipuler les données dans un tableau. Les chargements de données se font par requêtes Ajax et ce plugin dispose de toutes les fonctionnalités qu’on peut en attendre : tri de colonne, sous-tableaux, tableaux dépendants, performance, data mapping, dédition des données (avec filtres possibles)…
11. David Walsh: Sexy Album Art with MooTools or jQuery
    Un tutorial bien sympathique pour afficher proprement les informations d’un album de musique mais cela peut aussi s’adapter à tout autre contenu visuel nécessitant une sur-couche informative dont la présence n’est pas indispensable de prime abord.
12. Recreate the Apple Product Slider
    Un tutorial pour obtenir un slider dynamique comme sur le site d’Apple.

• FireQuery
  Un addon, encore en beta, pour Firefox bien pratique qui vient se greffer intelligemment sur Firebug et qui permet de gérer jQuery directement depuis la console Firebug. On pourra voir, par exemple, tous les événements accrochés à un élément du DOM… indispensable !
• Zero Clipboard: Javascript Copy to Clipboard
  En cadeau, un petit script, non basé sur jQuery, prometteur qui mêle javascript et Flash pour la gestion du copier/coller sur tous les navigateurs.

• l’inénarrable et inébranlable (il a été orateur à tous les Paris Web depuis leur création !) Daniel Glazman, co-chairman du Working Group CSS au W3C
• la pétulante Molly E. Holzschlag d’Opera Software et accessoirement éminent membre du Working Group CSS et expert au Working Group HTML
  
• Tristan Nitot, jamais avare de bons mots, président de Mozilla Europe
• le globe-trotter, Karl Dubost, ancien employé du W3C et Directeur technique chez Phéromone
• le réjouissant Charles McCathieNevile, chief Standards Officer chez Opera Software
• la charmante Amélie Boucher, ergonome reconnue pour ses travaux et son très bon livre sur l’ergonomie des sites web
• Eric Daspet, responsable innovation et consultant chez SQLi mais surtout évangéliste d’un web ouvert, expert francophone en PHP et un des pères fondateurs de Paris Web
• et j’en oublie mais la liste complète se trouve sur le site de Paris Web

Finalement, tout le beau monde de l’Open Web était présent. Alors que retenir de ces 2 jours de conférence ?

1. parmi les infos exclusives divulguées, une est particulièrement ressortie et a notamment marqué les esprits : la prédiction de Daniel Glazman ! Selon lui, et je suis tout enclin à le croire, IE 6 sera devenu une part négligeable du marché des navigateurs en mai 2010 et aura complètement disparu en mai 2011. Je ne sais pas sur quels chiffres il s’appuie mais je le crois, la courbe d’utilisation IE6 va dans ce sens. Au final, est-il encore opportun de perdre du temps, de l’énergie et donc de l’argent sur la compatibilité multi-navigateurs en y incluant IE6. Je suis un fervent défenseur de l’arrêt du support d’IE6 (et au moins dans un premier temps du support partiel que j’appelle souvent « dégradation propre ») et ce pour 2 raisons :
   • les utilisateurs d’IE6 le sont sur leur lieu de travail donc pas forcément dans la cible directe d’une application web (sauf cas des intranets antédiluviens ou d’application de type B2B particulière) et finalement, dans notre métier, nous avons une responsabilité importante vis à vis des utilisateurs (je ne parle pas que de nos clients mais bien de l’ensemble des internautes), à savoir, engager un processus pédagogique d’évangélisation et de sensibilisation à la qualité finale de l’expérience utilisateur qu’ils sont en train de vivre. Rendre compatible une application web avec IE6 est une contrainte forte à la créativité et à l’innovation, en plus d’être une aberration commerciale !
   • sinon, il s’agit d’un choix délibéré de leur part et il convient de se poser la question de savoir si ils font vraiment partie de la cible de notre projet et si par conséquent il est opportun de dépenser une fortune pour rendre notre application compatible avec ce navigateur en sachant que le ROI n’est absolument pas assuré. Cette cible et son coût d’acquisition intéresse-t-elle vraiment notre client ? Je ne crois pas tant les coûts de mise en compatibilité deviennent exorbitants avec la complexification des applications web.
2. nous avons un devoir d’éducation, au sens pédagogique, envers les internautes. Il convient de leur fournir un produit de qualité, respectueux des standards (et j’y tiens) et interopérable. En cela les démarches de plusieurs entreprises du web sont assez condamnables. Plusieurs ne se sont d’ailleurs pas privés… non, je ne donnerai pas de nom On pourra citer sans fournir un classement mais juste un pêle-mêle :
   • Apple et l’iphone pour sa fermeture et son contrôle du marché des applications par l’AppStore bridant ainsi l’innovation et la créativité des développeurs
   • Microsoft pour son retard incroyable avec les standards sous IE8 et sa faculté à répondre à un marché plus qu’à une compatibilité… mais ils se soignent… paraît-il
   • Apple qui s’offre une deuxième entrée dans la liste pour son brevet et, donc, sa demande de royalties sur la mise en place des mises à jour sur les widgets et qui bloque la normalisation de « Widgets 1.0: Updates ». Le W3C lance d’ailleurs un appel pour trouver des utilisations antérieures à ce brevet pour l’invalider.

   D’ailleurs, c’était assez comique de voir tous ces évangélisateurs d’un web ouvert avec leur iphone et autre Macbook pro… crédible ?

   Mais avoir une action pédagogique ne signifie pas simplement de fournir un produit aux standards mais également orienter l’utilisateur final vers une interface qui lui offre la bonne (sinon la meilleure) expérience utilisateur. On en revient à l’infatigable débat sur IE6 qui gangrène les développeurs web depuis 11 ans et qui continue à brider l’innovation technologique des applications web :  le lissage par le bas ! Un des leitmotive de ce Paris Web 2009 fût donc l’abandon pur et simple d’IE6. Oui… facile à dire ! Cependant la réalité du marché est celle qui nous fait vivre, on ne peut pas encore dire à nos clients qu’on ne supportera pas ou peu (mode dégradé)  IE6 dans l’application qu’on est en train de lui construire sans qu’il y ait des grincements de dents.

L’avenir des standards nous promet de belles choses. La conférence de Tristan Nitot et de Paul Rouget fût à ce point magistrale que tous les geeks présents en furent bluffés. En effet, hormis le sketch bien huilé de 2 personnes qui se respectent et s’admirent mutuellement, la démonstration technologique HTML5/CSS3 (certes sur un Firefox 3.7 en pré-alpha) a scotché l’ensemble de l’assemblée : détection de l’accéléromètre dans le navigateur, filtres CSS sur des vidéos et sur du canvas 3D… Ces technologies laissent augurer d’un web plus puissant, plus interactif et plus ergonomique… que du bonheur !

Pour conclure : une manifestation excellente en tous points. Par des professionnels, pour des professionnels. Le seul regret que je puisse y voir, c’est qu’il faille attendre une année pour y retourner et recharger les batteries !

En tout cas, une superbe présentation de la boite à outils magnifique que nous avons maintenant entre les mains… à nous de jouer !

Pour finir, quelques bonnes photos http://www.flickr.com/groups/parisweb2009/

D’ailleurs, je lance un appel à tous pour savoir si il y aura des compte rendu des ateliers du samedi. Plusieurs m’intéressent mais je ne pourrais malheureusement pas rester le samedi.

Au plaisir de vous y voir !

Spotify est un service de musique en streaming. Il s’agit d’un client à télécharger pour Windows (et également pour Mac)  qui vous permet de chercher, naviguer et écouter un catalogue assez étendu de musique. Bien que naissant, le catalogue de Spotify s’étoffe quasi quotidiennement en témoignnent les informations sur leur blog.

J’ai actuellement 6 invitations pour la beta privée de Spotify pour les lecteurs de Web intention. Si vous êtes intéressé, laissez un commentaire avec une adresse mail valide. Seuls les 6 premiers seront servis, en attendant la sortie de la beta privée ou de nouvelles invitations.

Bien sur, ici point de possibilité d’enregistrer les fichiers écoutés mais cela n’a vraiment aucune importance tant l’expérience utilisateur est agréable et à la hauteur des espérances qu’on peut légitimement placer en lui. D’ailleurs, les critiques concernant Spotify sont vraiment unanimes (TechCrunch Fr ou ZDNet). Ce service semble avoir un avenir radieux. Il proposer un réelle valeur ajoutée par rapport à Deezzer ou Jiwa tant et si bien qu’il pourrait détourner une par non négligeable de téléchargeurs illégaux et occasionnels vers la voix de la raison. On peu en effet partager un morceau avec un autre utilisateur grâce un lien. Cerise sur le gâteau, il est même possible de partager une playlist avec un ou plusieurs utilisateurs où chacun pourra ajouter ses propres morceaux. Excellente initiative pour les playlists entre amis ou collèges de travail.

Spotify est-il la kill-app musicale de 2009 et qui va faire de l’ombre à Deezer ?

A l’heure où Deezer semble prendre ses utilisateurs pour des idiots, Spotify a une réelle carte à jouer. En effet, depuis le 9 février et sous la pression des ayants droits, Deezer a mis en place (entre autres) l’inscription obligatoire. Bon, jusque là, rien d’exceptionnel sauf que c’est pour mieux vous géolocaliser, mon enfant ! Du coup, certaines chansons deviennent inaccessibles. Deezer : -1.

Bonus : SpotyShare un service complémentaire qui  permet de partager en quelques clics ses playlists Spotify.

A venir sous peu, une amélioration importante, l’ouverture à la communauté. En effet, il sera possible à tout développeur de commenter les fonctions. On attend ça avec impatience.

A bookmarquer d’urgence pour tous ceux qui rencontrent jQuery dans leur projets et qui souhaitent aller plus loin avec cette puissante bibliothèque.

http://jquery.jarodxxx.com/

Amis lecteurs, bloggeurs de tout poil, rendez-vous ici pour répondre à la dizaine de questions proposées par Fred.

Je ferais un petit billet début janvier pour analyser les résultats de cette enquête.

Vous avez déjà remarqué que tout bon service web 2.0 ready vous offre la possibilité d’inviter vos contacts en se connectant à vos fournisseurs webmails. Cette méthode est  plus que rependue dans les services sociaux avec parfois des dérives (on se souviendra notamment du cas Quechup).
OpenInviter est une classe PHP open source écrite en PHP5, qui pemet d’importer des contacts d’une grande majorité de fournisseurs mails (Gmail, Yahoo!, Hotmail, etc.) et de réseaux sociaux (Flickr, Xing, Twitter, LinkedIn, Flixster, Facebook, etc. bientôt Youtube et ICQ) .

Il est prévu pour être intégré à des plateformes existantes (Drupal, WordPress, Joomla, Social Engine, etc.) mais aussi sur des développements spécifiques grâce à des packages adaptés. Le script ne requiert pas de base de données mais cURL (pas de libcurl à installer) ou wget.

Chose un peu étrange, il nécessite de s’inscrire pour obtenir une clé d’activation qui est à renseigner dans la config du script. Il semblerait que cette clé serve simplement à communiquer avec le serveur d’Open Inviter pour les updates de script et l’envoi de bug si l’option est choisie dans la configuration.

via Freetools

Les possibilités semblent impressionnantes, on peut ajouter toutes sortes de média :

• contenu de référence (Wikipédia, CrunchBase, IMDB, Amazon…)
• vidéo (YouTube, Vimeo, Metacafe, Veoh…)
• images (Flickr, Wikipédia, Yahoo search, ainsi que le vôtres)
• audio (imeem)
• news (Washington Post, BBC…)
• cartes (Google Map)
• documents (grâce à Scribd)

La vidéo est éloquente et démontre la simplicité d’utilisation d’Apture.

Cliquer ici pour voir la vidéo.

On peut mettre un contenu non invasif, « à la Snapshot », par le biais d’une bulle apparaisant avec le contenu choisi ou directement dans le contenu en insérant et, éventuellement en redimensionnant, l’élément multimédia inséré.

Le rendu est du plus bel effet et l’ergonomie est bien pensée. Sans tomber dans l’overdose de contenu riche à tout va, on peut largement s’appuyer sur ce plugin pour enrichir subtilement un article ou un dossier.

via Techcrunch fr

Il est très facilement personnalisable et paramétrable via javascript ou un autre Flash :

• playlists
• fullscreen
• streaming
• progressive download (comme le font Dailymotion ou Youtube)
• protection contre le hotlinking (lien direct sur la vidéo)
• couleurs
• barre de lecture apparente, transparente ou invisible
• …

Bref, beaucoup de possibilités pour paramétrer ce lecteur.

L’installation est très simple :

et de lancer la reconnaissance du player (ici dans une <div id= »mon_player »>)

%MINIFYHTMLc065b7f27d964985de349022fc21fba10%

Pour plus d’informations sur la mise en place, la documentation de FlowPlayer est très bien fournie.

Concernant les licences, c’est une licence GPL avec les restrictions d’usage (affichage du logo, de la source…) ou une licence commerciale (75$ pour un site et 350$ pour une utilisation sans restriction).

Qu’en pensez-vous ? Avez-vous d’autres ressources sur ce genre d’application ?