Paris Web 2016

Événement récurrent du paysage web français, Paris Web rassemblait la semaine dernière pour la 11^e année quelques centaines de participants pour deux jours de conférences et une journée d’ateliers.

Nous étions présents pour les conférences et nous vous proposons un résumé de celles que nous avons le plus appréciées.

Mais avant-tout, faut-il rappeler à quel point l’organisation de l’événement est rodée ? Le lieu est spacieux et agréable (comme en témoignent les quelques photos du Beffroi de Montrouge qui illustrent ce billet), les collations délicieuses, l’équipe Paris Web aux petits soins…

C’est vraiment un plaisir d’être auditeur ici !

Notez cependant qu’à titre personnel, nous avons largement préféré les conférences au format long, qui permettent évidemment de mieux fouiller une thématique, et qui évitent le simple effet « j’aime/j’aime pas » un peu réducteur.

Notez également qu’il ne s’agissait sans doute pas là de l’édition la plus mémorable, mais après 11 ans, il nous semble normal qu’une certaine lassitude s’installe chez quelques participants et évident que certaines années soient un peu en retrait.

Rappelons aussi l’attention toute particulière accordée à l’accessibilité lors de l’événement : traduction simultanée de l’anglais vers le français, vélotypie, langage des signes, lieux accessibles en fauteuil… C’est très impressionnant, en plus d’être en accord avec les valeurs de l’association.

Mais entrons dans le vif du sujet : les conférences qui ont retenu notre attention.

Sur le thème de la vie privée

Anatomie d’une désintoxication au web sous surveillance

Thibault Jouannic a la difficile tâche d’entamer la journée dans le grand amphithéâtre. Pari réussi car il a su dresser un bon résumé de l’état de nos données personnelles.

• Par qui et comment sont-elles exploitées ?
• Que faire pour empêcher cela ?

Thibault a énoncé de bons arguments pour nous inciter à internaliser et à sécuriser au maximum les données de nos utilisateurs, après avoir expliqué clairement le fonctionnement des acteurs de ce marché.

Concrètement, toute requête étant faite par votre site vers un service externe étant une possibilité supplémentaire pour vous traquer.

Un argument intéressant pour choisir :

• d’héberger une police personnalisée,
• de mettre en place un outil d’analyse des visites,
• ou même lorsqu’il faut intégrer un système de cartes.

Sa conférence étant retranscrite, je ne peux que vous encourager à en lire dès maintenant son contenu : Anatomie d’une désintoxication au web sous surveillance : la conférence Paris-Web.

Sur le thème du design et de l’expérience utilisateur

DIY Mobile Usability Testing

Une présentation proposée par Belen Barros Pena et Bernard Tyers qui fut très dynamique et qui nous démontrait (démonstration en direct à l’appui !) qu’il était tout à fait possible de faire des tests utilisateurs sur mobile avec des moyens réduits. Et de démontrer par la même occasion la pertinence de l’exercice.

• Pourquoi faut-il préférer l’utilisation du téléphone personnel des participants ?
• Pourquoi est-il intéressant de tester sur un réseau non-Wifi ?
• Quelles conclusions tirer des tests en environnements réels ?
• Quels matériels adopter pour réaliser au mieux les tests ?

Autant de questions abordées, avec un focus tout particulier sur la dernière, qui est résolue pour moins d’une centaine d’euros avec des Mecano, de la Patafix et une caméra déportée.

Les tests utilisateurs sur mobile sont malheureusement plus difficiles à mettre en place, mais ils n’en restent pas moins extrêmement pertinents.

Suivez le mode d’emploi : Do it yourself mobile usability testing at EuroIA10 : the build.

Quand les militaires se prennent au jeu du design sprint

Retour d’expérience extrêmement détaillé (et bien mené) par Marie-Amélie Cotillon. Dans un contexte (militaire) plutôt particulier, comment mettre en place un design sprint pour fédérer les équipes et répondre au mieux à une problématique.

Jour par jour, étape par étape, Marie-Amélie nous a livré la recette d’une approche collaborative (plus de cinquante personnes !) réussie :

• se focaliser sur l’essentiel et définir un objectif ;
• impliquer les participants ;
• décider d’une solution et s’y tenir le temps du sprint ;
• concrétiser par un prototype, qui sera par la suite affiné.

