Le numérique pollue. Le secteur représente environ 4% des émissions mondiales de gaz à effet de serre, davantage que l'aviation civile. Dans ce contexte, chaque site web a un coût environnemental. La bonne nouvelle : réduire l'empreinte carbone de votre site améliore aussi ses performances et l'expérience utilisateur.
Comprendre l'empreinte carbone d'un site
Quand un utilisateur charge une page : un serveur dans un data center consomme de l'électricité, les données transitent par des routeurs énergivores, l'appareil de l'utilisateur consomme pour afficher la page. La page web moyenne pèse 2,5 Mo aujourd'hui (1,2 Mo en 2015). Une grande partie de ce poids est superflue : images non optimisées, scripts inutilisés, polices surdimensionnées, trackers empilés.
Les principes de l'éco-conception web
Principe 1 : ne charger que le nécessaire. Chaque élément doit justifier sa présence. Principe 2 : optimiser tout ce qui reste. Images compressées, code minifié, cache agressif, lazy loading. Principe 3 : concevoir pour la durée. Un site qui fonctionne sur des appareils anciens et connexions lentes.
Chez Go To Agency, nous intégrons ces principes dès la conception de chaque projet.
Les chiffres qui comptent
Mettre des mots sur l'impact carbone du web est une chose ; le quantifier en est une autre. Une page web génère en moyenne 0,5 à 1 gramme de CO2 par visite, selon le Website Carbon Calculator. Ce chiffre paraît minuscule, mais il s'accumule vite. Un site qui reçoit 100 000 visites par mois émet entre 600 et 1 200 kg de CO2 par an — soit l'équivalent d'un aller-retour Paris-Marseille en avion, chaque mois, pour un seul site.
La conséquence directe : réduire le poids d'une page de 50% divise son empreinte carbone par deux, sans aucune compensation ni artifice. C'est de la sobriété numérique appliquée, pas du green-washing.
Les choix technologiques influencent fortement ce poids de base. En production, une page WordPress standard pèse entre 3 et 5 Mo (thèmes lourds, plugins empilés, requêtes multiples). Une page équivalente construite avec Next.js en mode statique oscille entre 0,5 et 1,5 Mo — trois à dix fois plus légère, sans sacrifier les fonctionnalités. Ce n'est pas un hasard si nous privilégions les architectures modernes dans nos projets.
Optimiser les images
Les images représentent 50% du poids d'une page. Formats modernes : WebP et AVIF réduisent le poids de 30 à 50% vs JPEG. Dimensionnement : servez des images à la bonne taille avec srcset. Lazy loading : l'attribut loading="lazy" suffit. Questionnez chaque image : 5 images bien choisies ont plus d'impact que 15 moyennes. C'est l'approche de nos sites vitrine.
Réduire le JavaScript
Si les images sont le premier poste en poids brut, le JavaScript est la ressource la plus coûteuse en termes de traitement. Un fichier image de 500 Ko s'affiche ; un fichier JS de 500 Ko doit être téléchargé, parsé, compilé, puis exécuté — quatre étapes qui mobilisent le processeur de l'appareil, consomment de la batterie et bloquent l'affichage.
Le problème : le site web moyen charge aujourd'hui plus de 500 Ko de JavaScript, dont une part significative n'est jamais exécutée. Les causes classiques sont les bundlers mal configurés, les bibliothèques importées en intégralité pour n'utiliser qu'une fonction, et les trackers tiers qui s'accumulent.
Les leviers concrets sont au nombre de trois. Le tree-shaking consiste à éliminer automatiquement le code mort à la compilation — tous les bundlers modernes (webpack, esbuild, Rollup) le supportent, à condition de ne pas importer en import *. La substitution par les API natives permet de remplacer des bibliothèques entières : Fetch remplace Axios, querySelector remplace jQuery, l'API Intl remplace moment.js. Enfin, le code splitting fractionne le bundle pour n'envoyer au navigateur que le code nécessaire à la page affichée. Pour aller plus loin sur ce sujet, notre article sur l'optimisation des performances web détaille les stratégies de chargement.
Hébergement vert
Le choix de l'hébergeur a un impact direct. Critères : énergie renouvelable, PUE optimisé, localisation géographique (le mix électrique français est peu carboné). Hébergeurs écoresponsables en France : Infomaniak (100% renouvelable), o2switch, Scaleway.
L'architecture compte aussi. Un site statique (Next.js, Hugo, Astro) consomme beaucoup moins qu'un site dynamique. Notre comparatif Vercel, Netlify et Cloudflare Pages détaille ces options. Les CDN réduisent la distance parcourue par les données.
Les polices web sobres
Les polices web sont un angle mort de l'éco-conception. Charger une Google Font, c'est en réalité envoyer une requête vers les serveurs de Google, récupérer une feuille CSS, puis télécharger les fichiers de police eux-mêmes. Selon la famille et les variantes demandées, une seule Google Font peut ajouter 100 à 400 Ko au poids d'une page, plus une latence liée à la requête externe.
La solution la plus sobre est le system font stack : utiliser les polices déjà installées sur l'appareil de l'utilisateur. La déclaration CSS font-family: system-ui, -apple-system, sans-serif donne un rendu propre, moderne, et à coût zéro. Les grands acteurs comme GitHub ou Medium utilisent cette approche.
Si votre identité de marque exige une police personnalisée, le contrat est clair : utilisez le format WOFF2 (compression supérieure au WOFF), générez un sous-ensemble (subset) limité aux caractères réellement utilisés — l'alphabet latin de base couvre la grande majorité des besoins en français — et limitez-vous à deux familles de polices maximum sur l'ensemble du site. Chaque variante supplémentaire (bold, italic, semi-bold) est un fichier de plus à télécharger.
Performance = durabilité = business
Ce qui est bon pour l'environnement est bon pour les performances. Un site léger charge plus vite, convertit mieux, et Google le favorise. Chaque seconde de chargement supplémentaire réduit les conversions de 7%. Travailler la durabilité, c'est aussi travailler votre référencement SEO.
L'obligation légale qui arrive
L'éco-conception web n'est plus seulement une démarche volontaire. En France, la loi REEN (Réduction de l'Empreinte Environnementale du Numérique), promulguée fin 2021, pose les premiers jalons d'une réglementation contraignante pour le numérique. Elle cible dans un premier temps les grandes entreprises et les services publics, mais son périmètre est amené à s'élargir progressivement, avec des décrets d'application en cours d'adoption.
Pour les entreprises qui répondent à des appels d'offres publics, les critères environnementaux pèsent déjà dans la notation des dossiers. Un site éco-conçu, mesurable et documenté devient un argument différenciant face à des concurrents qui n'ont pas encore entamé cette démarche. Anticiper la réglementation, c'est sécuriser ses marchés.
Au-delà du cadre légal, l'éco-conception est un signal fort envoyé à vos clients et partenaires : vous prenez vos responsabilités, vous êtes capable de construire des choses robustes et efficaces. Dans un contexte où les critères RSE influencent de plus en plus les décisions d'achat B2B, c'est un avantage compétitif concret, pas un argument marketing creux.
Mesurer l'impact
Website Carbon Calculator estime le CO2 par visite. EcoIndex attribue une note de A à G. Lighthouse mesure les performances corrélées à l'empreinte. Intégrez ces mesures dans votre processus de développement.
Checklist pratique
Quick wins : compresser en WebP, activer lazy loading, supprimer scripts inutilisés, activer le cache, minifier CSS/JS. Actions structurantes : hébergeur vert, CDN, réduire les dépendances JS, polices en WOFF2 sous-ensemble. Démarche globale : éco-conception dans les cahiers des charges, formation des équipes, mesure continue.
Un site éco-conçu est un site intelligent, performant et pérenne. Contactez-nous ou demandez un devis pour un audit de performance et d'éco-conception.
