Le numérique pollue, ce n’est un secret pour personne. Avec 3,7% des gaz à effet de serre mondiaux, le secteur est encore loin d’être écologique. Il ne le sera d’ailleurs sans doutes jamais totalement mais de nombreuses actions peuvent limiter ses impacts négatifs. L’un d’entre eux est de mieux concevoir les sites internet. Mais, comment concevoir un site web écologique ? Avec ou sans CMS, voici comment éco-concevoir votre site internet et limiter son empreinte carbone.

Dans la pratique, éco-concevoir un site web vise à réduire son impact environnemental lors de toutes les phases de son cycle de vie. Ainsi, un site web éco-conçu sera designé, développé et hébergé de façon plus respectueuse de l’environnement. Toutes les actions faites lors de la phase de conception auront un impact lorsque les internautes utiliseront le site. Pour avoir une explication plus détaillée de ce qu’est l’éco-conception web, je vous invite à aller voir cet article. Ici, nous allons évoquer le « comment ».

Dans le cadre d’un site internet écologique, on va le concevoir pour qu’il dure dans le temps. Cela permettra de limiter la rapidité d’exécution de son cycle de vie et pour limiter son impact à chaque utilisation.

Sommaire

Éco-concevoir un site web : le design

  • La frugalité est la clé
  • Alternatives aux animations
  • Qu’en est-il des CMS ?
  • Focus sur les images

Éco-concevoir un site web : le développement

Éco-concevoir un site web : l'hébergement

  • Agir sur l’énergie nécessaire aux serveurs
  • Utiliser l’énergie des serveurs
  • Les certifications des hébergements

Conclusion

Eco-concevoir un site web : le design

Dans la conception d’un site web respectueux de l’environnement, le design est la première chose à réfléchir. En effet, tout design superflu peut entraîner de la lourdeur dans le code final. De plus, plusieurs études démontrent que 45% des fonctionnalités demandées par les utilisateurs ne sont jamais utilisées. Il s’agit donc de réfléchir à l’impact qu’aura le design créé et donc de la nécessité des éléments intégrés. Dans une démarche d’éco-conception, le mot d’ordre est la sobriété.

La frugalité est la clé

Premièrement, lors de la phase de design, il est important de réfléchir à l’arborescence du site. Cet élément est à la base du site. Il doit être pensé de manière à rentrer dans une démarche de frugalité. En effet, toute page superflue, où le contenu peut être optimisé et placé sur une autre page, doit être supprimée. Plus on régule la quantité de pages et de contenu à ceux indispensables, plus on va limiter la pollution inutile.

Il est ensuite important de réfléchir à tous les éléments que l’on compte intégrer au site et à leur utilité. Tous les médias (images, vidéos) ont un impact sur le poids de la page. Veillez donc à ne mettre que des médias nécessaires à votre site et en éviter l’excès. Pour cela, pensez à privilégier une photo de groupe plutôt que des dizaines de photos individuelles pour présenter votre équipe. Vous gardez ainsi le dynamisme dans la page mais optimisez son contenu !

Alternatives aux animations

De même, toute animation ou fonctionnalité apportant de l’animation peut peser lourd dans la page. Par exemple, évitez les vidéos en autoplay (qui se lancent automatiquement à l’arrivée sur la page) ou les sliders. Cela permet d’alléger les requêtes faites au serveur et ainsi limite le temps de chargement de la page. Ces animations ont une efficacité en terme d’UX discutée et peuvent facilement être remplacées par des alternatives. Dans le cas d’une vidéo en autoplay, on peut par exemple décider de mettre simplement la vidéo et de laisser à l’utilisateur le choix de l’activer ou non. Pour le slider, pensez à mettre une photo avec un bouton vers le contenu qui vous intéresse. Pour la plupart des sites, cela fait largement l’affaire. Le tout est de réfléchir à l’utilité et la nécessité de ces animations. « Permettent-elles de mieux comprendre mon entreprise ? Que se passe-t-il si je les enlève ? » 

