Réflechir l’éco-conception

Sur cette page

1. Quels enjeux environnementaux ?
2. Quel rôle pour le designer de service numérique ?
3. L’écoconception de services numériques

Public visé

Ce guide est avant tout destiné aux UX et UI designers. Néanmoins, tout concepteur de service numérique (chef de projet, développeur, product owner…) y trouvera matière et conseils.

Son ambition est de permettre à tout designer, quel que soit son niveau technique, d’initier une démarche d’écoconception. Nous souhaitons que chacun ait des clés pour agir à son échelle et initier une démarche d’écoconception.

Quels enjeux environnementaux ?

Le secteur du numérique a un impact environnemental très élevé :

• En 2020, il représentait 2,1% à 3,9% des émissions mondiales de gaz à effet de serre mondiales (Explications sur l’empreinte environnementale du numérique). Si on fait le parallèle avec le secteur des transports, l’empreinte du numérique se situe entre celles de tous les avions du monde (environ 2%) et de tous les camions du monde (environ 4%) (The Shift Project).
• Sa part d’émissions grossit très vite. L’ADEME estimait qu’elle pourrait doubler d’ici 2025 (estimation antérieure à la crise de Covid-19).
• Outre les émissions de Gaz à Effet de Serre dont on parle beaucoup, les impacts sont massifs sur la consommation de ressources (entre autres les métaux), d’eau, et d’énergie, lors de la phase de fabrication (Empreinte environnementale du numérique mondial).
• Il n’y a pas d’effet de substitution global. On entend parfois que le numérique permet de remplacer d’autres usages plus polluants (transport, biens de consommation…) et serait donc plus écologique malgré son empreinte. Or, depuis l’avènement du numérique il y a 30 ans, les émissions mondiales de gaz à effet de serre ont augmenté de manière exponentielle, malgré la dématérialisation de l’économie promise par le numérique (Publications du GIEC). Les impacts de ce secteur viennent simplement se cumuler aux autres postes d’impact environnemental.

L’écoconception agit sur plusieurs limites planétaires. Ainsi, quand on en vient à parler d’impacts environnementaux, il ne faut pas regarder uniquement les émissions de gaz à effet de serre mais l’ensemble des 9 limites planétaires.

Pour aller plus loin :

• Liste de ressources sur l’empreinte environnementale du numérique

Quel rôle pour le designer de service numérique ?

75 % des impacts environnementaux du numérique proviennent de la fabrication des appareils (ARCEP). Or, leur obsolescence est surtout causée par la couche logicielle : plus un service numérique est lourd, plus il exige des terminaux puissants. En 30 ans, la durée de vie moyenne d’un ordinateur a été divisée par trois (GreenIT.fr). En 2021, 37 % des Français ont remplacé leur smartphone parce qu’il était devenu lent, buggé ou obsolète (Baromètre du numérique).

Le poids médian d’une page web est passé de 14 Ko en 1995 à 2,1 Mo en 2021 (HTTP Archive) : une croissance qui accroît la consommation de RAM et de CPU, et donc le renouvellement du matériel. Réduire cette “obésité numérique” est le principal levier d’écoconception : en limitant les ressources informatiques nécessaires, on diminue l’ensemble des impacts environnementaux et prolonge la durée de vie des équipements.

Les designers, qui interviennent dès la conception, ont ainsi un rôle clé pour réduire ces impacts et lutter contre l’obsolescence du matériel.

L’écoconception de services numériques

L’écoconception est une démarche d’amélioration continue qui vise à limiter les ressources informatiques. Elle intervient à 3 niveaux : terminal utilisateur, réseau et centre informatique (data center). Dans une démarche d’écoconception, on s’intéresse au service numérique dans sa globalité.

Les services numériques englobent les sites web, les applications mobiles, les logiciels, les API, les pilotes logiciels d’un matériel, les systèmes d’exploitation, les systèmes de recommandation…

Un service numérique est constitué de l’ensemble des matériels, logiciels et infrastructures qui permettent de réaliser une action – trouver l’horaire d’un train, consulter le solde de son compte en banque, etc. – au format numérique.

L’écoconception est une démarche standardisée (ISO – IEC 62430:2019).

