Refonte du site Drupal de l’Anact : entre centralisation et indépendance des agences régionales

L’agence Nationale pour l’Amélioration des Conditions de Travail nous a confié la refonte complète de son site internet avec Drupal 10. L’enjeu du projet : concevoir un site unique pour l’Anact et ses agences régionales tout en donnant à voir les spécificités de chaque antenne (actualités, productions, ressources). On vous raconte.

L’Anact est un établissement public qui œuvre à l’amélioration des conditions de travail

Il diffuse des méthodes et outils d’accompagnement à destination des acteurs du dialogue social et des directions des TPE/PME. L'Anact pilote un réseau de 16 agences régionales (ARACT) ainsi que des structures départementales (ODDS).

Découvrir le nouveau site de l'Anact

Une collaboration fructueuse qui se poursuit

Avec l’Anact, nous commençons à bien nous connaître !

Nous assurons déjà la maintenance du site depuis plusieurs années ainsi que celle de l’usine à sites de ses ARACT (9 sites régionaux).

Par ailleurs, nous avons réalisé l’année dernière le site espace-odds.fr, un centre de ressources Drupal qui vise à mutualiser les outils du dialogue social produits par les antennes départementales de l’Anact.

Nous venons également de mettre en ligne la plateforme d'autodiagnostics de l'Anact permettant aux TPE/PME d'évaluer leurs pratiques internes et d'identifier des axes d'amélioration. Pour aller plus loin, vous pouvez consulter notre étude de cas.

Fruit de plusieurs collaborations web fructueuses, nous avons noué une relation de confiance pour laquelle nous sommes reconnaissants. C’est pourquoi nous sommes très heureux d'avoir réalisé cette refonte de leur site principal anact.fr.

Centralisation de la communication digitale, mise en avant de ses services et ressources

Ce projet de refonte répond à plusieurs objectifs :

  • Centraliser la communication et les productions de l’Anact et de ses structures régionales (ARACT), qui jusqu’ici étaient dissociées, au sein d’un même site.
  • Améliorer la lisibilité de son offre de service, notamment la formation et les dispositifs d’accompagnement.
  • Valoriser ses réalisations en région et ses services de proximité.
  • Permettre l’achat de ses ressources payantes.
  • Encourager la consultation de ses canaux digitaux (newsletters, réseaux sociaux, sites dédiés, etc.).
  • Donner à voir la mission de l’agence, à travers des réalisations et projets en cours.

Avec ce nouveau site, l’Anact espère augmenter son audience, fidéliser et transformer davantage. Pour cela, plusieurs axes d’amélioration ont été identifiés, notamment :

  • Des parcours usagers plus adaptés et lisibles.
  • Une volumétrie de contenus moins dense et mieux ciblée.

Au programme : conception de l'expérience utilisateur, développement Drupal, hébergement et maintenance du site

Notre accompagnement :

  • Pilotage du projet.
  • Conception de l’expérience utilisateur (UX design).
  • Conception des interfaces graphiques (UI design).
  • Développement front et back-end avec une reprise des contenus de l’ancien site et des sites des Aract (9 sites).
  • Contrôle qualité et la mise en ligne.
  • Hébergement.
  • Maintenance.

Au-delà de la refonte, nous avons également réalisé :

  • Un rapport de performance.
  • Un accompagnement au référencement naturel (SEO).
  • Une attestation de conformité au RGAA pour l’accessibilité numérique.
  • Une session de formation à l’utilisation du back-office afin d’autonomiser les équipes de l’Anact.
  • Le passage de Google Analytics à Matomo, une solution open source de suivi statistiques.

Une expérience utilisateur fluide

Après un benchmark UX visant à analyser l’ergonomie et la structure de sites semblables, nous avons réalisé l'arborescence et les différents parcours utilisateurs du site.

Le menu de navigation proposé par nos UX designers reflète bien les objectifs de l’Anact. 
Il se compose des entrées suivantes :

  • Actualités
  • Ressources : en téléchargement libre ou payant avec possibilité de recherche et de tri.
  • Services : aides et dispositifs de formation et d'accompagnement de l'Anact  avec la possibilité d’acheter des produits payants.
  • Thèmes : consultations de contenus via une entrée par thème (télétravail, management, sexisme, absentéisme…).
  • Cas d'entreprises et projets
  • Décryptages : pour une approche approfondie des thématiques liées au travail.
  • En région : espaces dédiés à chaque région (ARACT) comprenant une présentation, leurs actualités, leurs produits et offres de services. 
  • L’Anact : présentation de l’établissement et de ses missions.

