7 bonnes pratiques d’éco-conception de sites web & d'applications

Juliette PERROT
May 11, 2023
Photo d'un ordinateur portable avec une page de code ouverte et des plantes vertes | Adservio Academy

L'éco-conception est un enjeu du numérique responsable et s'applique tout au long du cycle de vie d'un site ou d'une appli. Voici 7 bonnes pratiques

Que l’on parle d’un produit manufacturé ou d’un service numérique, l’objectif de l’éco-conception reste toujours le même : en limiter les impacts environnementaux tout au long de son cycle de vie. Mais qu’est-ce que l’éco-conception numérique signifie réellement en termes d’innovation ? Quels en sont les exemples concrets ? Cela permet-il de répondre aux besoins des utilisateur·rice·s

L’éco-conception : une démarche cruciale en faveur de la sobriété numérique et du développement durable 

Éco-concevoir pour contrôler l’impact grandissant du numérique

On ne le sait que trop maintenant, plus on dématérialise, plus on pollue. Le numérique engendre près de 3.5% d’émission de gaz à effets de serre et 10% de la consommation mondiale d'électricité*. Plus inquiétant encore, d’ici vingt ans, ces chiffres seront sur la bonne voie pour doubler si aucune mesure n’est prise pour enrayer l’impact du numérique.

Éco-concevoir un site, une application ou un logiciel permet d’apporter notre contribution à un univers IT plus responsable, plus durable. Mais c’est surtout mettre fin au cycle du numérique toujours plus énergivore afin de laisser la place à des pratiques raisonnées et résolument innovantes. Parce que oui, la technologie se met au service de l’utile,  et c’est un véritable levier créatif pour les métiers techniques et graphiques qui s'emploient à réconcilier qualité et sobriété. 

L’éco-conception numérique : la frugalité avant tout

Une démarche d’éco-conception intègre la protection des enjeux environnementaux dès les premiers processus de création. Il s’agira ainsi de réduire la consommation des ressources nécessaires à la production : l'énergie, les matières premières et les nuisances ou pollutions qui en résultent. Mais en matière d’éco-conception numérique, il s’agira aussi de se poser la question de l’utilité d’une fonctionnalité au sein d’un site web d’une application ou d’un logiciel. 

Si l’éco-conception numérique devait avoir un adage, ce serait “Moins mais mieux”. On épure au maximum et on ne garde que le nécessaire afin d’obtenir un résultat hautement qualitatif. Et cela vaut pour la partie développement, mais aussi pour l’UX et pour le graphisme.

7 exemples d’actions concrètes d’éco-conception numérique 

1. Aller à l’essentiel : des fonctionnalités aux besoins des utilisateur·rice·s

Selon l’ADEME, 70% des fonctionnalités d’un site web ne sont pas essentielles et 45% ne sont jamais utilisées. Posez-vous alors les bonnes questions à chaque étape d’un projet et avant même de plonger la tête la première dans le technique. Est-ce que cette fonctionnalité et cette technologie sont vraiment utiles ? Est-ce qu’elles répondent à un vrai besoin de l’utilisateur·rice ou bien ce n’est que de l'agrément ? Pour le savoir, n'hésitez pas à sonder directement votre audience. Créez des boutons ou des interfaces tests et regardez où on a le plus cliqué.

Rappelez-vous que tout ce que vous ne développerez pas vous coûtera beaucoup moins cher et vous permettra de répondre plus vite à la demande. Et puis les utilisateur·rice·s apprécient davantage un service numérique ergonomique et facile à comprendre qu’une jolie interface.

2. Optimiser son code source 

Le langage de programmation de votre futur service peut lui aussi se délester du superflu. Privilégiez le triptyque, efficacité énergétique - longévité - simplicité. Ainsi, vous éliminerez les éléments inutilement lourds qui ralentissent le chargement d’un site web et éviterez d’abuser des scripts tiers et des plugins non essentiels.

Par exemple, il est inutile d’écrire toutes vos briques dans le même langage.  À la place, misez sur le compromis entre performance et consommation énergétique. Pour cela, choisissez un langage compilé, plus écologique et rapide, pour toutes les fonctionnalités nécessitant une haute performance. Optez pour un langage interprété (plus gourmand en ressources, mais plus facile d’accès pour de la maintenance) pour les fonctionnalités moins exigeantes. Vous en assurerez alors la pérennité.