Un exercice éprouvant, mais centré sur l’humain et qui a fait ses preuves.

Sur le thème de l’accessibilité

Il n’y a pas que class et id dans la vie

Comment améliorer l’accessibilité et la compréhension des CSS en même temps ?

Le dynamisme de Gaël Poupard a été contagieux et son approche, bien qu’à l’inverse des courants actuels, démontrait la puissance des sélecteurs CSS quand ils sont bien utilisés, notamment dans l’environnement back-end.

Gaël a profité de son expérience à construire une feuille de style dédiée à relever les erreurs d’accessibilité. Il en a tiré quelques idées, comme par exemple :

• un sélecteur global qui ne fonctionne que si la langue de la page est renseignée ;
• des sélecteurs d’attributs aria, qui en obligent l’usage, mais qui permettent aussi de mieux en comprendre le fonctionnement.

Toute sa présentation (accessible grâce à AccesSlide) est déjà en ligne : Il n’y a pas que class et id dans la vie.

(Mais ne loupez pas sa vidéo de 15 minutes quand elle sortira.)

Vers l’infini et au delà des référentiels

Toujours sur le thème de l’accessibilité, Éric Gateau et Aurélien Levy, tous deux experts du sujet venaient porter un message salvateur : les référentiels sont limités.

La simple liste de différents critères ne réussit pas à s’affranchir de tous les besoins des utilisateurs.

Aidés par de nombreux exemples ils ont également démontré qu’il était possible de ne pas s’en satisfaire et proposaient des solutions concrètes :

• Comment faire comprendre les design patterns aria aux utilisateurs ?
• Pourquoi faut-il essayer de simplifier les interfaces ?
• Comment résoudre l’effet tunnel dans les menus déroulants ?

Il est important de compléter ces tests techniques par des tests utilisateurs. Et tester avec des utilisateurs en situation de handicap n’en sera que plus bénéfique et révélateur.

Sur le thème du web futur

HTML5.1 + web platform APIs

Charles McCathieNevile et Léonie Watson se sont présentés tous deux avec leurs casquettes du W3C.

Léonie a passé en revue les nouvelles possibilités dorénavant disponibles dans la plupart de nos navigateurs : notifications, prise en charge des contrôleurs de jeux, accès au vibreur des téléphones, capture plus poussée des interactions souris et synthèse vocale…

Le tout accompagné de démonstrations que vous pouvez dès maintenant expérimenter :

• Push Demo ;
• Gamepad API demo ;
• Vibration API demo ;
• Pointer lock demo ;
• Web Speech API SpeechSynthesis interface : tabpanels hints demo.

Charles a quant à lui détaillé côté HTML les évolutions du standard qui tente de consolider ses acquis, à travers des correctifs, des retours en arrière, mais aussi quelques évolutions.

Le tout étant maintenant contribuable sur GitHub, c’est sans conteste un virage important dans la politique du W3C : Working Draft of the HTML specification.

Parmi les points remontés, nous notons particulièrement :

• l’ajout de picture/srcset, la méthode standard et robuste pour faire des images responsives ;
• le grand retour des accesskey, longtemps décriées mais auxquelles on redonne une seconde chance ;
• l’outline des documents est revu (et on revient à l’ancien algorithme) ;
• appcache et <range multiple> sont supprimés (une bonne et une mauvaise nouvelle selon nous) ;
• <option></option> est à nouveau valide ;
• figcaption peut être place à n’importe où dans figure.

Pour en savoir plus, la présentation est elle aussi en ligne : HTML5.1 & Web Platform APIs.

Progressive Web Apps : le futur du web arrive

(Une conférence qui complétait à merveille celle de Bruce Lawson du matin qui expliquait en quoi il était important de ne pas réserver nos développements aux pays occidentaux.)

C’est le sujet chaud du moment et la salle était donc archi-comble. Hubert Sablonnière étant un excellent orateur, nous avions là tout ce qu’il faut pour bien comprendre cette nouvelle façon de développer des sites, pleinement intégrés à nos téléphones.

Après une mise en contexte efficace, Hubert nous a expliqué les mécanismes techniques et tout ce qu’il faut faire pour réaliser une bonne PWA.

Il a su nous expliquer les technologies sous-jacentes (notamment les service workers) ainsi que les enjeux à venir, le tout avec humour : ne ratez donc pas sa future diffusion en vidéo.