Appliquée au numérique, elle a pour objectif de proposer de nouveaux services numériques ayant moins d’impacts sur l’environnement tout au long de leur cycle de vie.

L’écoconception est obtenue par une démarche de sobriété. L’impact du numérique sur l’environnement vient principalement de la fabrication des matériels informatiques. En éco-concevant les services numériques (applications, sites web ou encore logiciels), on permet leur fonctionnement sur des appareils anciens et des réseaux moins performants.

Ainsi, les utilisateurs n’expérimentent pas un service « qui rame » et sont donc moins tentés de renouveler leurs appareils (smartphone, pc, tablette). On peut aussi utiliser plus longtemps les infrastructures existantes : réseaux, centres informatiques, etc. sans avoir à les remplacer ou à en ajouter.

Définir précisément le besoin et supprimer le superflu est essentiel en écoconception. Plus l’intervention a lieu tôt – dès l’expression du besoin, la conception fonctionnelle ou le maquettage -, plus l’impact sur la réduction de l’empreinte environnementale est fort.

Près de 45 % des fonctionnalités ne sont jamais utilisées et 70 % ne sont pas essentielles, d’où l’importance d’impliquer les parties prenantes pour cibler les besoins réels avant la conception.

L’écoconception repose sur une démarche globale et continue visant la sobriété numérique. L’un de ses piliers est l’unité fonctionnelle, c’est-à-dire la fonction principale du service (ex. : acheter un billet, regarder une vidéo, prendre rendez-vous).

Les bonnes questions

Enfin, il convient d’évaluer la pertinence même du service numérique :

• Le numérique est-il indispensable pour ce besoin ?
• Existe-t-il une alternative non numérique plus sobre ?

On peut ensuite s’interroger sur les autres besoins à définir :

• Quels sont les réels besoins justifiant la création du service ?
• La valeur ajoutée du service justifie-t-elle la mobilisation des ressources requises pour sa création ? Est-ce qu’on crée plus de valeur qu’on en détruit ?
• Cette fonctionnalité est-elle vraiment nécessaire ? Est-ce qu’on peut faire autrement ?
• Que se passerait-il si on ne l’avait pas ?
• Quelle est la quantification minimale répondant aux besoins des utilisateurs ? Nombre de résultats, résolution d’image, qualité de son, durée de vidéo…

Opter pour les choix les plus sobres entre le texte, l’image, l’audio ou la vidéo, selon les besoins utilisateurs, permet de valider le critère 4.7 du référentiel général de l’écoconception des services numériques.

Restreindre l’usage des capteurs des terminaux utilisateurs au besoin du service (éviter la géolocalisation par exemple) permet de valider le critère 6.6 du référentiel général de l’écoconception des services numériques.

Fonctionnalité non-essentielle

BBC podcast nous offre 2 choix de téléchargements : “haute qualité” et “basse qualité”.
Par défaut, si on ne connaît pas l’impact de l’un ou de l’autre, on va choisir l’option “haute qualité” qui est 2 fois plus lourde. Or à l’oreille la différence n’est pas ou peu perceptible.
L’unité fonctionnelle est certainement “Écouter une émission en podcast” et non pas « Écouter une émission en haute qualité ou basse qualité”
On pourrait donc ici éliminer une fonctionnalité non-essentielle et ne garder qu’une option de téléchargement : l’option basse qualité, sans la nommer ainsi !

Pour aller plus loin

• Ecoconception web : Les 115 bonnes pratiques – 4ème édition sur github – GreenIT
• Guide de questionnement pour le développement de services numériques (PDF) – ADEME
• Une appli écoconçue pour favoriser les circuits courts – GreenIT

Le rôle indispensable de l’expérience utilisateur (Green UX)

La Green UX désigne le fait de rester centré sur les besoins réels et les attentes des utilisateurs, pour La Green UX consiste à concevoir des services numériques centrés sur les besoins réels des utilisateurs afin de réduire leur impact environnemental. L’éco-conception revient aux principes fondamentaux du design centré utilisateur, parfois détournés à des fins commerciales.

