Site éco-conçu : 4 raisons de se lancer et exemples de sites

L'éco-conception web consiste à inclure, pour toute réalisation de produit ou service numérique, la notion de protection de l'environnement.

Les développeurs travaillent alors à concevoir un site éco-conçu, avec un impact environnemental le plus faible possible, afin d'avoir un site Internet le plus green possible.

Cette démarche s'inscrit tout au long du cycle de vie du site, qu'il s'agisse d'un site vitrine, un blog ou un e-commerce. Il faut prendre en considération toutes les ressources nécessaires pour son bon fonctionnement, pour se tourner vers la low-tech, ou en tout cas vers une production plus responsable.

En France, le digital représente jusqu'à 2.5 % des émissions de gaz à effet de serre (ou GES). Au niveau mondial, cela représente même entre 3 et 4 % des émissions de GES. Et ces chiffres ne cesseront pas d'augmenter si aucune action n'est entreprise.

Mais l'impact du numérique va bien au-delà de ces émissions, car son utilisation nécessite aussi de consommer des ressources (eau et énergie), souvent non renouvelables. La partie fabrication d'équipements est de loin la plus lourde, sa consommation de métaux annuelle est conséquente. Près de 34 milliards d'équipements sont en service aujourd'hui, avoir des sites éco-conçus permettraient d'éviter d'user nos ordinateurs et mobiles trop rapidement.

Il est donc essentiel de prendre des mesures pour que, à l'avenir, on limite et réduise cet impact sur la planète.

Que vous soyez propriétaire d'un site existant, ou que vous souhaitiez en créer un nouveau, la démarche de l'éco-conception peut demander un peu de travail, et beaucoup de temps. Mais les avantages sont nombreux.

Réduire l'impact environnemental du site web

En matière de protection de l'environnement, chaque geste compte. Créer un site éco-conçu fait partie de ces initiatives qui permettent de préserver autant que possible les ressources de la planète.

À son échelle, le site Internet éco-conçu agit alors contre le réchauffement climatique et contre tous les effets catastrophiques de la pollution, en réduisant ses besoins en énergie. L'impact se fait au moment du développement, mais aussi lors de l'utilisation par les internautes.

Par ailleurs, l'éco-conception web s'inscrit parfaitement dans la démarche RSE des entreprises. En apportant le sujet du site éco-conçu au cœur des entreprises, il devient une problématique RSE au même titre que les aspects sociétales ou économiques.

Faire des économies

Dans l'inconscient collectif, un produit écologique est forcément plus cher. Pourtant, cette théorie ne s'applique pas dans nos métiers, et plus précisément dans la production de sites web.

Un site éco-conçu mise sur la simplicité, la légèreté et la frugalité. Plus il est simple et rapide à charger, moins il dépense d'énergie, et plus il est avantageux financièrement.

Quant au choix de l'hébergement vert, les offres du marché sont aujourd'hui très concurrentielles, et opter pour un hébergeur éco-responsable n'est désormais pas plus cher.

Assurer une expérience utilisateur optimale

Si la légèreté du site web est un avantage sur les dépenses énergétiques, cela l'est aussi pour l'expérience utilisateur des internautes. La simplicité et la légèreté permettent un chargement très rapide du contenu et une navigation fluide, qui va à l'essentiel.

Rappelons d'ailleurs qu'un site épuré n'est pas forcément austère, et que le design lourd et agressif comme à l'époque du blog n'est plus du tout à la mode !

Améliorer le SEO du site web

Pour rester sur la qualité de l'expérience utilisateur, il est essentiel de savoir que l'UX compte énormément dans le référencement naturel d'un site éco-conçu. Le temps de chargement du contenu fait partie des enjeux majeurs des algorithmes des moteurs de recherche.

Faire de l'éco-conception ne se limite pas à l'optimisation technique des sites Internet, bien que cela soit essentiel. Tous les maillons de la chaîne de production entrent en jeu, que ce soit avec les designers, les développeurs, l'hébergeur et même la fabrication des équipements. Moins de renouvellement de matériel, c'est moins d'impact sur les ressources.