Comme sur le précédent site, nous avons intégré un onglet compte membre / compte client permettant le téléchargement de contenus, l’achat de produits, la consultation de son historique client, la gestion de ses abonnements (newsletters).

L’interface du site conforme au système de design de l’État

En tant qu’établissements publics, l’Anact doit se conformer au design système de l’État (DSFR), une bibliothèque de composants graphiques prêts à l’emploi, à disposition des designers et des développeurs afin d’aboutir à une interface commune pour tous les sites rattachés à l’Etat. Il garantit également le respect des normes d'ergonomie, d’accessibilité et les bonnes pratiques HTML-CSS.

Désormais accoutumés au DSFR, nous avons créé le bluedrop.fr DSFR kit. Il se compose d’un starter theme Figma (notre outil d’UI design) et d’un starter theme Drupal (notre CMS). Un starter theme fournit une structure de départ avec une configuration de base, des styles CSS et des templates préconfigurés tels que le header, le footer, la navigation… Il est conçu sur la base des composants définis par le DSFR et nous permet de gagner du temps sur tous nos projets basés sur le DSFR.

En savoir plus

Développement Drupal 10 avec le module Drupal Commerce et liaison avec le CRM de l’Anact

Afin de permettre l’achat de contenu, nous avons intégré le module Drupal Commerce (déjà utilisé sur l’ancien site). Pour rendre la nouvelle version compatible avec Drupal 10, un travail d’adaptation a cependant été nécessaire. Plusieurs modifications ont donc dû être réalisées à l’issue d’arbitrages concertés entre nos équipes et l'Anact.

De la même manière, nous avons repris/conservé le lien entre le site et le CRM de l’Anact (E-deal) pour que les informations récoltées sur le site puissent être récupérées par le CRM (inscription à la newsletter, création d’utilisateurs, remplissage de certains formulaires).

Accessibilité numérique : 98% de conformité au RGAA

En tant qu’établissement public, l’Anact est soumise à des obligations légales en matière d’accessibilité. C’est pourquoi nous avons déployé toutes les bonnes pratiques relatives à l’accessibilité numérique (balisage des titres, description alternative des médias, navigation au clavier, contrastes des couleurs, etc.). Nous avons également conduit un audit RGAA. Le site a obtenu la note de 98 % de conformité !

Encore un grand merci à L’Anact pour leur confiance et leur collaboration . Bravo aux équipes qui ont réalisé le projet !

Un projet web avec Drupal ? Des questions sur l’accessibilité ou le système de design de l’État ?

Parlons-en ! N’hésitez pas à nous contacter, nous serons ravis d’en apprendre plus sur vos projets et de répondre à vos questions !

URL du site : https://anact.fr/
Date du projet : octobre 2023 - mars 2024
Mise en ligne : juillet 2024

Pour aller plus loin…

Quelques projets avec le système de design de l’État :

  • Le site des Observatoires du Dialogue Social (ODDS), un espace de partage de ressources sur le dialogue social dans les petites et moyennes entreprises : 96 % de conformité au RGGA.
  • Le site limitesmaritimes.gouv.fr, portail des limites maritimes officielles françaises : 96 % de conformité au RGGA.
  • Le site refmar.shom.fr, le portail d’observation marégraphique français : 97 % de conformité au RGGA.

Refonte du site principal de l'Anact

Pour plus d’informations, vous pouvez consulter notre étude de cas sur le sujet.

Je voulais te remercier personnellement pour ton support sur la phase de bascule du nouveau site internet de l'Anact vendredi dernier ! Te remercier aussi plus généralement pour ton implication quasi-quotidienne dans les relations Anact/bluedrop.fr, toujours réactive, professionnelle et bienveillante sur nos nombreux projets et activités. Un partenariat qui dure maintenant depuis quelques temps et qui nous semble extrêmement productif et surtout qualitatif ! 

Alexandre Roland Chef de projet