Comment construire un site web éco-responsable ?

09/02/2023

Allez, on retrousse ses manches et on lutte contre le réchauffement climatique jusque sur son site web ! Les objectifs : réduire son empreinte carbone et construire ensemble un site web éco-responsable !

Comment ça mon site internet pollue ?

Et oui mon ami, votre site internet pollue ! En effet, internet, avec son écosystème numérique (emails, cloud, visios, jeux en ligne et vidéos) génère 2 fois plus de gaz à effet de serre que le transport aérien selon les études. Damned ! Chez nous, il génère même 2% du total des émissions dans l’Hexagone en 2019.

Mais comment ? Il faut savoir qu’internet et ses services sont hébergés dans des data centers composés de nombreux serveurs informatiques qui marchent 24h sur 24, 7 jours sur 7 et qui chauffent énormément. La plupart du temps, ces data centers utilisent des systèmes de climatisation pour refroidir leurs machines, ce qui demande énormément d’énergie. Internet prend de plus en plus de place sur les serveurs, alors commençons à notre échelle en optimisant notre site !

Pour commencer, il faut bien choisir son prestataire d’hébergement

Pour commencer, il faut bien choisir son prestataire d’hébergement

Avant de souscrire un contrat, soyez vigilant aux engagements éco-responsables de l’hébergeur choisi : choix du matériel et renouvellement des serveurs, choix du fournisseur d’électricité, politique salariale, stratégie de refroidissement, compensation carbone, etc. sont autant de critères qui pèsent dans la balance.

Les hébergeurs sont de plus en plus transparents sur l’écologie et dédient souvent des pages sur leur site web à l’explication de leur démarche éco-responsable. Les plus transparents vont même jusqu’à nous indiquer leur émission annuelle de CO2, c’est plutôt cool !

 www.infomaniak.com/fr/ecologie

www.o2switch.fr/green/

corporate.ovhcloud.com/fr/sustainability/environment/

www.planethoster.com/fr/Hebergement-Vert

À partir de ces informations vous pouvez comparer les hébergeurs et faire votre choix. Dans tous les cas, préférez un fournisseur local, dans notre cas la France ou la Suisse. En effet, d’autres pays sont plus ou moins producteurs de gaz à effet de serre en fonction de leur stratégie de production d’électricité. Centrales à charbon et au gaz de schiste, on s’abstiendra, ça commence déjà mal pour compenser son empreinte carbone !

Ensuite, on optimise le poids de son site

Ouille, mon site est louuuurrrd, que faire ? Dès sa conception un site doit être pensé pour être sobre et ne pas utiliser des ressources dont il n’a pas besoin. 

La sobriété c’est so hype !

Maintenant il va falloir travailler le design de votre site ! Sobriété des couleurs, typographies légères de poids et d’aspect, courbe vectorielle parfaite plutôt que pixellisée, visuels à la bonne taille et avec les bons effets, sont autant de points à prendre en compte lors de la création graphique de votre site pour qu’il soit le plus léger possible. Aujourd’hui, sobriété est synonyme d’élégance.

La sobriété c’est ergonomique et SEO Friendly

Une fois le design sobre et léger validé, on va créer le site internet fonctionnel avec les mêmes critères de sobriété. Un développement du site optimisé aura un impact sur la navigation du visiteur et sur le SEO.

Plus le site est léger, plus le visiteur peut naviguer de façon fluide de page en page sur ordinateur ou sur mobile. Tout le monde n’a pas une connexion haut débit, encore moins sur mobile, mais tout le monde aime les pages qui chargent rapidement.

La rapidité de chargement serait même un des critères de Google pour bien référencer un site internet. Cela s’explique facilement : sur un site léger, dont le chargement est rapide, les robots de Google naviguent plus vite et peuvent ainsi indexer plus rapidement plus de pages. Le visiteur préfère également un résultat de recherche Google qui se charge rapidement sur mobile et sur ordinateur.

Tout le monde veut son information au plus vite et ça tombe bien, c’est écologique lorsque le site est conçu dans ce sens.

Quelques règles à retenir pour un site web éco-responsable

Nous commençons par les images et vidéos, qui sont souvent la plus grosse part de l’embonpoint d’un site web.

  • Enregistrer les photographies en JPG et les illustrations épurées en PNG.
  • Enregistrer et diffuser les images du site à la bonne taille. Rien ne sert d’avoir des photos beaucoup plus grandes que ce qui est affiché sur l’écran. 
  • Épurer son design pour diminuer le poids total et le nombre d’images.
  • Charger ses images en différé. La technique s’appelle le lazyload et permet de charger les images au fur et à mesure qu’elles deviennent visibles à l’écran. Vous pouvez configurer cela sur certains hébergeurs tel que O2switch ou ajouter un plugin wordpress qui s’en chargera.
  • Régler correctement la mise en cache des images sur le serveur. Rien ne sert de recharger une image qui l’était déjà sur une page précédente. Ce réglage se fait via le serveur et certains hébergements permettent d’ajouter cette configuration de mise en cache dans un fichier .htaccess 
  • Héberger les vidéos sur des plateformes de streaming au lieu de les héberger vous-même sur le site.
  • Ne pas lancer les vidéos automatiquement.
  • Passer par des compresseurs d’images ou de pdf.

Comme expliqué plus haut, les typographies peuvent également jouer un rôle sur la quantité d’énergie qui est utilisée par l’affichage de votre site.

  • Utiliser une typographie optimisée pour le web avec un poids léger.
  • Utiliser une typographie lisible, fine et épurée.

Vos pages en elles-mêmes doivent également être construites de façon peu énergivore 

  • Compresser tous les fichiers externes (CSS / JS).
  • Éviter l’utilisation d’outils extérieurs sur le site.
  • Compresser le code html et nettoyer le de toute information inutile.
  • Mettre en cache les pages dynamiques pour éviter de demander au serveur de reconstruire  la page de zéro à chaque visite.
  • Utiliser les interactions et effets avec justesse et retenue pour éviter de faire grimper la consommation du processeur et de la carte graphique du visiteur.
  • Choisir un hébergeur qui a mis en place sur ses serveurs des outils de mise en cache et d’optimisation côté serveur tels que O2switch ou Infomaniak.

Le résultat est visible immédiatement, le visiteur charge votre site à toute allure. Il consomme moins d’électricité sur ordinateur ou mobile. Le site prend moins de place chez l’hébergeur et consomme donc moins de ressources.

Exemple d’un site très léger low-tech : Mucem.org

Vous avez déjà un site web, comment l’optimiser pour qu’il devienne éco-responsable ?

Les conseils ci-dessus s’appliquent aussi à un site existant. Certes le design du site et des pages web est déjà établi, mais il est toujours possible de migrer le site chez un hébergeur plus performant écologiquement de façon transparente pour les visiteurs. Vous, vos visiteurs et la planète y seront gagnants !

À lire aussi

Aux premières loges

Je veux ma
newsletter

Suivez toute l’actu, les portraits, les articles et les infos à ne pas manquer sur les réseaux
et en vous inscrivant à notre newsletter.

Viens boire un petit coup à la maison.
Viens boire un petit coup à la maison.