Chacun doit alors appliquer des bonnes pratiques pour avoir une vue d'ensemble qui permettra d'obtenir un site web moins énergivore, et donc moins polluant.

Le but est alors d'essayer d'obtenir des pages tout aussi performantes et design, tout en réduisant la pollution numérique.

Si vous souhaitez mettre votre site web au vert, plusieurs améliorations sont à envisager, et peuvent être mises en place plutôt facilement. Ces besoins peuvent être déterminés grâce à un audit éco-conception complet, comme peut le proposer une agence comme Lemon Interactive.

Aller à l'essentiel pour optimiser le chargement des pages

Pour appliquer l'éco-conception sur Internet, il est essentiel de ne pas en faire de trop, et de se contenter de fonctionnalités qui répondent aux besoins de l'utilisateur. Cela se rapproche, finalement, de ce qu'on attend dans les bases de l'UX (expérience utilisateur). Ainsi, si vous utilisez un CMS, vous pouvez, par exemple, supprimer les plugins que vous n'utilisez pas, car ils rallongent le temps de chargement de votre site, et alourdissent le code de vos pages.

Et si vous ne souhaitez pas forcément supprimer des contenus, vous pouvez en retarder l'application, pour que tous les fichiers ne soient pas chargés à chaque requête http. C'est possible, notamment, avec les fichiers CSS ou JavaScript.

Parmi les éléments facultatifs d'un site, on peut évoquer le slider d'une page d'accueil, les grandes images, les différentes polices, les vidéos… Tous ces contenus sont longs à charger, et sont donc énergivores. Sans parler du fait qu'ils impactent les performances de votre site, et pénalisent donc votre SEO.

De la même manière, il faut pouvoir assurer une optimisation technique du site web :

• Avec un code propre qui suit les standards W3C ;
• En optimisant les fichiers CSS et JS en les minifiant et compressant ;
• Des requêtes internes et externes réduites (vers la base de données, et donc le serveur).

Avoir une approche design simple et épurée

Le poids de la page est un enjeu fort pour l'éco-conception. Il faut absolument compresser au maximum les éléments, essayer de réduire le poids des photos, des vidéos, des documents… Tout doit être réduit au maximum, en utilisant des nouvelles normes de vidéos et d'images plus modernes et qui abîment moins l'image, tout en étant plus puissant au niveau de la compression.

Pour les vidéos, l'idée n'est pas forcément de ne plus du tout les utiliser, mais de les limiter. Sans les charger par défaut, uniquement si l'internaute clique sur un élément qui va déclencher la vidéo, ou en tout cas ne pas les lancer de manière automatique.

Il faut garder à l'esprit que plus un site éco-conçu est léger, moins il consomme. On essaie alors d'éviter d'intégrer certains contenus généralement facultatifs, ou en tout cas de les optimiser :

• Intégrer moins d'animations dans le contenu ;
• Limiter le nombre de polices d'écriture ;
• Optimiser l'utilisation des images, et choisir le bon format d'image, pour que le poids soit optimisé ;
• Réduire la quantité d'images ;
• Supprimer l'image, quand c'est possible, pour la remplacer par une forme dessinée qui pourra être vectorisée, et sera donc plus légère que des fichiers images.

L'objectif final est d'obtenir un site éco-conçu au design épuré et sobre, tout en assurant une ergonomie et un graphisme satisfaisant pour l'UX. On n'oubliera pas, alors, de conserver et d'optimiser la performance responsive, que ce soit sur smartphone, sur ordinateur ou sur tablette.

Avoir un hébergement vert

Toutes les données d'un site doivent être stockées sur un hébergement web. Alors, pour avoir une démarche responsable de bout en bout, il faut avoir un hébergement green, sur des serveurs qui ont des impacts CO2 positifs, ou qui font de la compensation carbone. C'est ce qu'on appelle le green hosting.

Il est alors essentiel de mettre les sites éco-conçus dans des serveurs green pour couvrir l'ensemble de la chaîne, dans un cycle respectueux de l'environnement.

