Nous remercions la Banque Nationale pour sa commandite qui nous permet d'offrir gratuitement le simulateur de Marketing numérique de HEC MONTRÉAL à nos étudiants du BAA !

Rechercher
l'éco-conception web
S'abonner à l'infolettre

Infolettre

L’Éco-conception Web : Principes et meilleures pratiques

l'éco-conception web

Dans un monde qui compte 5 milliards d’utilisateurs sur internet, il est important de se pencher sur les effets que peuvent avoir notre toile géante sur la planète.
En effet, tout ce trafic génère une grosse quantité de données ce qui implique le fonctionnement de divers centre de données et infrastructures réseau. La nécessité de mesurer l’impact environnemental du web est donc primordial pour se rendre compte et pouvoir agir sur la pollution numérique conséquente.
C’est ici qu’intervient l’éco-conception web, une démarche innovante qui vise à minimiser l’empreinte carbone de chaque visite sur un site web. Il ne s’agit pas d’une simple tendance, mais plutôt d’une révolution dans la manière de concevoir, développer et héberger les sites internet.

Résumé vidéo sur l’éco-conception web

Aujourd’hui, l’empreinte carbone moyenne d’un site web se situe à environ 4,61g1 de CO2 par visite. Pour un site web qui reçoit 10000 visites uniques mensuels, cela représenterait 553kg de CO2 par année, soit l’équivalent de 3300km de voiture parcourus.
Paradoxalement, le poids moyen d’une page web a été multiplié par 1152 entre 1995 et 2015, pourtant les fonctionnalités des sites web modernes ne sont pas beaucoup plus nombreuses que celles présentes en 1995.
Il faut donc faire machine arrière, et se demander comment retrouver des pages légères, esthétiques et fonctionnelles, tout en réduisant l’empreinte carbone du site web au global.

L’éco-conception en action : alléger vos pages web

Aujourd’hui, le poids moyen d’une page web serait de 2MB. Il faut donc viser à réduire au maximum le poids de toutes les pages web pour réduire la quantité d’énergie requise au chargement de celle-ci par l’utilisateur final. C’est l’enjeu le plus important lorsque l’on parle d’éco-conception.

Voici 5 actions à mettre en place pour réduire le poids de vos pages web : 

Optimiser les images

  • Avant de mettre une image sur votre site web, posez-vous les questions suivantes : Quelle est la valeur ajoutée de cette image ? Est-ce qu’elle est purement à but décoratif ? Est-ce qu’elle facilite le parcours utilisateur ? Est-ce qu’elle améliore l’expérience utilisateur ?
    Il est important de mettre des images uniquement lorsque c’est nécessaire et qu’elles apportent une réelle valeur ajoutée à votre page web.
  • Utilisez le format WebP, il permet de compresser les images le plus possible, tout en maintenant une qualité similaire au jpeg ou au png.
  • Utilisez le format SVG pour vos icônes. Ce format est idéal pour vos illustrations, car il est sans perte de résolution, et très léger pour votre page web.

Minifier les fichiers HTML, CSS et Javascript

Minifier les fichiers HTML, CSS et Javascript consiste à supprimer tous les espaces et retours à la ligne dans les fichiers de code. Cette optimisation réduit considérablement la taille des différents fichiers de programmation.

Utiliser la compression GZip ou Brotli

La compression des ressources peut réduire de manière significative la taille des données transmises entre le serveur et le navigateur de l’utilisateur. Gzip et Brotli sont particulièrement efficaces pour compresser les fichiers texte, tels que HTML, CSS, et JavaScript, rendant cette méthode extrêmement impactante pour améliorer les performances.

Exploiter le Lazy Loading

Le chargement différé consiste à appeler une ressource du site web (image, section ou autre) uniquement lorsque l’utilisateur se rapproche de celle-ci. Par exemple, il est inutile de charger une image qui se trouve en bas de page tant que l’utilisateur n’a pas défilé jusqu’à la fin de la page. Cela permet donc de charger les ressources uniquement si l’utilisateur est amené à les voir.
Cette pratique vise à augmenter la performance du site web plutôt que son poids, mais reste très pertinente dans une démarche d’éco-conception.

Supprimer les ressources inutilisées

Cela consiste à supprimer les différentes bibliothèques Javascript et CSS qui ne sont pas utilisées sur le site web.
Imaginez que vous allez à la bibliothèque pour emprunter quelques livres spécifiques. Au lieu de prendre juste les livres dont vous avez besoin, c’est comme si vous décidiez de prendre avec vous les étagères entières sur lesquelles ces livres sont rangés.
Il est donc important d’installer uniquement les ressources que votre site web utilisera, plutôt que de l’alourdir sans utilité.

