Notre démarche d'écoconception
Ce site est conçu pour optimiser votre empreinte carbone. Activer le mode éco désactivera le chargement des vidéos et des images pour rendre votre navigation plus sobre.
Afin de diminuer l’empreinte carbone du parcours des visiteurs de notre site internet (vous entre autres), nous avons mis en place un mode d’affichage “éco”, qui bloque le chargement des vidéos et des images par défaut. Cette optimisation a été faite en collaboration des équipes du studio d’éco-conception numérique de l’Agence 148.
Par défaut, le site s’affiche en mode éco sur desktop et sur mobile. Le mode éco va bloquer l’affichage par défaut des images et des vidéos de notre site qui ne deviennent visibles qu’à la demande du visiteur.
Pour imparfaite et transitoire qu’elle soit, cette démarche a une forte portée pédagogique sur l’empreinte carbone d’un site web, et permet une prise de conscience de nos usages… et surtout de nos (réels) besoins.
Un kilo de CO2, c’est quoi exactement ?
Les émissions carbone d’un site sont grandement déterminées par le nombre de visites, et c’est ce chiffre qu’il est convenu de calculer quand on cherche à déterminer un impact carbone.
Grâce à l’outil de calcul open source ecoindex-cli installé sur le site, nous avons déterminé que l’empreinte moyenne des pages du site de B Lab France est de 1.62 g CO2. En moyenne toujours, sur les derniers mois, notre trafic mensuel est 8200 visiteurs avec 2.91 pages consultées par visiteur. L’impact carbone de notre site sur un an est donc d’environ 463.88 kg de CO2.
L’empreinte environnementale d’une page est représentée par son équivalence en matière d’émissions de gaz à effet de serre et de consommation d’eau pour un nombre donné de visiteurs. Elle est calculée en fonction du niveau d’écoconception du site. Nous partons d’un impact moyen en termes d’émission de gaz à effet de serre et de consommation d’eau douce, issu de plusieurs modélisations réalisées par GreenIT.fr : cet impact moyen est de 2g. eq. CO2 et 3 cl. d’eau bleue par page web.
Pour en savoir plus, consultez le site impactco2.fr conçu par l’Ademe.
- 158 321 km en tgv 🚅
- 2 132 km en voiture 🚗
- 13 chauffage au gaz 💨
- 64 repas avec du boeuf 🥩
- 781 litres de café ☕️
Une démarche d’éco-conception est globale
En collaboration avec le studio d’éco-conception de l’Agence 148, nous avons mis en œuvre les actions suivantes pour éco-concevoir le site de B Lab France.
-
Sensibilisation
de nos parties prenantes internes et externes pour adhérer à la démarche de réduction d'impact de l’empreinte du numérique
-
Réduction du poids
et de la complexité du site
-
Un parcours utilisateur pédagogique
Utilisation et réflexion d’un parcours utilisateur pédagogique autour d’un mode éco qui limite le poids du site
-
Un hébergement plus responsable
Choix d’un hébergement plus responsable (Infomaniak) qui privilégie l'énergie renouvelable locale et construit ses propres centres de données et centrales solaires en Suisse, sans délocaliser.
-
Mesure et suivi
d’un score d’impact avec un outil reconnu, ecoindex-cli
-
Amélioration continue
Mise en place d’un process d’amélioration continue
Notre roadmap d’amélioration continue
L’éco-conception est un chemin : nous cherchons constamment à améliorer notre réduction d’impact. La première étape a eu lieu lors de la conception et le développement du présent site B Lab France, en avril 2023. Le site a été audité et le score obtenu sert de base à notre démarche d’amélioration.
La mise en place de notre suivi d’impact de chacune des pages nous permet de voir l’évolution du site et nous permettra de réfléchir aux actions à mener pour continuer d’améliorer notre score.
Le studio d’éco-conception de l’Agence 148
Techniquement, le studio d’éco-conception de l’Agence 148, certifiée en l’éco-conception de service numérique, nous a accompagnés sur la réalisation de la refonte. Le studio s’appuie notamment sur la checklist des 115 bonnes pratiques d’écoconception de Frédéric Bordage, Google Lighthouse et Ecoindex pour prioriser et faire un suivi des actions d’optimisation.
Le studio d’éco-conception de l'Agence 148Les principaux challenges
- un minimum de requêtes possible par page
- des pages les plus simples possibles, avec peu d’éléments
- une optimisation des poids des images et des ressources téléchargées. C’est pour cela que nous avons choisi le “mode éco” par défaut sur le site.
L’outil de statistiques
L’outil de statistiques de Google a été remplacé par une solution beaucoup plus légère et ne récoltant pas de données personnelles, plausible.io. C’est pour cela que vous ne voyez pas le bandeau d’acceptation des cookies… il n’y en a pas !
PlausibleMais aussi ...
- Choix d’un hébergement web européen et plus conscient
- Réduction des animations
- Réduction de l’utilisation des images
- Réduction de la complexité des pages
- Privilégier les fonctionnalités essentielles
- Suivi du score des pages
- Communication sur nos scores et notre démarche
- Identification de nos points d’amélioration
- Définition d’une roadmap d’amélioration continue
Votre avis nous intéresse !
N’hésitez pas à nous contacter pour échanger sur le sujet et nous partager votre expérience de ce design d’éco-conception ! Grâce à vous nous progressons !
L’impact du numérique, un réel enjeu ?
Le numérique représente aujourd’hui 10% de la consommation électrique des Français (source : Ademe), ce qui représente, pour chaque Français :
- L’équivalent de la consommation électrique d’un radiateur de 1000 watts alimenté sans interruption pendant 30 jours.
- Le même impact environnemental qu’un trajet de 2 259 km en voiture (un peu comme si vous décidiez de relier Strasbourg à Marseille en passant par Lille, Brest et Bordeaux).
L’impact le plus important du numérique réside lors de la fabrication de nos smartphones et ordinateurs : 78% de l’impact environnemental est lié à la fabrication et 21% concerne son usage. À l’échelle de l’usage, nous réduisons le poids des requêtes et nous améliorons les parcours utilisateur ; pour toucher les impacts liés à la fabrication, nous travaillons à lutter contre l’obsolescence programmée de nos terminaux pour les conserver plus longtemps.
Impact en émissions de GES de quelques usages et objets du quotidien
216g eq CO2
1 km en voiture
187g eq CO2
1 œuf
40g eq CO2
1 pomme
8g eq CO2
1h de visio conférence
6.6g eq CO2
1 cigarette
2g eq CO2
1 km en TGV
1.3g eq CO2
Une email avec pièce jointe de 1 Mo
135kg eq CO2
Fabrication d'un laptop
36kg eq CO2
Fabrication d'un liseuse
20kg eq CO2
12h de streaming par semaine pendant 1 an
8kg eq CO2
20h de visio par semaine pendant 1 an
5.6kg eq CO2
1 steak haché de bœuf
5.2kg eq CO2
Fabrication d'un T-shirt
4kg eq CO2
4 km en voiture
3.5kg eq CO2
50 emails envoyés par semaine pendant 1 an
1kg eq CO2
500 km en TGV
187g eq CO2
1 œuf
769kg eq CO2
5 000 km en avion
135kg eq CO2
Fabrication d'un laptop
110kg eq CO2
500 km en voiture
31kg eq CO2
Fabrication d'un smartphone
5.6kg eq CO2
1 steak haché de bœuf
5.2kg eq CO2
Fabrication d'un T-shirt
Questions fréquentes
-
Qu'est-ce que l'éco-conception d'un site internet ?
L’écoconception d’un site internet consiste à concevoir et développer un site de manière à minimiser son impact environnemental. Cette approche vise à réduire la consommation d’énergie, les émissions de gaz à effet de serre et à optimiser l’utilisation des ressources.
-
Comment réduire la consommation d'énergie d'un site web ?
Il existe plusieurs moyens de réduire la consommation d’énergie d’un site web, tels que l’optimisation du code, la compression des images et des fichiers, l’utilisation de caches pour réduire les requêtes serveur et l’hébergement sur des serveurs écoénergétiques.
-
En quoi l'éco-conception est-elle bénéfique pour le SEO ?
Opter pour une éco-conception web peut améliorer le référencement du fait d’un temps de chargement réduit, d’un taux de rebond diminué, d’une expérience utilisateur optimisée et d’un temps de réponse serveur accéléré.
-
Comment s'y prendre pour rendre les images d'un site plus légères ?
Il convient de les compacter tout en préservant leur qualité en utilisant des utilitaires de compression en ligne. Ajustez leur résolution et privilégiez des formats comme JPEG, WebP ou AVIF.
-
Existe-t-il des méthodes d'éco-conception spéciales pour les sites mobiles ?
Absolument. Pour un site mobile éco-conçu, il est recommandé d’adopter des designs adaptatifs, de parfaire l’optimisation des images et de limiter la taille des fichiers pour une performance optimale.
-
Est-ce qu'un hébergement dit “vert” peut avoir un impact sur le SEO ?
Effectivement, choisir un hébergement plus éco-responsable peut être bénéfique pour votre référencement. La durabilité est de plus en plus valorisée par les moteurs de recherche.
-
Comment mesurer l'impact environnemental d'un site internet ?
Pour mesurer l’impact environnemental d’un site internet, vous pouvez utiliser des outils en ligne, comme EcoIndex
-
Pourquoi l'écoconception d'un site web est-elle importante ?
L’écoconception d’un site web est importante car Internet est une source majeure de consommation d’énergie et de pollution. En adoptant des pratiques d’écoconception, on peut réduire cet impact et contribuer à la préservation de l’environnement.
-
Comment allier économie d'énergie et SEO pour un site ?
Optimisez votre code en évacuant l’inutile, compactez vos fichiers CSS et JavaScript, compressez vos images et recourez à des caches et à un hébergement plus responsable.
-
Qu'est-ce que l'optimisation du code d'un site web ?
L’optimisation du code d’un site web consiste à écrire un code propre, efficace et léger, afin de réduire la consommation d’énergie nécessaire à son exécution. Cela implique l’élimination des codes inutiles, l’utilisation de CSS et JavaScript minifiés, et l’optimisation des requêtes HTTP.
-
Comment limiter les émissions de gaz à effet de serre d'un site web ?
Pour limiter les émissions de gaz à effet de serre d’un site web, il est important de réduire les besoins en énergie du serveur d’hébergement. Cela peut être réalisé en choisissant un hébergeur qui utilise des sources d’énergie renouvelable, en optimisant les requêtes pour minimiser le temps de réponse du serveur, et en mettant en place des mécanismes de mise en veille automatique des serveurs inactifs.
-
Comment gérer efficacement les ressources d'un site web ?
La gestion efficace des ressources d’un site web implique de minimiser l’utilisation des ressources du serveur, telles que la bande passante, la mémoire et le stockage. Cela peut être réalisé en utilisant la mise en cache, en compressant les fichiers, en optimisant les images, en limitant l’utilisation des scripts externes et en utilisant des formats de fichiers optimisés.
-
Quels sont les avantages de l'écoconception d'un site web ?
L’écoconception d’un site web présente plusieurs avantages, notamment la réduction des coûts d’hébergement, l’amélioration des performances du site, l’optimisation du référencement (SEO), l’amélioration de l’expérience utilisateur et la contribution à la protection de l’environnement.
-
Existe-t-il des normes ou des certifications pour l'écoconception des sites web ?
Oui, il existe plusieurs normes et certifications pour l’écoconception des sites web, telles que le label “Green Web Foundation” et la norme ISO 14001. Ces normes et certifications permettent de reconnaître les sites web qui adoptent des pratiques plus respectueuses de l’environnement.
Nos retours d'expérience
-
Mathias Fryde, consultant au studio d’éco-conception numérique de l’Agence 148
“En éco-conception, le challenge est de créer un site dynamique, avec une organisation et un design qui reflètent l’image de la marque tout en respectant les bonnes pratiques d’éco-conception, parfois ressenties comme des contraintes : des pages ni trop longues, ni trop complexes, et peu d’image. En un mot : faire simple, beau et efficace !
Ce qui compte, c’est le parcours complet du visiteur pour atteindre son objectif, par exemple demander un devis ou trouver votre adresse, qui doit être le plus court possible pour limiter l’impact de sa visite. Il faut donc identifier ses besoins en amont puis optimiser les parcours sur le plan de la navigation, mais aussi techniquement.
J’ai été ravi de travailler avec l’équipe de B Lab France qui a pleinement adhéré à cette démarche et accepté les ajustements que nous leur avons proposés.” -
Bastien Teixeira, développeur full stack au studio d’éco-conception numérique de l’Agence 148
“Le challenge dans l’éco-conception, c’est de créer un site avec de belles animations, de l’interaction, qu’il soit créatif sans que cela coûte en performance et en ressources. Nous devons garder à l’esprit ce que Blab France doit transmettre à travers son site, tout en respectant les bonnes pratiques et démarches de l’éco-conception.”
-
Marion Bahy, consultante au studio d’éco-conception numérique de l’Agence 148
“Travailler sur une démarche complète et approfondie d’écoconception numérique est une expérience en soi. C’est une dynamique collective et fédératrice, qui demande des discussions, des allers/retours, des compromis. Et elle touche à la globalité du projet : stratégie, design, développement, expérience utilisateur.
Tout est mis en perspective dans une approche prospective et pédagogique. Faire de l’éco-conception numérique permet de situer le projet au cœur de nos préoccupations sociétales et environnementales, et de redonner du sens à notre travail. Merci à toute l’équipe de B Lab France de donner de la place à ces questions, un vrai plaisir de travailler à leurs côtés !. -
Kilian Goujon, co-fondateur de l’Agence 148
“Le numérique est une part importante de nos émissions de CO2 et est, hélas, en constante expansion. Agir pour un numérique responsable dès la conception est une manière de contribuer à une réduction de notre empreinte carbone collective tout en garantissant une meilleure accessibilité et de bonnes performances. On doit aller à l’essentiel, tout en conservant une expérience de navigation fluide et enrichissante. Il faut faire preuve de créativité pour sortir de nos anciens schémas du “toujours plus” et apporter une vision créative et joyeuse qui fasse enfin taire les grincheux qui font rimer sobriété avec ennui ! Cette ambition est partagée par les membres talentueux du studio d’écoconception numérique de l’Agence 148 !
-
Louise Seguin, B Lab France, Responsable Communication
“En tant qu’association B Lab France, nous sommes fiers mais restons humbles, en raison du travail intense que nous avons consacré à l’écoconception et au parcours plus sobre de notre nouveau site web avec les équipes de 148. Nous avons pris en compte les différentes sensibilités des utilisateurs et les usages plus sobres que notre navigation peut (r)éveiller et proposer. Nous sommes conscients de la responsabilité cruciale qui est la nôtre, car elle dépasse largement la simple refonte d’un site web. Nous croyons fermement que l’écoconception web est une première étape essentielle vers un numérique plus responsable, ancré dès la source même de nos architectures web. En intégrant ces pratiques dès le départ, nous contribuons à réduire l’empreinte environnementale du numérique, tout en sensibilisant nos utilisateurs aux avantages d’un Internet moins gourmand en énergie. C’est un pas important à notre échelle vers un avenir où la technologie et la durabilité marchent main dans la main pour un impact positif à plus long terme.”
-
Remerciements
Un grand merci à l’équipe de l’agence 148 pour avoir réalisé ce travail, à l’équipe B Lab d’avoir fait naître ce nouveau site.
Merci à la communauté OpenSource d’avoir mis à disposition des outils, des bonnes pratiques et des solutions pour réaliser notre projet :
- Ecoindex cli et Ecoindex, pour le calcul d’empreinte GES
- Facil’IT, solution d’accessibilité numérique
- Plausible, solution d’analytics sans collecte de données personnelles
Votre avis nous intéresse !
N’hésitez pas à nous contacter pour échanger sur le sujet et nous partager votre expérience de ce design d’éco-conception ! Grâce à vous nous progressons !