Aller à l’essentiel améliore l’expérience : par exemple, Google propose une interface épurée répondant efficacement au besoin “rechercher sur le web”, contrairement à Yahoo!, surchargé d’informations inutiles. Des moteurs comme Qwant ou DuckDuckGo appliquent aussi cette logique de simplicité.

Adopter une démarche Green UX influence tout le cycle de conception : choix d’interface, de composants, de fonctionnalités et de parcours utilisateur. Cela engage designers, développeurs et responsables de maintenance dans une réflexion de sobriété et d’efficacité pour limiter l’empreinte environnementale du service.

La mesure et l’évaluation sont au cœur même de la démarche d’écoconception. Avant d’envisager une refonte de votre site web ou service, il est important de comprendre son impact et d’identifier les principaux leviers d’amélioration.

• S’il s’agit d’un nouveau service, il peut être intéressant d’évaluer un service concurrent ou similaire pour éviter les mêmes erreurs. Mesurez l’impact de l’expérience sur des sites équivalents. Tentez d’évaluer votre nombre d’utilisateurs, le matériel nécessaire et l’impact de votre service du mieux possible pour orienter vos choix ultérieurs.
• Si vous partez d’un produit existant, évaluez l’impact environnemental du parcours utilisateur et identifiez ses axes d’amélioration et les bonnes pratiques à mettre en place.

Les questions à se poser

• À quoi peut ressembler un « usage excessif » du service ? Puis-je estimer quantitativement ce seuil ?
• À quoi peut ressembler un usage opposé à celui pour lequel je conçois ?
• Quels sont les risques d’effet rebond à l’usage du service ?
• Si l’environnement était mon client, qu’est-ce que je changerais à mon service ?
• Quels effets négatifs pourrait générer une utilisation de mon service à grande échelle ?

Quelques exemples

Quelques exemples

Évaluer un service concurrent ou similaire : plateforme de streaming musical

• Avant de créer une nouvelle plateforme, on compare Spotify, Deezer et YouTube Music.
• On observe que :
  • YouTube Music consomme beaucoup à cause de la vidéo (même quand seul l’audio est utile).
  • Spotify optimise le streaming audio et compresse les fichiers selon la bande passante.
• 👉 En s’inspirant de Spotify, on privilégie le streaming adaptatif et l’option “audio seulement”, évitant le gaspillage de données.

Identifier un “usage excessif” : service de partage de fichiers

• Usage normal : partager ponctuellement des documents de travail.
• Usage excessif : stocker des archives volumineuses “à vie”.
• 👉 Solution : suppression automatique après 30 jours, ou archivage basse résolution.
  Cela évite une accumulation de données dormantes sur les serveurs.

Pour un service existant :

• Quel est l’impact environnemental du parcours utilisateur ?
• Quels en sont les leviers d’amélioration ?

Pour un service à créer :

• Quels pourraient être les impacts négatifs du produit à court et long termes ?
• Les avantages du produit compensent-ils ses impacts négatifs ?

La mesure d’impact permet également de sensibiliser autour de soi, notamment des décisionnaires sensibles aux indicateurs et objectifs quantitatifs. Cependant, elle peut être complexe à effectuer et chronophage. Rappel : mesurer ne doit pas être une fin en soi. Le numérique, comme les autres secteurs, doit réduire son impact global et toute amélioration est bonne à prendre à partir du moment où elle n’engendre pas de transferts de pollution.

Évaluer l’impact du parcours utilisateur

Après avoir défini l’unité fonctionnelle (par exemple “acheter un billet de train en ligne”) et le scénario d’utilisation, évaluez l’empreinte environnementale du parcours utilisateur.

Vous pouvez utiliser un outil comme GreenIT Analysis qui est disponible sur Chrome et Firefox, ainsi qu’en version CLI / ligne de commande si vous souhaitez automatiser les analyses. Il permet d’évaluer :

• la performance environnementale de l’unité fonctionnelle et les impacts environnementaux associés (alternative : EcoIndex.fr) ;
• la mise en œuvre (ou non) des bonnes pratiques du référentiel d’écoconception web selon des règles de test et des seuils de conformité.

En analysant les pages et en sélectionnant l’option “Activer l’analyse des bonnes pratiques” vous obtiendrez un score et des pistes d’améliorations.