Qu'en est-il des CMS ?

De même, c’est à cette étape là que les CMS peuvent aider à la construction d’un site. Le choix du CMS n’a que peu d’impact au niveau environnemental mais le thème choisi, lui, oui. En effet, sur les plateformes vendeuses, on peut retrouver des thèmes avec énormément de fonctionnalités, d’animations ou autre. Vous imaginez bien avec ce qui a été déjà évoqué au préalable, qu’il peut y avoir des éléments superflus. Pour dénicher les thèmes les moins lourds, préférez les thèmes “lightweight” et examinez-les à l’aide d’outils comme GTMetrix ou EcoIndex. Ceux-ci vont vous permettre de savoir le nombre de requêtes faites au serveur, le temps de chargement des pages etc. Même s’il est possible d’enlever des fonctionnalités et contenus au thème choisi, une grande partie du travail peut se faire sur le choix de celui-ci.

éco-concevoir un site web : la frugalité

Je parlais précédemment de construire un site pour qu’il dure dans le temps. Cela passe d’abord par le design. En effet, un site qui suit une tendance design peut moins durer dans le temps et peut paraître “vieux” après la mode passée. Il n’est pas rare de voir des sites web se refaire une beauté seulement 2 ans après leur création. Cela ne rentre malheureusement pas dans une démarche d’éco-conception. Pour limiter l’impact écologique d’un site, il est important que son cycle de vie soit rallongé.

Focus sur les images

Selon le format, la taille et la quantité d’images sur une page, celle-ci peut s’avérer très lourde et donc demander plus d’énergie au chargement. Pour limiter cet impact, laissez les images inutiles et privilégiez celles qui sont importantes sur votre site comme un logo ou une photo d’équipe par exemple.

Ensuite, il en convient de choisir le format des images. Selon l’utilisation de celles-ci, différents formats peuvent être intéressants : le format GIF est léger et peut être très utile pour une image animée, en alternative à un format vidéo. Les formats PNG et JPEG ont été conçus spécialement pour le web et sont donc légers. En JPEG il y a la possibilité de compresser plus ou moins l’image, celle-ci peut donc être moins lourde au chargement. De même, le format SVG peut être une bonne alternative pour des icônes car celui-ci peut être plus léger qu’une image. Cela dépend des cas.

Il est aussi important de gérer la taille des images du site. En effet, importer une image de 500x500px pour la réduire à 200px à partir du code demande de l’énergie au navigateur qui doit faire ce réglage. Le plus simple et écologique est donc de réduire la taille de votre image au préalable en passant par des logiciels offline spécialisés comme Photoshop.

Eco-concevoir un site web : le développement

Quand on développe un site web, de nombreuses lignes de code inutiles peuvent l’alourdir. Diminuer les lignes de code reviendrait donc à réduire le temps de chargement du site et donc, de l’énergie nécessaire. Cette pratique, qui vise à limiter l’impact environnemental du développement, est aussi appelée “green code”. Pour aider cette pratique, plusieurs outils existent comme Unused CSS qui permettent de déceler le code inutile et le supprimer ou GTMetrix qui mettent en lumière ce qui alourdit le site.

A chaque visiteur sur un site, celui-ci demande au serveur de lui charger une page, c’est une requête. Le serveur va alors charger tous les fichiers constituant le site web. Or, certains fichiers sont chargés sans qu’il soit nécessaire à la page actuelle, c’est ici aussi qu’il peut y avoir un changement à faire. En bloquant le chargement de fichiers inutiles, vous minimisez l’énergie nécessaire au chargement de la page. Par exemple, il n’est pas nécessaire de charger une police si celle-ci n’est pas utilisée dans la page. Un référentiel de bonnes pratiques pour un développement web plus responsable a été créé par la communauté du Green code Lab. On peut y retrouver toute la ressource nécessaire pour coder dans une démarche d’éco-conception.

Eco-concevoir un site web : l'hébergement