Vous pouvez aussi vous tourner vers un hébergeur local, et favoriser les serveurs alimentés en énergies vertes et renouvelables.

Alors, prêt à plonger dans l'univers du site éco-conçu ? Les designs ne manquent pas pour préserver notre planète, un juste équilibre entre style et durabilité en adoptant des pratiques d'éco-conception astucieuses.

Avec des performances optimisées, des ressources minimisées et des technologies durables, ils nous montrent que la conception web peut être à la fois tendance et écoresponsable.

• Wikipédia : cela peut surprendre, c'est pourtant vrai ! Wikipédia est un peu le site éco-conçu d'origine. Simplicité, légèreté et clarté, il regroupe tous les détails pour une sobriété digitale ;
• EcoIndex : relativement évident aussi, EcoIndex est lui aussi un site éco-conçu ! Un bon moyen de non seulement vous inspirer, mais en plus de calculer votre l'empreinte environnemental ;
• Grenoble Alpes Métropole : exemple récent et institutionnel, la métropole est un site éco-conçu, multilingue et accessible ! Il est aussi travaillé dans son design que dans son optimisation. Un bel exemple à suivre ;
• Mind7 Consulting : un exemple important, puisqu'il est fait-maison par nos équipes ! Un travail de design conséquent pour une optimisation adaptée aux besoins du client. Une fierté qui va continuer avec nos autres clients qui souhaitent de l'éco-conception !

Toutes ces bonnes pratiques sont listées dans le livre Les 115 bonnes pratiques de l'éco-conception web, de Frédéric Bordage. Il a été mis au point en collaboration avec l'association Green IT, et a été validé par l'organisme d'État l'ADEME.

Tout ce travail d'optimisation de la performance d'un site Internet ne sera que bénéfique pour son impact sur l'environnement. Car, finalement, plus il est rapide et léger, moins il demandera de ressources naturellement.

Chez Lemon Interactive, nous essayons de suivre ces bonnes pratiques en éco-conception pour chacun des sites de nos clients. De plus, nous réalisons des ateliers dédiés à la compréhension de l'impact environnemental de nos actions digitales : La Fresque du Numérique.

Les propriétaires de sites n'ont pas toujours conscience de l'impact que leur contenu peut avoir sur l'environnement. Si tout est dématérialisé, et semble donc "invisible" pour la planète, les conséquences sont pourtant bien là. Et vous seriez peut-être surpris de connaître l'empreinte carbone de votre site.

Alors, si vous hésitez à vous lancer dans la refonte de vos pages pour une pratique plus green, prenez le temps de découvrir votre score et votre empreinte carbone. Plusieurs solutions sont possibles.

• Les outils en ligne : de nombreux outils permettent de connaître précisément les émissions de GES d'un site éco-conçu, e-commerce ou blog. Vous pouvez alors faire le test avec Carbon Footprint, Carbonalyser, Green Web Fundation, ou encore Website Carbon Calculator ;
• Le calcul manuel : à l'aide du Carbon Trust Footprint Calculator, vous pourrez calculer vous-même l'empreinte carbone, selon plusieurs paramètres ;
• Le score EcoIndex : avec ce site, il est possible d'analyser simplement une page en collant son URL, donnant un score entre A et G, ainsi que des détails sur les points d'amélioration et l'empreinte environnementale de la page.

Plusieurs développeurs et propriétaires de site ont testé l'impact d'une refonte de site vers une éco-conception web. Le résultat est sans appel :

• Le poids des pages diminue de 88 % ;
• Le temps de chargement est réduit de 95 %.

Au regard de ces chiffres, si tout le monde passait à l'éco-conception, nous pourrions, pour le numérique, réduire les émissions de gaz à effet de serre de 55 %, et réduire la consommation électrique de 36 % !

L'accélération de la transition vers des sites plus responsables et plus verts doit être opérée maintenant, et c'est tout l'enjeu que nous nous imposons dans nos engagements d'agence chez Lemon Interactive. Nous poussons ainsi systématiquement l'éco-conception à tous nos clients, et nous utilisons des hébergements verts pour tous nos sites Internet.