La note EcoIndex de chaque page se situe sur une échelle de A à G (A étant la meilleure note) et est accompagnée d’un score entre 1 et 100 (100 étant le meilleur score).

Les mesures de EcoIndex (poids de la page, nombre de requêtes, nombre d’éléments du DOM), ainsi que les bonnes pratiques testées, vous permettent d’avoir une première idée des pistes d’améliorations.

NB : il est important d’effacer le cache au début de l’analyse et de désactiver les bloqueurs de publicité pour une mesure réaliste. Il faut aussi lancer l’analyse après avoir scrollé et fait ses actions sur la page.

Exemple

Utilisation du plugin GreenIT-Analysis

La mesure de l’impact environnemental d’une page web avec le plugin GreenIT Analysis donne ici une note de D. On voit en effet que la page pèse près de 9 Mo et qu’un certain nombre de bonnes pratiques d’écoconception ne sont pas appliquées.

Après avoir analysé et sauvegardé chaque page, l’historique du parcours est disponible en cliquant sur « Historique ». Vous pouvez alors exporter les résultats vers un tableur et faire la somme des impacts des pages afin d’obtenir l’impact global du parcours.

En fonction de vos cas d’usages, il peut être pertinent d’évaluer l’impact d’un parcours “découverte” et d’un parcours “récurrent” :

• Parcours découverte : Nettoyer le cache de votre navigateur. Évaluer l’impact du parcours en fonction de l’unité fonctionnelle choisie. N’oubliez pas de sauver l’analyse de chaque page visitée.
• Parcours récurrent : Évaluer l’impact du parcours pour les visites suivantes, sans nettoyer le cache (les données sont mises en cache et l’impact devrait être moindre).

À cette étape d’évaluation et d’état des lieux, vous pouvez également effectuer des mesures de performance avec les outils habituels : GTmetrix, Lighthouse, Yellow Lab Tools, etc. Un site écoconçu sera non seulement léger mais aura également de bons résultats de performance car il est efficient.

L’onglet Réseau de votre navigateur vous apporte également une grande aide pour comprendre ce qui se passe lors du chargement de votre page. Vous pouvez consulter clairement le nombre de requêtes qui sont appelées et le poids des données qui transitent. Une requête HTTP peut appeler des dizaines de Mo de données.

NB : Que vous choisissiez GreenIT Analysis ou un autre outil, il sera important de conserver le même dans la durée de l’amélioration continue de votre service afin d’obtenir des résultats comparables.

Note importante : l’évaluation de l’impact environnemental via ces outils ne remplace pas un audit et une Analyse du Cycle de Vie conduite par des experts. L’ACV est basée sur les normes ISO 14040 et 14044 (Analyse du Cycle de Vie ACV). C’est le seul outil reconnu dans les cadre du déploiement progressif de l’affichage environnemental en France et en Europe.

Identifier les opportunités d’allègement

Lorsqu’il s’agit de refondre un site existant, il est parfois possible d’obtenir des données de navigation du site, notamment si le client a une solution de type Google Analytics ou ContentSquare, ou une solution open source comme Matomo ou plausible.io. Ces deux dernières sont préférables pour le respect de la confidentialité des données des utilisateurs (Google Analytics : retour sur la mise en demeure de la CNIL).

Cela peut permettre d’identifier différentes opportunités d’écoconception :

• Les pages sur lesquelles les utilisateurs restent très peu de temps ou au contraire très longtemps par rapport à leur contenu : L’utilisateur rencontre-t-il un problème ? → Opportunité de fluidifier le parcours.
• Les allers-retours successifs entre deux pages : Y a-t-il quelque chose qui n’est pas clair pour l’utilisateur ? → Opportunité de simplifier et raccourcir le parcours global.
• Les pages ayant un taux de rebond élevé : Qu’est ce que les utilisateurs attendent de cette page ? Y a-t-il une redirection intempestive ou déceptive vers cette page ? → Opportunité de refondre une page à l’aide d’une démarche d’écoconception, de supprimer une page ou de l’exclure d’un parcours où elle n’est pas nécessaire.
• Les pages ou parcours les plus visités : Quel est l’impact environnemental de ces parcours ? Ces pages consomment-elles beaucoup de ressources ? Puis-je réduire leur impact, même à la marge ? → Opportunité d’alléger l’impact des parcours de nombreux utilisateurs.
• Les mots clés les plus recherchés : Que recherchent mes utilisateurs ? Puis-je les aider à trouver plus facilement en restructurant mon menu ou ma page d’accueil par exemple ? → Opportunité de simplifier le parcours et de limiter le nombre de requêtes.
• Les régions où se situent majoritairement mes utilisateurs : Dans quel pays se trouvent-ils ? → Opportunité de rapprocher mon hébergeur de mes utilisateurs pour diminuer l’impact environnemental.
• Les pages qui ne sont jamais visitées : Est-il possible de les supprimer ? Leur contenu est-il obsolète ? → Opportunité de réduire la taille du site.

