Que signifie éco-conception ? Comment et quand l’appliquer ? Avec quels outils ?
👉 Ce live répond à toutes les questions que vous vous posez concernant les démarches d’éco-conception d’un site WordPress à travers le témoignage de l’ADEME (Agence de la transition écologique).
👥 Avec les intervenants suivants :
Julie Deshusses, Chargée de communication de l’ADEME
Jean-Baptiste Audras, CTO Whodunit
Eddy Boels, Customer Happiness Manager chez Whodunit
Ademe.fr : quelle démarche d’éco-conception pour la refonte du site ?
Les enjeux de l’éco-conception
L’éco–conception consiste à prendre en compte l’environnement dès le début de la conception du site. Elle a pour objectif de réduire les impacts environnementaux.
La question de l’éco-conception s’est donc posée à tous les niveaux du projet.
Le nouveau site ADEME se voulait éco-conçu avec comme priorité la sobriété. La réflexion autour des besoins a dont été très présente.
📂 Exemple illustrant cette sobriété : La page d’accueil de l’ADEME propose un lien vers la vidéo de présentation hébergée sur Youtube, elle n’est ni en pleine page ni en déclenchement automatique. La page pèse 2Mo.
En terme graphique ce choix donne le ton.
Parmi les enjeux, il a fallu simplifier le contenu, le penser de manière sobre, aller à l’essentiel.
Penser économie d’énergie oui mais pas seulement technique. L’ancien site était très fourni en contenus.
L’ADEME a travaillé avec la Netscouade sur la stratégie du site, pour réfléchir à un contenu fort, clair et accessible, important pour un organisme public et sur la partie technique avec Whodunit et une équipe de Digital4better
Les étapes pour réaliser un site éco-conçu
Définir les objectifs
Il est important de rappeler que l’ADEME a toute une galaxie de sites dont la plateforme agir, un site dédié aux journalistes, un site magazine, une librairie…
L’idée était donc de commencer par réfléchir à la raison d’être de chaque élément et sa pertinence.
La solution trouvée d’un point de vue éditorial a été de faire du site institutionnel un tremplin vers tous ses autres sites plutôt que de multiplier le contenu.
Le site va donc chercher les contenus chauds sur les différents sites de l’ADEME qui eux sont plus légitimes pour héberger ces infos et les stocker. Et reprendre des flux depuis ces sites en synthétisant au maximum les infos sur le site principal.
Ce qui implique peu de mises à jour (on concentre l’énergie sur les MAJ des sites déjà existant)
Comment mesure-t-on l’éco-conception ?
Les outils
Pour l’ADEME, il était prévu de faire tourner dès le départ l’outil Frugr qui permet de mesurer les performances d’environnement. Ce dernier évalue automatiquement l’empreinte digitale sur trois KPIs d’impact : Carbone, Social et Éthique. Il suffit de le connecter au site et il va donner des scores.
Il existe également d’autres outils comme Google PageSpeed qui va donner un score de performance donc lié aussi à l’éco-conception.
On peut en citer d’autres comme Gtmetrix, Yellow Lab ou encore Lighthouse.
Tous ces outils sont des outils de mesure quantitative à l’instant T.
Pour aller plus loin, il ne faut pas hésiter à mettre son nez dans les Core Web Vitals
En savoir plus sur les outils pour mesurer l’éco-conception
Les référentiels
A la différence de l’outil, le référentiel va donner un cadre qualitatif dans lequel le site va s’inscrire.
A la fin du projet, Temesis a contacté l’ADEME pour faire un audit RGESN, Référentiel général d’éco-conception de services numériques. L’audit a été fait à postériori pour parfaire la démarche mais il est conseillé de s’appuyer dessus dès le départ pour avoir des critères au commencement du projet.
Un audit d’accessibilité a également été fait, le RGAA, Référentiel général d’amélioration de l’accessibilité.
💡 Les deux référentiels cités ci-dessus s’adressent à tous, aux grands sites institutionnels comme aux blogs. Ils doivent accompagner la vie du projet.
Bon à savoir : actuellement le RGAA est obligatoire pour les sites d’organismes publics.
La position de WordPress sur l’éco-Conception
La performance est le premier outil technique qui s’utilise indépendamment des contenus éditoriaux ou de la pertinence des services ou du site.
WordPress a donc tout naturellement une équipe “Performance”.
Elle mesure le poids, les performances de chaque version par rapport aux versions précédentes en se basant sur des données métriques.
WordPress propose l’outil de santé du site, le point névralgique de toutes les améliorations de performance. Ces améliorations se font notamment à l’aide d’éditeurs comme Yoast qui contribuent beaucoup à WordPress.
Ce qui va faire la différence entre les CMS, ce sont finalement les extensions que l’on va utiliser.
Par exemple, nous travaillons beaucoup avec les extensions WP Rocket ou Imagify qui sont des extensions de performance, qui vont agir au niveau quantitatif et gérer l’optimisation des ressources.
En savoir plus sur WordPress et l’éco-conception
Qui sont les intervenants du projet, comment s’est organisé le travail ?
Intervenants ADEME
Ademe.fr avait un planning très serré puisque la mise en ligne était prévue pour mars 2022, de façon à célébrer les 30 ans de l’agence.
En interne, le projet a mobilisé le service communication grand public mais aussi la direction technique.
La première partie du travail a été la conception et la réflexion sur le contenu. Elle a débuté avec la Netscouade mi 2021.
N’ayant que peu de compétences sur la partie technique, l’Ademe s’est appuyée sur Whodunit pour la 2ème partie du développement, la partie technique.
A noter qu’un autre prestataire est rentré dans la boucle une fois le site mis en ligne, il s’agit de Golive. Spécialisé dans l’intégration de contenus, avec un oeil poussé sur l’accessibilité.
💡 Constat : Impliquer le prestataire d’intégration de contenus le plus tôt possible dans le projet.
26 bonnes pratiques pour bien rédiger ses contenus pour le Web
Découvrez notre check-list basée sur une sélection de critères du Référentiel Général d’Amélioration de l’Accessibilité (RGAA), du Référentiel Général d’Eco-conception des Services Numériques (RGESN) et de règles Opquast.
Whodunit utilise les informations fournies afin de vous proposer du contenu pertinent sur nos services et actualités. Vous pouvez vous désinscrire de nos communications par mail à tout moment. Pour plus d’informations, consultez notre politique de confidentialité.
Intervenants Whodunit
Chez Whodunit, lorsqu’une date de sortie est fixée à l’avance et qu’elle est immuable, le projet est baptisé projet “Commando”.
Dans ce cas, notre CTO Jean-Baptiste, est partisan de l’école minimaliste, avec équipe resserrée sur la technique :
2 développeurs, l’un frond end et dynamisation Gutenberg et le second chargé des développements spécifiques.
Ils sont bien-sûr accompagnés d’un chef de projet.
Dans le cas précis de l’ADEME, l’équipe a pris le temps de discuter chaque maquette, d’analyser, d’orienter sur un rythme de sprints de 15 jours. C’est-à-dire, une restitution tous les 15 jours pour suivre ce qui a été fait en termes d’éco-conception, accessibilité, RGPD…
Grâce à cette méthode de travail, on constate moins de recettes (correctifs), partie non négligeable du projet et qui doit être anticipée.
👀 Points d’attention
- Faire attention aux choix éditoriaux
- Faire attention aux optimisations des contenus multimédias
- Faire attention aux polices typographiques
- Prévoir une gestion du cache
- Réfléchir à l’hébergeur
- Faire attention aux animations
Le bilan
Au final, le projet aura duré une année.
L’ADEME est très content du site et n’a pas perdu en nombre de visiteurs.
L’on retiendra qu’il est important de prendre en compte l’éco-conception dès le début du projet et de s’appuyer sur des prestataires qui ont de l’expertise.
Enfin, suite aux audits, on réalise aussi que l’on peut toujours aller plus loin et arriver à un site très sobre.
Un site respectant des critères d’écoconception et d’accessibilité, dans un délai court !
“Nous avions besoin de développer un site respectant des critères d’écoconception et d’accessibilité, dans un délai court ! L’équipe Whodunit a su y répondre avec une grande disponibilité, de la pédagogie et beaucoup d’efficacité. Ils ont aussi su travailler avec les nombreux interlocuteurs internes à l’ADEME comme avec nos autres prestataires impliqués. »
Julie Deshusses
Chargée de communication institutionnelle Service Mobilisation Citoyenne et Médias
