Accueil Expertises Éco-conception

Éco-conception
site web éco-conçu ?

En 2011, les contraintes du web mobile en zone de montagne : stockage hors-ligne inexistant, notifications absentes, réseaux capricieux… nous ont poussés à monter une équipe de développement mobile natif iOS et Android. Ce choix nous a appris à concevoir des solutions digitales avec des contraintes réelles (ex : le 25 décembre à 14h dans une station de ski) .

Réseau limité, écran en plein soleil, batterie faible : ces situations forgent des réflexes de sobriété que nos équipes web et mobile partagent encore aujourd’hui. Ce qu’on appelle désormais éco-conception, on le pratiquait déjà par nécessité, puis par conviction.

Mesurer chaque octet
a un équivalent CO2

Chaque page chargée sollicite des serveurs, traverse des câbles, s’affiche sur un écran, et tout cela consomme de l’énergie. Une vidéo en lecture automatique, quatre polices de caractères chargées en parallèle, un widget de réseau social, des images non optimisées : chaque élément s’additionne.

Multiplié par le nombre de visites quotidiennes et la profondeur de navigation, l’impact devient mesurable. Des outils comme EcoIndex (développé par le collectif GreenIT), GTmetrix ou Website Carbon Calculator permettent de quantifier l’empreinte d’une page et de la suivre dans le temps. EDSB, fournisseur d’électricité en Hautes-Alpes, a mis en œuvre cette démarche avec nous et publié leurs résultats. → Voir la page éco-conception d’EDSB

Notre approche
en quatre temps

Sur un site existant, on commence par un audit complet. Un document de recommandations priorisées : ce qui se corrige rapidement, ce qui nécessite un chantier plus profond, ce qui relève d’un choix éditorial à assumer.

Sur les projets en développement, ces recommandations s’intègrent directement dans le code : gestion des ressources, optimisation des images, limitation des appels serveur inutiles, mise en cache adaptée.

Après la mise en ligne, les performances sont suivies via des outils dédiés pour détecter les dérives et proposer des corrections régulières.

Mais le moment le plus déterminant reste en amont — pendant les ateliers UX et UI. C’est là qu’on pose les vraies questions : ce carrousel d’images en pleine page, quelle est son utilité réelle ? Cette vidéo en arrière-plan, est-elle indispensable ? C’est le moment d’en parler, avant le développement.

Le WebSen’SCORE
notre grille décitionnelle

Pour structurer nos propositions, on a développé une grille d’évaluation baptisée WebSen’SCORE. Elle s’appuie sur 5 critères à impact direct sur le chargement du premier écran : celui que votre visiteur voit dans les premières secondes.

[Emplacement vidéo 10s — aperçu animé du WebSen’SCORE — boucle silencieuse, chargement différé, format WebM + MP4]

Chaque critère génère une pondération. L’ensemble donne un WebSen’SCORE global : une mesure de choix assumés, documentés, décidés en pleine connaissance des compromis.

Un score élevé reflète des partis pris conscients, sans jugement de valeur sur la qualité du site. L’intérêt de la démarche : transformer des décisions souvent prises par habitude en arbitrages éclairés, co-construits avec le client lors des ateliers de conception.

Les détails de la grille, les cinq critères, leurs valeurs et les seuils de pondération, sont présentés lors des ateliers de conception. Outil de travail collaboratif conçu pour alimenter la conversation, il documente les choix retenus pour la durée du projet. Aucune mauvaise réponse, juste un éclairage technique pour s’aligner avec votre stratégie.

Mode sombre
Jour <=> Nuit

Un thème sombre bien conçu réduit la consommation de batterie et, par extension, l’empreinte de chaque session. Au-delà de l’aspect énergétique, c’est une question de confort réel. La lecture prolongée sur fond blanc fatigue les yeux. Beaucoup d’utilisateurs activent le mode sombre par défaut dans leurs réglages système.

Nos équipes intègrent cette option directement dans le système de conception des projets qui le justifient — en variante cohérente du thème principal, testée sur les mêmes critères de contraste, dès la phase de design.

Quelques références

Refonte complète sous Drupal avec intégration d’une démarche éco-conception documentée. Notre WebSen’SCORE calculé en phase de conception, suivi des indicateurs EcoIndex et GTmetrix après mise en ligne.

Le client a choisi de publier une page dédiée expliquant leur démarche et leurs résultats. → edsb.fr/ecoconception

À compléter selon projets disponibles.