Ces données sont utiles avant d’effectuer de gros changements : elles permettent de mesurer la performance avant et après. N’oublions pas que capter des données est énergivore. Si un site évolue peu, il peut être inutile de faire remonter quotidiennement ou instantanément ces chiffres.

Les questions à se poser

• De quelles données ai-je besoin ?
• À quelle fréquence en ai-je besoin ?
• Sur quelle période en ai-je besoin ?
• Quelle solution me permettant de collecter ces données est la plus légère et la plus respectueuse de la vie privée de mes utilisateurs ?
• Ai-je prévu l’expiration et la suppression de ces données ?

Plus un utilisateur passe de temps sur un site pour accomplir son objectif, plus l’empreinte environnementale sera élevée. Bien que cela semble évident, on s’aperçoit vite que beaucoup de sites n’ont pas à coeur de raccourcir le parcours utilisateur. En effet, certains modèles économiques fondés sur la captation de l’attention ou l’augmentation du panier moyen (pour ne citer qu’eux) viennent se heurter à des objectifs d’amélioration de l’expérience. Or, une expérience qui n’est pas fluide a souvent une empreinte environnementale élevée. L’écoconception rejoint ici les bonnes pratiques d’économie de l’attention.

A cette étape, il est aussi important de remettre en question nos habitudes de conception, comme le propose cet article du Low Tech Lab, Faire un site low-tech :

Le web design et le développement web ont été largement influencés par les modèles des GAFAM, (…) Il est donc important de ne pas suivre les tendances de conception, de les questionner, et de bien définir ce qui est nécessaire pour ce projet.

Low Tech Lab, Faire un site low-tech (consulter en ligne)

Les questions à se poser

• Quelle est l’unité fonctionnelle ?
• Combien d’étapes faut-il pour y arriver ?
• Est-ce que ce parcours est accessible ?
• Comment puis-je augmenter le taux de transformation tout en raccourcissant le parcours ?

Exemple

Navigation fluide

Unité fonctionnelle : Trouver des informations sur les impôts

Alors qu’il est parfois difficile de trouver des informations sur certains sites administratifs, le site du gouvernement du Royaume-Uni (gov.uk) fournit une navigation simple, claire, et sans fioritures.

Par exemple, pour trouver une information sur les réductions d’impôts, le chemin est simple :

Le parcours s’effectue en 4 pages seulement.
Chaque page du parcours a un score EcoIndex de A ou B.

L’empreinte environnementale est donc faible contrairement à beaucoup d’autres sites du même type.

Lorsque l’on conçoit d’abord pour écrans d’ordinateurs dits « desktop », on a tendance à ajouter beaucoup de contenu, à « combler les vides ». Lorsque l’on passe ensuite à la conception des écrans mobiles, on a alors du mal à tout faire rentrer dans ce petit espace, surtout de manière pratique et hiérarchisée. L’expérience se trouve alors détériorée : l’utilisateur a du mal à naviguer et l’impact environnemental est accru par le chargement de contenu superflu.

L’approche “Mobile first” consiste à concevoir d’abord pour les appareils mobiles. Cela permet de :

• aller à l’essentiel et ainsi de réduire les fonctionnalités et contenus accessoires
• s’assurer que notre service fonctionnera correctement sur les appareils mobiles qu’utilisent en moyenne 55% des internautes (Statista, 2021).