Même en réduisant tant bien que mal l’énergie nécessaire à notre site web, celui-ci aura toujours besoin d’énergie pour tourner. Le serveur qui stock les fichiers qui constituent le site fonctionne 24h/24 et 7j/7. Il va émettre de la chaleur en fonctionnant et va donc avoir besoin d’être refroidi. C’est sur les trois points (énergie nécessaire au fonctionnement, nécessaire au refroidissement et produite par le serveur) qu’un hébergeur peut s’avérer plus éco-responsable qu’un autre. Un aspect de l’éco-conception web est donc de choisir un hébergement web écologique.

Agir sur l’énergie nécessaire aux serveurs

Premièrement, pour alléger l’impact environnemental de l’énergie nécessaire à faire tourner les serveurs, celle-ci peut provenir d’énergies renouvelables. C’est le cas des hébergeurs tels que Ikoula et PlanetHost. Ensuite, il est possible de mesurer l’efficacité énergétique (PUE) des data centers. Cette référence internationale permet de mesurer le ratio entre l’énergie totale consommé par le data center et l’énergie nécessaire seulement au fonctionnement des serveurs. Ainsi, si un data center limite sa consommation d’énergie (en refroidissant les serveurs par de l’air extérieur par exemple) celui-ci voit son PUE descendre. L’idéal pour un data center éco-responsable est donc de descendre le plus proche de PUE 1. Pour exemple, Aonyx, hébergeur auvergnat, a un PUE égal à 1,2 et Infomaniak, hébergeur suisse, a un PUE < 1,1.

Utiliser l'énergie des serveurs

Ensuite, n’oublions pas que notre serveur va lui aussi produire de la chaleur et donc, de l’énergie. Certains hébergeurs en profitent pour ré-utiliser cette chaleur pour chauffer des habitations ou des installations municipales. Cette forme d’énergie est encore peu développée du fait de sa température : la chaleur émise par les serveurs ne dépasse pas les 50° quand une énergie thermique classique tourne plutôt autour des 80°. La réutilisation de cette énergie peut cependant réduire l’impact environnemental de l’hébergeur. 

Les certifications des hébergements

D’autres bénéfices environnementaux sont pratiqués chez des hébergeurs. Certains comme Infomaniak ont des certifications ISO 14001 qui leur obligent à respecter des normes environnementales ou ISO 50001 pour des normes énergétiques durables. De même, certains hébergeurs comme HostPapa passent aussi par de la compensation en énergie renouvelable. C’est-à-dire qu’ils achètent l’équivalent de la totalité de l’énergie utilisée par leurs serveurs en énergie renouvelable. Dans le choix d’un hébergement plus responsable, le plus important et de regarder les certifications PUE, ISO ou autres qui peuvent valider les dires des hébergeurs.

Conclusion

Avec tous ces petits changements effectués durant les différentes étapes de conception et de fonctionnement du site, il est simple de réduire son impact. On pense souvent que remplacer une image par une autre plus légère ou limiter une des animations ne changera rien, mais c’est faux. Une image sera chargée à chaque nouvel utilisateur sur votre site, elle peut donc avoir un impact. Beaucoup d’avantages concrets peuvent être vus sur un site web écologique, que ce soit pour ses créateurs, les utilisateurs et la planète. Rentrer dans une démarche d’éco-conception permet une prise de conscience sur l’impact que le numérique peut avoir sur l’environnement et ainsi d’aider à limiter cet effet négatif.

[bctt tweet= »Rentrer dans une démarche d’éco-conception permet une prise de conscience sur l’impact que le numérique peut avoir sur l’environnement et ainsi d’aider à limiter cet effet négatif. »]

Bonnes pratiques, Green IT

A propos de l'auteur

Alizée Colin

Fondatrice & rédactrice

UX/UI designeuse, j’aspire à recentrer le web et ses outils dans un objectif de bien commun, tant bien environnemental que social. Nous sommes dans une ère où nous nous devons de réinventer notre manière de concevoir et de communiquer. Le numérique responsable en fait partie. Changeons les choses.

Voir tous les articles