3. Maîtriser la consommation d'énergie…

… durant chaque étape du cycle de vie d’un site ou d’une application :

  • L’Approche Mobile First. Envisagez la conception d’un site ou d’une application d’abord pour un mobile et non pour un  ordinateur. De cette manière, vous irez directement à l’essentiel en évitant les fonctionnalités et le contenu superflu. L’utilisateur·rice limitera son temps d’écran et préservera sa batterie. 
  • La mise en cache permet de stocker temporairement les données. Son objectif consiste à rendre cette donnée facilement accessible et réutilisable lors des requêtes des utilisateur·rice·s. C’est idéal pour les requêtes lourdes ou encore pour les données communes qui ont vocation à être utilisées simultanément.
  • L’optimisation des requêtes SQL. Mal employées, ces requêtes vont mettre du temps à répondre et vont puiser inutilement de l'énergie au CPU, à la mémoire vive et à la bande passante. Donc, on se focalise uniquement sur les lignes et les colonnes les plus utilisées, on les indexe pour favoriser un meilleur temps de chargement. Enfin, on soigne la syntaxe pour ne pas épuiser le moteur de calcul.

4. Miser sur des serveurs et des data centers écologiques

Les data centers présentent un véritable challenge environnemental tant ils se multiplient et consomment sans interruption électricité et eau. Pour héberger de manière plus vertueuse les données que vous produisez, pourquoi ne pas vous tourner vers le Green Hosting ou hébergement vert ?

Il existe plusieurs alternatives d'hébergement responsables qui misent notamment sur le rallongement de la durée des vies des serveurs et les énergies renouvelables. Certains hébergeurs s'implantent même dans des pays au climat froid pour faciliter le refroidissement des machines. Le franco-canadien EX2, le suisse Infomaniak ou le québécois PlanetHoster figurent ainsi parmi les hébergements verts les plus réputés.

5. Adopter une approche entièrement minimaliste

L’approche minimaliste est l’un des piliers de l’éco-conception. Lorsque vous élaborez la charte graphique, optez pour un design aux lignes simples et épurées (généralement plus élégantes). N'oubliez pas les éléments graphiques (vidéos, images) compressés, donc plus légers afin de ne pas ralentir le temps de chargement. TinyPNG, Image Compressor ou TinyVid sont quelques exemples d’outils de compressions d’images ou de vidéos, gratuits.

L’UX doit également être pensée pour favoriser une navigation simple et agréable. Et en ce qui concerne la partie code, là encore, l’épuration est de mise et cela passe par la réduction de fichiers CSS, JavaScript, etc. 

6. S’appuyer sur les normes et les directives en vigueur

Suivre les normes et les directives en matière de développement éco-durable (World Wide Web Consortium, Loi REEN, normes ISO 14000, etc.) favorise des pratiques écoresponsables et limite l'empreinte carbone d’un site ou d’une application. Même constat du côté de l’obtention d’écolabels (Numérique Responsable, Greenspector, etc.).

En outre, cela vous permettra de garantir la compatibilité multiplateforme et la facilité d'utilisation de votre service et la conformité aux normes internationales.

7. Mesurer, analyser l’empreinte numérique tout au long du cycle de vie

Pour que la finalité écoresponsable de votre service se prolonge bien après sa mise en service, il convient d'effectuer des audits réguliers.  Pour les applications de type JavaScript, vous pouvez utiliser Unimported qui analyse et détecte les morceaux de codes qui ne sont pas utilisés.

Enfin, pour calculer l'empreinte numérique d’un site web et prendre d’éventuelles mesures correctives, vous pouvez utiliser l'extension Google GreenIT-Analysis. En quelques clics, elle vous donne l’empreinte environnementale de chaque page (gaz à effets de serre émis, consommation d’eau). Elle vous donne aussi son score de A à G en matière de performances environnementales et elle peut détecter 16 des 115 bonnes pratiques de l’éco-conception Web. 

D’ailleurs, on vous encourage à aller y poursuivre cette réflexion : Frédéric Bordage, Ecoconception web : les 115 bonnes pratiques, Editions Eyrolles

*Source : ADEME et EDF

Conclusion

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.