Paris Web 2017

- Article co-écrit par Morgane M. & Mathieu B.

Cette édition avait pour thème "un web responsable".

Tout d’abord, Paris Web qu’est-ce que c’est ?

Paris Web est une conférence annuelle basée à Paris (Bois-Colombe cette année) qui rassemble des artisans du web autour de sujets touchant aux technologies du web, au design, à l’accessibilité, aux développements...

Comment fonctionne cet événement ? Les conférences sont réparties sur deux amphithéâtres, un grand, un petit et des informelles (confs non programmées) peuvent se passer au même moment.

Le planning de cette édition 2017 : - https://www.paris-web.fr/2017/conferences/

Et quelques liens pour que vous puissiez regarder les confs : - La page Youtube de Paris Web - Un repo GitHub retraçant les vidéos sur les 2 jours.

Introduction

- Crédit : Flick Paris Web avec retouche de Mathieu :)

Cette année, alterway a envoyé deux de ses intégrateur•trice•s (Morgane M. et moi-même (Mathieu B.)). Nous avons eu la chance d'assister à l'édition 2017 et entre deux conférences et pauses, partir à la rencontre des gens qui font le web.

Pour nous, c'est une vraie chance d'être à cet évènement car peu sont les conférences aussi riches, aux sujets variés et aussi accessibles. En effet, l'accessibilité est dans l'ADN de Paris Web car les conférences sont traduites en L.S.F (Langue des Signes Française) et en vélotypie. Pour comprendre le sujet, je vous conseille cette conférence sur la L.S.F (https://www.paris-web.fr/2015/conf-surprise.php) et vous comprendrez tout le travail que cela représente.

Pour continuer, la contre-partie de notre présence à Paris Web est la rédaction d'un compte-rendu (chose que vous être en train de lire).

Des idées pleins la tête...

À la fin de ce genre de conférence, on revient souvent avec des idées pleins la tête, comme par exemple sur l'amélioration des process, des techniques de performances, la communication entre les équipes et les managers, comment notre métier peut changer les choses etc. Mais surtout, l'envie de partager avec ses collègues tout ce qu'on a vu.

C'est pourquoi on va tenter de le faire à travers cet article.

Spoiler alert : Vu qu'on est deux intégrateur•trice, y a pas mal de confs qui parlent de front, de CSS, d'accessibilité, d'UX, d'UI... mais pas que... y a aussi de la protection de la vie privée numérique et du Green IT.

Notre programme sur les 2 jours

Le jeudi matin :

1 . Accessibilité je t’emmènerai jusqu’au bout du back - Julie Moynat - 45 min

Vidéo : https://youtu.be/QZxWHZE02ag?t=01s

Julie Moynat partage son retour d’expérience sur le nouveau site de l’association BrailleNet où le back-office de Wordpress devait être accessible. En effet, on s’occupe généralement du front-office mais on néglige le back. Elle nous montre les limites du code cœur de Wordpress ainsi que des plugins utilisés comme ASP ou ... Pour finir, elle nous présente les solutions qu’elle a mise en place pour corriger (ou pas).

2 . Je prends en main ma vie numérique... Et c’est pas si facile ! - Delphine Malassingne - 15 min

Vidéo : https://www.youtube.com/watch?v=QZxWHZE02ag&t=39m0s

Delphine Malassingne nous parle ici d’hygiène numérique et comment mettre en place de bonnes pratiques simple et rapide pour avoir un vie numérique plus sécurisé mais le chemin n’est pas toujours évident.

3 . Expliciter l’implicite, je veux juste un site web - Sylvain Abélard - 15 min

Vidéo : https://youtube.com/watch?v=QZxWHZE02ag&t=57m0s

4 . La revue de code (bienveillante) - Gilles Roustan - 45 min

Vidéo : https://youtube.com/watch?v=QZxWHZE02ag&t=1h31m10s Support : https://www.paris-web.fr/2017/media/PW2017-La-revue-de-code-bienveillante.pdf

Gilles Roustan, lead dev chez Mediapart nous explique ce que doit être une revue de code, comment faire pour qu’elle se passe bien, comment l’équipe doit communiquer pour éviter les conflits, les frustrations etc.

La revue de code est typiquement ce qui va mettre l'égo du développeur à rude épreuve. Pourtant c'est un passage nécessaire afin d'apprendre de la critique et surtout ce n'est pas quelque chose à prendre personnellement.

Ce dont il faut prendre conscience, s’est que le code appartient à l'équipe (non à une personne) et pour qu'une erreur devienne une opportunité d'apprentissage pour chacun, il faut garder à l'esprit plusieurs points essentiels dont :

• JUSTIFIER : expliquer le commentaire et le justifier. Le simple non respect des bonnes pratiques n'est pas une raison à elle seule. Il faut être capable de trouver une bonne raison de faire de cette façon plutôt que d'une autre, voir proposer une alternative.

• PARLER / ÉCOUTER : avoir une lecture active et ne pas hésiter à parler directement aux personnes concernées. L'objectif de la revue de code ne doit pas avoir d'impact négative sur le moral, au contraire elle est là pour faire progresser l'équipe. Ne pas hésiter à dire quand c'est bien (via un +1 par exemple) ! Il faut être bienveillant, c-a-d, parler sans blesser la personne car on parle de son code et non d’elle. La bienveillance peut passer via l’utilisation du JE ou du ON à la place du TU. Exemple : je pense que ou on devrait faire une refecto du code, à la place du TU vas faire une refacto…)