Bien entendu, il ne s’agit pas non plus de délaisser la version desktop. Toutefois, il est plus facile de passer un écran mobile en desktop que l’inverse.

Cette approche dite « mobile first » doit être pensée pour des terminaux mobiles peu puissants et avec une connexion réseau non optimale (3G plutôt que 4G par exemple). Ces contraintes techniques obligeront les concepteurs à se concentrer sur l’essentiel et à produire un service numérique sobre et peu impactant.

Livre blanc GreenConcept, 2020 (consulter en ligne)

Les questions à se poser

• Qu’est-ce qui est essentiel ?
• Quel est le minimum de technologie nécessaire pour résoudre le problème ?
• Est-ce que cela fonctionne sur mobile et desktop ?
• Est-ce que la taille des boutons et champs est adaptée au mobile ?

Exemple

Conception “mobile first”

Unité fonctionnelle : Faire une simulation de droits

Pour un service de simulation par exemple, on peut être tenté de demander de nombreuses informations ce qui ralentit le parcours, peut décourager les utilisateurs car ils n’ont pas toutes les informations sous la main, etc.

L’approche “mobile first” illustrée sur cette maquette (exemple fictif) permet d’aller à l’essentiel des informations nécessaires pour un premier niveau. On peut fournir une option avancée également si l’utilisateur veut aller plus loin.

De cette façon on fournit un service accessible sur mobile, et une expérience simple et fluide.

Critère 2.5 du RGESN
Concevoir un service responsive, autrement dit « s’adaptant à différents types de terminaux d’affichage », permet de valider le critère 2.5 du référentiel général de l’écoconception des services numériques.
Voir le référentiel

Critère 2.6 du RGESN
Effectuer une revue de la conception prenant en compte l’empreinte environnementale avant de commencer le développement permet de valider en partie le critère 2.6 du référentiel général de l’écoconception des services numériques.
Voir le référentiel

Pour aller plus loin :

• Écoconception / Les 115 bonnes pratiques – 4ème édition – GreenIT (github)

Eco-concevoir des applications mobile

Les bonnes pratiques de prototypage pour les écrans mobiles sont valables pour les sites « responsive », mais aussi pour les applications. NB : un site dit « responsive » est un site dont les éléments (menu, blocs…) s’adaptent dynamiquement à la taille de l’écran.

Privilégier les app web

Dans une démarche d’écoconception, il est recommandé de privilégier les applications web (site web, Progressive Web Apps ou PWA) aux applications natives pour plusieurs raisons :

• Réduire l’obsolescence induite sur les terminaux utilisateurs : les applications natives ont besoin des dernières versions d’OS (système d’exploitation) et parfois même des dernières générations d’équipements pour fonctionner ce qui induit une obsolescence des matériels. Peu d’apps natives fonctionnent sur des équipements au-delà de 7 ans. Alors que des apps web, par exemple, sont a priori disponibles dans tout navigateur et pour tout type d’équipement. Cela leur assure une bonne interopérabilité et une bonne longévité. Voir à ce sujet le critère “Le service numérique a-t-il été conçu avec des technologies standards plutôt que des technologies propriétaires ou spécifiques à une plateforme ou à un système d’exploitation ?” du RGESN.
• Nombre de versions réduit à un : Les applications natives nécessitent un travail démultiplié (version iOS, version Android, version web…) lors du développement mais aussi de la maintenance. Cela consomme plus de ressources en termes d’heures de travail effectuées, de développement du système de design, de stockage de ces ressources…
• Mises à jour maîtrisées : Les applications natives ont des mises à jour à installer régulièrement ; ceci génère des transferts de données pour des milliers, voire millions d’utilisateurs. Ces mises à jour accélèrent souvent l’obsolescence des smartphones : elles saturent la mémoire ou rendent certaines fonctionnalités inutilisables. Par ailleurs, les mises à jour des apps natives se font via un store par le remplacement d’un seul gros fichier. Les applications web, quant à elles, permettent de maîtriser la mise à jour, fichier par fichier.
• Poids plus léger : Les applications web sont généralement 10 fois plus légères que les applications natives. La quantité de données transférées aux utilisateurs et la sollicitation de la mémoire du terminal s’en trouvent ainsi diminuées.

