{"id":762,"date":"2023-09-26T10:18:51","date_gmt":"2023-09-26T08:18:51","guid":{"rendered":"https:\/\/carbonuniversity.fr\/?p=762"},"modified":"2024-04-15T12:43:16","modified_gmt":"2024-04-15T10:43:16","slug":"website-co2-footprint-management","status":"publish","type":"post","link":"https:\/\/carbonuniversity.fr\/fr\/resources\/comment-mesurer-et-reduire-lempreinte-co2-de-votre-site-web-application","title":{"rendered":"Comment mesurer et r\u00e9duire l'empreinte CO2 de votre site web\/application."},"content":{"rendered":"

<\/p>\n\n\n\n

Les \u00e9missions de gaz \u00e0 effet de serre li\u00e9es \u00e0 un site web peuvent \u00eatre calcul\u00e9e en quelques \u00e9tapes, avec une pr\u00e9cision raisonnable en fonction des donn\u00e9es partag\u00e9es par le fournisseur d'h\u00e9bergement et des donn\u00e9es de trafic disponibles. Une fois le volume des \u00e9missions de CO2 li\u00e9es \u00e0 votre site web connu, vous pouvez prendre des mesures simples et mesurables pour r\u00e9duire les \u00e9missions.<\/p>\n\n\n\n

I. La th\u00e9orie : comprendre la m\u00e9thode de calcul des \u00e9missions de CO2 li\u00e9es \u00e0 un site web\/une app<\/strong><\/h5>\n\n\n\n

1. Calculate server emissions \/GB<\/strong><\/p>\n\n\n\n

Identifiez le fournisseur d'h\u00e9bergement et l'emplacement du serveur o\u00f9 votre site web est h\u00e9berg\u00e9. Les diff\u00e9rents fournisseurs d'h\u00e9bergement ont des niveaux d'efficacit\u00e9 \u00e9nerg\u00e9tique variables et peuvent utiliser un m\u00e9lange d'\u00e9nergie diff\u00e9rent (nucl\u00e9aire, \u00e9nergies renouvelables, gaz, charbon, etc.) pour alimenter leurs data centers.<\/p>\n\n\n\n

Contactez votre h\u00e9bergeur ou consultez la documentation pour obtenir des informations sur les kCO2e \u00e9mis pour chaque Go transf\u00e9r\u00e9. Il s'agit du facteur d'\u00e9mission que vous utiliserez dans vos calculs. <\/p>\n\n\n\n

Si votre h\u00e9bergeur ne communique pas ces informations, c'est un probl\u00e8me et vous devriez envisager de travailler avec un autre h\u00e9bergeur, mais vous pouvez tout de m\u00eame utiliser les donn\u00e9es moyennes d'\u00e9missions de CO2 pour les serveurs.<\/p>\n\n\n\n

Exemple, pour un h\u00e9bergeur :<\/span> Les \u00e9missions du datacenter AWS EU west 3 sont de 0.000058kgCO2e\/GB, soit 58gCO2e\/mb.<\/p>\n\n\n\n

2. Effectuer une analyse des ressources du site web pour chaque page afin de d\u00e9terminer le volume de donn\u00e9es transf\u00e9r\u00e9es par page.<\/strong><\/p>\n\n\n\n

Chaque fois qu'un utilisateur visite une page de votre site web, les fichiers du site web sont transf\u00e9r\u00e9s via internet pour que la page soit charg\u00e9e sur l'appareil de l'utilisateur. <\/p>\n\n\n\n

\"\"
Schema by Hostinger<\/figcaption><\/figure>\n\n\n\n

Il est n\u00e9cessaire d'analyser les ressources utilis\u00e9es par votre site web, telles que les images, les polices et les vid\u00e9os. <\/p>\n\n\n\n

Pour chaque page, vous devez calculer la taille en kb des donn\u00e9es transf\u00e9r\u00e9es pour charger le contenu de votre page. <\/p>\n\n\n\n

Exemple, pour une page : <\/span><\/p>\n\n\n\n

Polices : 90 kb<\/p>\n\n\n\n

Images : 550kb<\/p>\n\n\n\n

Video : 840 kb<\/p>\n\n\n\n

Donn\u00e9es transf\u00e9r\u00e9es : 1.480kb = 1.48mb<\/p>\n\n\n\n

Si vous disposez de donn\u00e9es plus pr\u00e9cises sur le comportement des utilisateurs de votre page web, vous pouvez les utiliser pour am\u00e9liorer la pr\u00e9cision de votre calcul. Par exemple, si seulement 20 % des utilisateurs choisissent de lire la vid\u00e9o, vous pouvez en tenir compte dans votre calcul (90+550+840\u00d70,4=976kb). <\/p>\n\n\n\n

3. Multiplier par le trafic web pour chaque page afin de calculer les \u00e9missions totales de CO2 associ\u00e9es \u00e0 la page.<\/strong><\/p>\n\n\n\n

En utilisant votre outil d'analyse de trafic (Google Analytics par exemple), multipliez le volume transf\u00e9r\u00e9\/page par le trafic de chaque page, sur la p\u00e9riode consid\u00e9r\u00e9e.
Exemple, pour une page :<\/span><\/p>\n\n\n\n

Facteur d'\u00e9mission de votre h\u00e9bergeur : 26g CO2 par mb<\/p>\n\n\n\n

Volume de donn\u00e9es de la page : 976kb<\/p>\n\n\n\n

Visites de la page en 2022 : 15.264<\/p>\n\n\n\n

Emissions de CO2 pour une visite de la page = 26\u00d70.976 = 25,4g CO2e\/visite<\/p>\n\n\n\n

Emissions de CO2 pour la page en 2022 = 15.264\u00d70.0254 = 387,7 kg CO2e<\/p>\n\n\n\n

<\/p>\n\n\n\n

II. En pratique : les outils pour calculer facilement les \u00e9missions li\u00e9es \u00e0 votre site web\/app<\/strong><\/h5>\n\n\n\n

La m\u00e9thode expliqu\u00e9e en I. peut \u00eatre mise en place rapidement en utilisant un outil en ligne de calcul des \u00e9missions de votre site. <\/p>\n\n\n\n

Tout d'abord, votre fournisseur d'h\u00e9bergement peut disposer d'un outil de calcul de l'empreinte CO2<\/strong> qui vous donne l'empreinte CO2 de votre site web sur une p\u00e9riode donn\u00e9e, en tenant compte du trafic r\u00e9el et du volume de donn\u00e9es transf\u00e9r\u00e9es par votre site web. C'est de loin l'option la plus simple et la plus pr\u00e9cise. Ces informations peuvent \u00e9galement \u00eatre disponibles sur votre tableau de bord ou sur vos factures. <\/p>\n\n\n\n

AWS par exemple propose un calculateur CO2<\/a> \u00e0 ses clients.<\/p>\n\n\n\n

SI vous ne disposez pas d'informations plus pr\u00e9cises de votre fournisseur, vous pouvez utiliser un outil en ligne gratuit comme Website Carbon<\/a><\/strong> enable you to calculate easily the footprint of a web page. <\/p>\n\n\n\n

\"\"
Capture d'\u00e9cran de https:\/\/www.websitecarbon.com\/<\/a> <\/figcaption><\/figure>\n\n\n\n

<\/p>\n\n\n\n

III. Comment r\u00e9duire les \u00e9missions de CO2 li\u00e9es \u00e0 votre site web\/app? <\/strong><\/h5>\n\n\n\n
\ud83d\uddfa\ufe0fSimplifiez autant que possible l'exp\u00e9rience utilisateur (UX)<\/strong><\/h6>\n\n\n\n

Les utilisateurs doivent pouvoir trouver le contenu qu'ils souhaitent et effectuer les actions n\u00e9cessaires de la mani\u00e8re la plus simple possible. Une exp\u00e9rience utilisateur simple est une bonne chose pour votre entreprise, mais aussi pour l'empreinte CO2 de votre site web, car cela r\u00e9duit le nombre de pages visit\u00e9es \"par erreur\" par les utilisateurs lorsqu'ils cherchent quelque chose.<\/p>\n\n\n\n

\ud83d\udc78<\/strong>“C\u2019est pas Versailles ici!\u201d: optimisez les images, vid\u00e9os et polices<\/strong><\/h6>\n\n\n\n

Les vid\u00e9os et les images sont souvent les \u00e9l\u00e9ments qui contribuent le plus \u00e0 l'empreinte CO2 d'une page web. Ne les utilisez que lorsque c'est n\u00e9cessaire. <\/p>\n\n\n\n

Compresser les images avec des outils tels que TinyPNG<\/a> ou ShortPixel<\/a> r\u00e9duira le volume de transfert de donn\u00e9es sans changement notable de la qualit\u00e9. <\/p>\n\n\n\n

Pour les vid\u00e9os, \u00e9vitez \u00e0 tout prix les vid\u00e9os qui se lisent automatiquement (d'ailleurs personne n'aime \u00e7a). La qualit\u00e9 par d\u00e9faut doit \u00eatre HD\/720p ou inf\u00e9rieure (pas full HD ou 4K). <\/p>\n\n\n\n

As for fonts : use standard system fonts (Helvetica or Arial, for example), common fonts (Google Fonts<\/a> comme Roboto) ou si vous utilisez des polices personnalis\u00e9es, optez pour des formats de fichiers de polices web modernes tels que WOFF et WOFF2, qui utilisent des m\u00e9thodes de compression plus \u00e9lev\u00e9es que les formats de fichiers TTF, OFT et SVG.<\/p>\n\n\n\n

\"\"
Screenshot from Google Fonts website<\/figcaption><\/figure>\n\n\n\n

En r\u00e9duisant le volume des images, des vid\u00e9os et des polices charg\u00e9es, vous r\u00e9duirez les \u00e9missions de CO2 par visite tout en r\u00e9duisant le temps de chargement de votre page, ce qui renforcera votre r\u00e9f\u00e9rencement et am\u00e9liorera l'exp\u00e9rience utilisateur. <\/strong><\/p>\n\n\n\n

<\/p>\n\n\n\n

\ud83c\udf31Codez vert<\/strong><\/h6>\n\n\n\n

Garder le code aussi propre et simple que possible. \u00c9vitez le Javascript (qui alourdit la page web). Si vous utilisez un gestionnaire CMS tel que WordPress, Wix ou Shopify : \u00e9vitez les plugins inutiles et faites attention \u00e0 la taille des plugins que vous utilisez. <\/p>\n\n\n\n

L'utilisation de la mise en cache du serveur peut \u00e9galement contribuer \u00e0 r\u00e9duire les \u00e9missions de CO2 par visite pour les utilisateurs qui reviennent sur votre site web. <\/p>\n\n\n\n

<\/p>\n\n\n\n

\ud83d\udd0cChoisissez bien votre h\u00e9bergeur<\/strong><\/h6>\n\n\n\n

<\/p>\n\n\n\n

L'empreinte de votre site web d\u00e9pend ENORMEMENT de votre fournisseur d'h\u00e9bergement. Vous devez tenir compte de deux facteurs principaux : <\/p>\n\n\n\n