Qu’est ce que l’éco-conception d’un site web ?

L’éco-conception, parfois nommée “Green-IT”, correspond à une démarche ambitionnant de réduire l’impact écologique, économique, mais aussi social, du numérique. De ce fait, chaque intervenant dans le processus de conception d’un site internet se doit d’optimiser au mieux les ressources utilisées afin de concevoir des solutions moins énergivores.

Comment concevoir un site internet en limitant son impact environnemental

Afin de réduire l’empreinte carbone des pages des sites internet et entrer dans une démarche de numérique responsable voici quelques unes des bonnes pratiques.

Bien penser la structure de son site web

3 grands points se démarquent : l’arborescence du site, ses fonctionnalités mais aussi son contenu. 

L’utilisateur a besoin de trouver rapidement l’information ou le produit qu’il est venu chercher, alors restons synthétique et efficace. Afin de faciliter son parcours utilisateur, limitez le nombre de pages, limitez vous aux fonctionnalités essentielles et à des contenus qualitatifs.

Alléger son webdesign

Nous avons souvent tendance à vouloir intégrer des vidéos, des images à foison pour illustrer nos idées, nos produits mais ce n’est malheureusement pas Éco-responsable ! 

Dans la limite du raisonnable, il est conseillé de proposer une interface utilisateur efficace en donnant les informations essentielles dont il a besoin. 
Pour les images et les vidéos même principe, choisir des illustrations nécessaires à la compréhension mais sans fioriture (privilégier par exemple des illustrations au format SVG – vectorielles – plutôt que lourdes images). 
Quant aux typographies et aux couleurs employées, le mot d’ordre sera de minimiser le nombre de fichiers à charger sur le site et de limiter le nombre au maximum (certaines couleurs sont moins “énergivores que d’autres”).

Toutes ses bonnes pratiques ne seront que bénéfiques pour les utilisateurs sur mobile. D’ailleurs l’approche « Mobile First », qui consiste à concevoir d’abord son site internet sur les appareils mobiles, permet d’adopter une première démarche d’éco-conception.

Optimiser son code

Optimiser le code implique une diminution de ressources énergétiques nécessaires pour charger les pages demandées par les internautes.

Afin de maximiser le temps de charge des pages il est important de minimiser le code mais aussi de prévoir la mise en cache du site et de penser à un site responsive. 

Des termes qui paraissent complexes mais très simples à comprendre. Minimiser le code correspond à supprimer tout le superflu pour réduire le temps de chargement du site. 

La mise en cache du site permet de stocker les éléments des pages directement sur l’ordinateur de l’internaute au lieu de charger tous les médias à chaque nouvelle requête de l’utilisateur.  

Un site internet “responsive” signifie qu’il s’adaptera à tous types de supports numériques (mobile, tablette, ordinateur de bureau…). D’où l’importance d’optimiser aussi la tailles des médias, pour un affichage idéal.

Si vous souhaitez aller plus loin, voici une liste encore une fois, non-exhaustives, des points d’attention pour un démarche plus responsable :

• Ajouter des expires ou cache-control headers (≥ 95%)
• Compresser les ressources (≥ 95%)
• Limiter le nombre de domaines (< 3)
• Ne pas retailler les images dans le navigateur
• Eviter les tags SRC vides
• Externaliser les css
• Externaliser les js
• Eviter les requêtes en erreur
• Limiter le nombre de requêtes HTTP (< 27)
• Ne pas télécharger des images inutilement
• Valider la javascript
• Taille maximum des cookies par domaine (< 512 octets)
• Minifier les css (≥ 95%)
• Minifier les js (≥ 95%)
• Pas de cookie pour les ressources statiques
• Éviter les redirections
• Optimiser les images bitmap
• Optimiser les images svg
• Ne pas utiliser de plugins
• Fournir une print css
• Ne pas utiliser les boutons standards des réseaux sociaux
• Limiter le nombre de fichiers css (< 3)
• Utiliser les ETags (≥ 95%)
• Utiliser des polices de caractères standards

Choisir le bon hébergeur

Le bon hébergeur signifie qu’il correspond à toutes les valeurs que vous souhaitez mettre en avant. C’est-à-dire, un hébergeur qui :

• Décarbone au maximum l’énergie utilisé pour alimenter ses serveurs
• Utilise un matériel performant sans être trop gourmand en énergie
• Possède des serveurs à des emplacements géographiques adaptés
• Marche en circuit court, si possible en France évidemment ou en Europe. 

Une fois que l’ensemble des points d’attention sont techniquement en place il est possible de mesurer le réel impact grâce à des sites spécialisés mais aussi grâce à des extensions sur les navigateurs web.

Mesurer l’empreinte carbone de vos pages web  

Nous avons assez de recul aujourd’hui pour affirmer que le numérique à un impact environnemental très fort. 

Afin de le limiter au maximum il existe des outils permettant de prendre conscience de son impact environnemental et d’y remédier. 

Ces outils permettent de vous aider à identifier des pistes d’amélioration des pages plus ou moins énergivores.

À chaque analyse de site, 4 indicateurs vous permettent de prendre conscience des pages plus ou moins énergivores. 

Ces indicateurs sont les suivants : 

• La performance environnementale sous forme d’un score allant de 0 à 100 (plus la note est élevée plus la performance est bonne)

• La performance environnementale sous forme d’un score allant de A à G ( G correspondant au score le plus bas, donc le moins bon)

• L’empreinte technique de la page (complexité de la page, bande passante, charge serveur)

• L’empreinte environnementale en termes d’émission de gaz à effet de serre et de consommation d’eau

Autre moyen de tester rapidement l’empreinte carbone d’un site internet l’extension : GreenIT Analysis. Elle permet de mesurer l’ecoIndex d’un site web et de vérifier la mise en application des bonnes pratiques d’eco-conception web définies par le “Collectif numérique responsable” .

CONCLUSION

L’éco-conception des sites internet est donc une démarche volontaire, qui prend certes du temps, et très valorisante. En plus de crédibiliser sa communication environnementale, elle permet aussi de protéger les futures générations d’internautes !
Depuis plus de 25 ans que nous concevons des sites internet et des dispositifs digitaux, dont 17 ans chez Shokola, la majorité de ces recommandations font partie de nos bonnes pratiques intégrées à toutes nos réalisations.
Enfin, outre l’écoconception de nos sites, nous portons une attention particulière à l’accessibilité, mais cela c’est une autre histoire que nous vous raconterons très bientôt.

N’hésitez pas à contacter l’agence @Shokola pour plus détails et optimiser ou lancer votre univers digital éco-conçu !!