A considérer : Comme de nombreux sujets en écoconception, il s’agit d’évaluer le gain dans le contexte de votre service et de son unité fonctionnelle. Dans certains cas, par exemple, si les transferts de données en phase d’utilisation sont importants et engendrent une plus grande consommation de ressources par le navigateur, il peut être plus pertinent de développer une app native.

Tous les projets de design n’offrent pas le choix de la technologie. Si vous n’êtes pas concerné par ce sujet un peu plus technique, vous pouvez directement passer à la partie suivante Réaliser et développer. Cependant, beaucoup de designers développent eux-mêmes leurs sites web, notamment lorsque le client a un petit budget ne permettant pas d’embaucher 2 personnes. Le choix le plus simple pousse alors souvent à se tourner vers WordPress mais pour écoconcevoir, ce n’est pas forcément le meilleur choix, comme nous l’expliquons ensuite.

Le choix entre site statique et CMS (content management system, outil de gestion de contenu) fait débat. La décision à prendre dépendra du contexte et des personnes impliquées dans le projet. Nous proposons ici plusieurs éléments de réflexion qui pourront vous aider dans le choix de solution en fonction de votre contexte et de vos possibilités.

Principes du site statique

Les générateurs de sites statiques sont des outils permettant de générer individuellement chaque page HTML d’un site web. Pour cela, conformément aux recommandations du W3C, on distingue totalement la forme et la mise en page d’un côté, et le contenu de l’autre. Lors d’une modification, le site va ainsi être généré de nouveau, mettant à jour les fichiers statiques déjà existants.

Les avantages des sites statiques sont nombreux :

• Le contenu est maintenu à part de la mise en page, permettant ainsi une meilleure gestion éditoriale.
• S’agissant de contenus statiques, il n’est plus nécessaire de disposer de langages dits « dynamiques », ni même de bases de données.
• Les pages n’étant plus calculées et rendues sur le serveur à chaque requête, on observe une nette amélioration des performances.

Tout cela réduit fortement l’impact environnemental du site.

Exemples de générateurs de sites statiques :

• Eleventy (11ty)
• Jekyll
• Hugo
• NextJS
• Nuxt

A considérer : Il est difficile de prévoir comment les technologies sur lesquelles certains générateurs reposent seront maintenues dans quelques années. Cela pourrait dans certains cas engendrer une dette technique. Par ailleurs, si un site statique est recommandé, le générateur en lui-même peut être surdimensionné par rapport à votre besoin. Il faut donc veiller à bien choisir son générateur.

Principes du CMS

CMS signifie Content Management System ou Système de gestion de contenu. Comme le nom l’indique, c’est un programme permettant de créer un site web, souvent facilement (sans nécessité d’être un développeur), et de l’alimenter « à plusieurs mains », sans aide technique non plus. Les CMS permettent par exemple d’accorder différents niveaux de droits aux administrateurs ou encore de structurer le contenu selon que c’est un article, une FAQ, etc.

Exemples de CMS :

• WordPress, le plus connu. Environ 36% des sites web sont faits avec WordPress (WordPress in 2024 – en anglais)
• Kirby, celui utilisé pour ce site
• Translucide
• Grav
• Osuny

Certains CMS et thèmes proposés comportent beaucoup de fonctionnalités inclues par défaut qui peuvent alourdir inutilement votre site. C’est un peu comme utiliser un porte-conteneur pour traverser une rivière : cela peut nécessiter beaucoup de ressources, être surdimensionné et pas forcément le plus pratique.

Pour autant, recourir à d’autres CMS ou thèmes optimisés ne consomme pas nécessairement plus de ressources qu’un site statique. Nous vous donnons plus bas des conseils pour minimiser l’impact de la solution retenue.

Par exemple, le CMS Translucide est par essence écoconçu. Il repose sur l’essentiel, avec le moins de fonctionnalités possibles. A l’inverse de WordPress auquel on doit retirer un maximum de couches, Translucide en a très peu au départ et utilise des technologies standards et open-source (principalement HTML, CSS, PHP). L’ajout de fonctionnalités fait l’objet d’une réelle réflexion au sein du collectif.