Enfin, il faut s’abstenir de faire un commentaire si on n’a pas de proposition alternative. Tout ça dans le sens du « Proposer plutôt de critiquer ».

Pour conclure, l’important est de faire de son mieux en fonction du contexte, transmettre les bonnes valeurs afin de créer un environnement de travail efficace ou tous les acteur•rice•s du projet avanceront dans la même direction.

5 . L’informatique est trop importante pour être laissée aux hommes - Nathalie Pauchet - 15 min

Vidéo : https://youtube.com/watch?v=QZxWHZE02ag&t=2h20m25s Source / transcript complet : http://lunatopia.fr/blog/informatique-trop-importante-laissee-hommes Source : https://www.forbes.com/sites/womensmedia/2014/04/28/act-now-to-shrink-the-confidence-gap/#1b5e86fd5c41

Nathalie Pauchet nous explique comment l’informatique et le monde tech est passée d’une dominance féminine à une dominance masculine dans les années 70 / 80 (80 / 90).

Pourtant une femme postule si elle possède 90% des prérequis d'une offre d'emploi, un homme 60%. C'est important de le réaliser... On traduit : embaucher des femmes !

6 . Souriez (?) #GDPR, #PrivacyByDesign, #PrivacyByDefault deviennent réalité ! - Stéphane Lebarque - 15 min

Vidéo : https://youtube.com/watch?v=QZxWHZE02ag&t=2h38m47s Source : https://www.paris-web.fr/2017/media/PW2017-gdprprivacybydesignprivacy.pdf

7 . UX en agence, 5 ans pour s’y mettre « en vrai » - Nicolas Le Cam - 15 min

Vidéo : https://youtube.com/watch?v=QZxWHZE02ag&t=2h54m28s Source : https://docs.google.com/presentation/d/1FFvASYYfLmHIdb2N6FNIMn0Jb7v9Q1ZGe5a48u47Nk4/edit

Nicolas Le Cam revient sur la transformation numérique que son agence a entreprit pour se tourner vers l’UX. En 5 ans, il nous montre les choix parfois difficiles qu’il faut faire pour y arriver en terme de business. Ce qu’on peut en retenir, c’est qu’il faut former tous les membres de l’équipe, qu’il faut éduquer le client.

Le jeudi après-midi :

8 . HTML re-invented for the age of web apps - Lea Verrou - 45 min

Vidéo : https://youtube.com/watch?v=6sbg2SzArkQ&t=45m0s

Lea Verrou, pointure en CSS et JS, est membre du CSS Working Group et anciennement du W3C (entre autre). Nous fait la démonstration de son outil sur lequel elle a travaillé pendant 2 ans, MAVO. Pour simplifier, il s’agit une librairie JS permettant de coder des applications JS sans savoir coder du JS… Le tout se passe en enrichissant le HTML via des attributs spécifiques.

9 . Les questions oubliées des spécifications : La partie cachée de l’iceberg site web - Sylvie Clément - 15 min

Vidéo : https://youtube.com/watch?v=6sbg2SzArkQ&t=54m10s

10 . « C’est la faute de l’utilisateur » — Où est passée l’empathie de mon équipe ? - My Lê - 15 min

Vidéo : https://youtube.com/watch?v=6sbg2SzArkQ&t=1h14m18s Source : https://www.paris-web.fr/2017/media/PW2017-empathie.pdf