Pour aller plus loin dans l’optimisation de votre site web, différents outils existent à votre disposition : 

  • Page Speed Insights : Famille d’outils appartenant à Google permettant d’optimiser la performance de son site web
  • EcoGrader : Outil qui permet de mesurer l’impact carbone de votre site web, tout en vous donnant des recommandations stratégiques pour alléger les pages analysées

Choisir le bon hébergeur pour l’éco-conception web

Le choix de votre hébergeur web est crucial, non seulement pour l’impact environnemental, mais aussi pour la sécurité de votre site web, ainsi que la performance de ce dernier.

La première étape consiste à évaluer les critères de durabilité de chacun de vos hébergeurs potentiels. Vos fournisseurs devraient utiliser une énergie renouvelable, ou alors être inscrits dans des programmes de compensation carbone au minimum. Certains hébergeurs innovants utilisent la chaleur générée par les serveurs pour la transformer en énergie ou pour chauffer des bâtiments.

La deuxième étape est de regarder au-delà des implications environnementales. Il faut veiller à ce que le fournisseur utilise des technologies efficaces en énergie, mais performantes. Cela implique de l’optimisation des ressources pour éviter le gaspillage et une planification adéquate pour gérer les stockages serveurs.

La troisième étape serait de rechercher des fournisseurs qui disposent de labels environnementaux tels que LEED, Green Seal, ou encore Energy Star. Cela fournit une assurance supplémentaire quant à l’authenticité des actions en faveur de l’environnement exercées par l’hébergeur.

Les bénéfices de l’éco-conception web

L’éco-conception web se présente comme une démarche qui s’inscrit au-delà de la simple réduction de l’empreinte carbone de votre site web. Elle s’aligne étroitement avec les bonnes pratiques du World Wide Web Consortium (W3C), optimisant ainsi la performance des sites web. Les principes directeurs de l’éco-conception web encouragent l’utilisation de standards ouverts, le respect de l’accessibilité et l’amélioration de l’expérience utilisateur, qui sont des composantes fondamentales des recommandations W3C. Cette corrélation entre éco-conception et performance mène à une meilleure efficacité énergétique globale et souligne les bénéfices à ce que tout site web soit éco-conçu.

En parallèle, l’éco-conception web influence positivement le référencement naturel sur des moteurs de recherche tels que Google. Ce dernier favorise les sites rapides, bien structurés et accessibles, qui sont souvent le résultat de pratiques d’éco-conception. Des pages web légères et bien codées sont favorables pour votre expérience utilisateur.
Aussi, depuis Février 2020, Google favorise le référencement des sites web ayant de bons Core Web vitals. Un site web avec des performances élevées résultant de son éco-conception sera donc favorisé par Google naturellement

L’éco-conception web : un avantage universel pour la planète et la performance

Cette approche, centrée sur la réduction de l’impact environnemental des sites internet, implique une démarche réfléchie dès la phase de conception, axée sur la sobriété numérique. En sélectionnant avec réflexion le contenu et en se demandant systématiquement si ce dernier apporte une réelle valeur ajoutée aux utilisateurs, les créateurs de sites web peuvent significativement diminuer la quantité de données échangées et stockées, contribuant ainsi à une empreinte carbone réduite. 

Ces pratiques améliorent l’expérience utilisateur et réduisent les besoins énergétiques, ce qui souligne que l’éco-conception n’est pas seulement un geste envers l’environnement, mais également une stratégie bénéfique en termes de référencement et d’engagement utilisateur. Ainsi, l’éco-conception web s’affirme comme une démarche nécessaire, où la sobriété dans l’utilisation du contenu devient le pilier d’un internet plus durable et responsable.

Pour aller plus loin, vous pouvez faire appel à des agences de créations de sites web éco-conçus qui commencent à émerger de partout dans le monde. A Montréal, l’Agence Nicely se positionne comme une agence innovante, mettant au coeur de sa mission la réduction des émissions carbones de nos activités numériques.

Références

  1. https://en.reset.org/whats-carbon-footprint-your-website/#:~:text=A%20carbon%20calculator%20for%20your%20website&text=An%20average%20website%20produces%204.61,kilograms%20of%20CO2%20per%20year.
    ↩︎
  2. https://ecoconceptionweb.com/files/eco-conception-web_introduction.pdf
    ↩︎
gerechtlouis

gerechtlouis

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Découvrir d'autres articles

small_c_popup.png

Avez-vous finis votre lecture de l'article?

Vous pourriez tester vos connaissances numérique

25 questions pour déterminer si vos lectures sur le blogue ont fait de vous un expert du numérique