Score parfait de 100 ! Un environnement ultra-rapide pour l'accessibilité web : un feu d'artifice pour Lighthouse !

Maîtrisons l'accessibilité web !

« Nous avons des experts frontend et en balisage de niveau S, et on fait même l'interface d'outils MA, donc l'accessibilité, ça devrait aller tout seul ! » C'est avec cette idée naïve que le projet d'accessibilité web de Liberogic a débuté… En réalité, ce fut le début d'un combat épique. Avoir visé la conformité totale aux WCAG 2.2 a entraîné des années de séances d'étude et de discussions sans fin. Pour être honnête, nous avons pris conscience que nous l'avions sous-estimé.

Il y a quelques années, lors d'une séance d'étude sur l'accessibilité au début du projet,
« Quelle est la différence entre les WCAG et la norme JIS X 8341-3:2016 ? »
« Les WCAG 2.0 et la norme JIS X 8341-3:2016 sont identiques ! »
Ce genre d'échange élémentaire a marqué le début d'un long, très long chemin.
« Est-ce que cette notion de critère de réussite se comprend bien ainsi ? »
« Non, ça, c'est le critère de l'autre référentiel. »
Après d'interminables débats et corrections, nous avons enfin pu viser le niveau de conformité AA des WCAG 2.2.

Refondons notre propre site web !

« Notre site web ne correspond-il pas à notre activité ? »
C'est sur cette simple remarque qu'a commencé la refonte de notre site.
« Autant y mettre le paquet sur l'accessibilité et le SEO ! »
Inutile de dire que nos collaborateurs, pourtant très occupés, se sont (sans doute) volontiers attelés à la tâche.

« Ce contraste de couleur ne respecte pas le ratio requis ! »
« Hmm, sur le plan du design, c'était pourtant bien… »
« Est-ce qu'on ne peut pas ajuster dans les règles ? »
Et ainsi de suite : nous avons tâtonné entre design et accessibilité.
Côté balisage, nous avons méthodiquement coché une checklist de tests redoutable.

Enfin terminé ! 
Bien qu'il ait pris un retard considérable par rapport au planning initial, nous avons ressenti une réelle satisfaction face aux avancées techniques.

100 points obtenus sur Lighthouse, et d'excellents résultats sur PageSpeed Insights aussi !

Notre site, réalisé avec Astro, microCMS et Cloudflare, obtenait naturellement un score élevé dans Lighthouse. L'accessibilité était bien sûr à la hauteur ! Le test d'accessibilité de Lighthouse repose sur axe-core, un moteur fiable, ce qui fait que les efforts en faveur de la conformité WCAG sont évalués de manière assez directe.

En matière de performance, le site comporte de nombreuses images et plusieurs animations. Les premiers résultats ont donc stagné un peu, mais après de nombreux réglages laborieux (optimisation du chargement des polices web, révision du taux de compression et du format des images, ajustement de la priorité de chargement des ressources), le moment tant attendu est enfin arrivé !

＼ 100 points ! ／

Tous les critères du Lighthouse version PC affichent le score maximal ! Et la rumeur était vraie : « Oh là là ! Si l'on obtient 100 partout dans Lighthouse, Google nous offre un feu d'artifice de félicitations ! »

« Incroyable ! Avant, notre ancien site atteignait tout juste les 80 à 90 points. Astro y est peut-être pour quelque chose, mais c'est tout de même impressionnant ! »

Sur PageSpeed Insights, l'outil de mesure des performances de sites web également proposé par Google, nous avons naturellement obtenu 100 points.

Cependant, PageSpeed Insights ne propose pas de mise en scène spéciale (feu d'artifice). Comme nous avons enchaîné les scores de 99 et de 100, nous souhaitons que Google ajoute une petite animation de félicitations. 🎇

Au passage, les scores de Lighthouse et de PageSpeed Insights varient selon l'environnement réseau, l'état du serveur et la situation du navigateur au moment de la mesure. Même si nous avons atteint 100 points, il est donc utile de noter qu'il n'est pas toujours possible de maintenir ce score.

Atteindre 100 points de performance sur mobile, est-ce vraiment mission impossible ? Voilà ce que cela donne. (↑ Capture récente, car je n'avais pas fait de capture à l'époque.)

Le véritable objectif se trouve au-delà du score.

« Non, mais c'est logique, non ? Si l'on se place du point de vue des utilisateurs, c'est bien le résultat attendu... ? »

Plutôt que de courir après le score, nous avons poussé la conception pour toutes les personnes qui utilisent réellement le site, et je pense que c'est ce qui a permis d'obtenir cette excellente évaluation. « Score 100 » n'est qu'une étape. Le véritable objectif est de créer un site web agréable et facile à utiliser pour tout le monde !!

Actuellement, nous mettons en œuvre diverses fonctionnalités expérimentales afin de vérifier la faisabilité de nos projets, et les scores Lighthouse ont baissé par rapport à l'époque. Je répète naïvement « Pourquoi, pourquoi ? », mais il va sans dire que, pour tout le monde, la vérification de la faisabilité des projets compte davantage que mes caprices.

C'est ainsi que notre quête inlassable se poursuit.