Dans cette mini-conf, My Lê nous montre comment l’empathie d’une « équipe projet » disparaît au fur et mesure de l’avancement d’un projet. Quand celui-ci se passe mal, le syndrome du « j’ai fait mon job » nuit à la bonne réalisation et qualité du projet. Pour contrer ceci, l’oratrice nous donne quelques clefs comme par exemple, faire rencontrer les dev et le client au fur des sprints dédiés pour faciliter la compréhension du besoins trouver des solutions.

11 . Lecteurs d’écran : le choc des titans - Sylvie Duchateau - 45 min

Vidéo : https://youtube.com/watch?v=bXzN0e0oM3E&t=1h34m10s Source : https://www.paris-web.fr/2017/media/PW2017-SylvieDuchateau-LecteursDEcran

Sylvie Duchateau, experte en accessibilité numérique, nous compte l’histoire, l’évolution et nous fait la démonstration des différents lecteurs d’écrans qu’ils existent sur la marché actuellement, leurs forces et leurs faiblesses. Personnellement, je suis toujours impressionné de voir une personne aveugle utiliser une IHM, ceci renforce encore plus l’intérêt que je porte à mon métier (intégrateur web) et la différence qu’un développement accessible peut faire.

12 . Améliorer la Performance : entre réalité et perception - Geoffrey Crofte - 45 min

Vidéo : https://youtube.com/watch?v=bXzN0e0oM3E&t=2h39m30s Source : https://speakerdeck.com/creativejuiz/ameliorer-la-performance-entre-realite-et-ressenti Article : https://www.creativejuiz.fr/blog/tutoriels/ameliorer-performance-entre-realite-ressenti-paris-web

Geoffrey Crofte aborde le thème de la performance ressentie par l’utilisateur•trice. Comment gérer le temps d’attente pour que celui ne se retourne pas contre nous et fasse partir l’internaute. On le sait, la performance web est très importante surtout depuis que Google en a fait un critère de référencement.

13 . Rendez-vous en terre inconnue - Matthieu Bué - 45 min

Vidéo : https://youtube.com/watch?v=bXzN0e0oM3E&t=3h34m35s

Un retour d'expérience ce n'est jamais un exercice facile. Matthieu Bué nous a fait le sien sur un projet qui paraissait trop grand pour lui et comment ses premiers choix ont été décisifs. Il apporte, avec quelques pointes d’humour, des explications techniques qui lui ont été imposé ou qu’il a dû faire. Petit clin d'oeil aux personnes qui pense que le CSS s'est facile et/ou ça libère l'esprit...

Le vendredi matin :

1 . Le Green IT : facteur incontournable pour laver plus vert le web responsable - Christophe Clouzeau - 45 min

Vidéo : https://youtube.com/watch?v=O_V1vjmmDUk Source : https://www.slideshare.net/ChristopheClouzeau/le-green-it-facteur-incontournable-pour-laver-plus-vert-le-web-responsable%E2%80%AC

Vaste et très intéressant sujet sur l'impact écologique du numérique.

"Pensez environnement ! N'imprimez ce mail que si c'est vraiment nécessaire". Qui n'a jamais ce type de signature ? Il est intéressant de se rendre compte que les bonnes intentions ne sont pas si bonne. En effet, aujourd'hui l'idée que le tout numérique est écolo est fausse.

Christophe Clouzeau nous présente via des graphiques, chiffres, tableaux combien le secteur du numérique est consommateur d'énergie (3e "territoire" consommateur d'éléctricité mondial), émetteur à gaz de serre etc.

Toutefois, tout n'est pas si noir. On constate depuis quelques années une prise de conscience du grand public mais aussi et avant tout des grands acteurs du web qui s'engagent de plus en plus dans des démarches vers le 100% énergie verte.

L'avenir nous dira s'ils tiendront leur engagement ou si c'était de simple coup de pub !

2 . Dyslexie, des solutions numériques pour rendre le web plus lisible ! - Nathalie Pican et Séverine Malin - 45 min

Vidéo : https://youtube.com/watch?v=O_V1vjmmDUk&t=52m10s

Les 2 oratrices nous montrent les différents niveaux de DYS.

Les troubles DYS regroupent sous une même dénomination plusieurs dysfonctionnements neurologiques posant des soucis d'apprentissages (dyslexie, la dysorthographie, la dyspraxie, la dysgraphie, la dyspraxie etc.).

Nathalie Pican et Séverine Malin, membres du centre d'expertise E-Accessibility Solutions for Everyone d’Orange, nous explique les tests utilisateurs effectué afin d'améliorer leur outil d'assitance web permettant notamment d'aider dans leur quotidien sur le web les personnes atteintes de troubles DYS.

3 . Design et accessibilité, frères d’arme ou ennemis ? - Julien Dubedout et Aurélien Levy - 45 min

Vidéo : https://youtube.com/watch?v=8n1TDR-8WVE&t=2h26m50s Source : https://speakerdeck.com/judbd/design-et-accessibilite-freres-darme-ou-ennemis

Julien Dubedout (@mariejulien) et Aurélien Lévy (@goetsu) nous montre sous forme de sketch comment un intégrateur et un designer trouvent des « compromis » sur l’accessibilité et la créa d’un site (comme un air de déjà-vu).

Pour résumer : Il faut que les process de design et d'accessibilité montent en amont et échangent ensemble plus tôt dans le projet.

4 . Concevoir des sites et applications web adaptés aux marchés africains - Damien Senger - 45 min

Vidéo : https://youtube.com/watch?v=O_V1vjmmDUk&t=2h54m0s

Le vendredi après-midi :

5 . La décentralisation qui vient - Christopher Talib - 45 min

Vidéo : https://youtube.com/watch?v=R442BQQ82YM&t=5m30s

6 . CSS, tu peux pas test ! - Thomas Zilliox - 45 min

Vidéo : https://youtube.com/watch?v=o9xInoZgZ4o&t=58m15s Source : http://tzi.fr/slides/pw2017/#1

Andres Galante - "Le CSS est tel un petit ourson tout mignon mais qui n'hésitera pas en grandissant à vous manger vivant !"

Cela ne parait pas évident pour tout le monde mais le CSS n'est pas si simple. Il est très difficile de trouver un projet ancien où le CSS n'est pas la partie la plus difficile à maintenir. D'autant plus quand l'équipe est composé de plusieurs développeur front (voir back...)

Dans sa présentation, Thomas Zilliox nous fait rêver d'un monde où il existerait des tests automatiques pour le CSS. Capables d'éviter les régressions, de tester sur tous les navigateurs, sur tous les formats mobiles etc.

En attendant que cela existe, il nous rappelle les bonnes pratiques pour maintenir son CSS au mieux (revue de code, guide de style, communication entre Front et Back etc.)

7 . J'entre dans un magasin

Vidéo : https://youtube.com/watch?v=o9xInoZgZ4o&t=3m20s Support : https://www.paris-web.fr/2017/media/PW2017-J-entre-dans-un-magasin.pdf

Boris Schapira transpose ce qui se passe sur les sites e-commerce dans la vie réelle afin de mettre en lumière les abérations du net via divers exemples. Et nous montrer tout ce qu'on est prêt à accepter ou qu'on a fini par accepter. Ex : Et si les cookies étaient des personnes qui nous suivaient dans la rue.

8 . Échapper au ‘zombie styleguide’ : 3 méthodes pour armer une équipe dans la conception de son styleguide - Thibault Mahe - 45 min

Vidéo : https://youtube.com/watch?v=o9xInoZgZ4o&t=3h09m20s

Les conférences qu’on a pas pu voir mais y a le replay !

1 . L’épopée d’une couleur, par Maryla U.

Vidéo : https://youtube.com/watch?v=8n1TDR-8WVE&t=0m28s Si tu es graphiste, tu vas aimer :)

2 . Let’s Work Together ! - Brad Frost - 45 min

Vidéo : https://www.youtube.com/watch?v=8n1TDR-8WVE&t=3h14m0s

3 . L’accessibilité je numérique à l’ère de l’intelligence artificielle - Elie Sloïm et Denis Boudreau

Vidéo : https://youtube.com/watch?v=iN7b312ZDU4&t=2h1m8s

4 . Designing BBC Account: with BIG DATA comes BIG RESPONSIBILITY - Cyrièle Piancastelli

Vidéo : https://youtube.com/watch?v=6sbg2SzArkQ&t=1h35m10s

5 . The State of WebFonts - Chris Lilley

“Father of SVG”. @W3C staff. Co-developed PNG, @font-face, WOFF. Vidéo : https://youtube.com/watch?v=6sbg2SzArkQ&t=2h44m35s