Écoconception

Cette section vise à couvrir des questions et solutions pour un usage et un développement de produits et services numériques plus responsables. Pour préciser pourquoi et comment j’aborde cette section vous pouvez lire à propos du Numérique Responsable

Retour d’expérience : Les métacartes en entreprise

Depuis plusieurs années, j’utilise les metacartes Numérique Éthique dans mes interventions en entreprise pour faciliter les ateliers de sensibilisation et formation à l’écoconception de produits/services numériques. Ces cartes à jouer permettent d’aborder des concepts souvent méconnus, de faire découvrir d’autres options, et d’orienter les discussions et les décisions collectives vers des actions concrètes.

Voici un retour d’expérience sur mon utilisation récente un peu particulière, mais j’imagine courante dans les grands groupes, où le programme et le contenu de formation sont déjà prêts et standardisés, avec les avantages et inconvénients que cela peut comporter pour un formateur quelque peu créatif comme moi. Mon respect du cadre n’a cependant pas empêché quelques hack metacartes pour ajouter un peu de fun et d’intérêt à certains moments que je vais vous décrire.

🎯 Objectif: Réduire l’Empreinte Numérique du Site

Cet audit vise à identifier les gisements d’économie d’énergie et de ressources sur le site Hugo, en s’appuyant sur les pratiques GR491 de l’Institut du Numérique Responsable (INR).

🛠️ Outils d’Audit Utilisés

Outil	Utilité	Points forts
Lighthouse	Performance, accessibilité, bonnes pratiques	Scores détaillés, recommandations prioritaires
Kastor.green	Analyse d’empreinte carbone numérique	Liens direct vers RGESN et GR491 de l’INR
Web Vitals	Métriques Core Web Vitals	Compression, temps de réponse

📊 Améliorations Identifiées (Priorisées)

🔴 Critique (Impact > 200 Kib)

Action	Gain Estimé	Pratique GR491	Hugo Implementation
Activer compression Gzip/Brotli	437 Kib	1.1 - Réduire poids transféré	Config `output.formats.HTML.mediaTypes`
Éliminer CSS inutilisé	260 Kib	4.2 - Optimiser CSS	Utiliser PurgeCSS ou TailwindCSS avec `purge`
Réduire JavaScript inutilisé	176 Kib	2.1 - Minimiser ressources JS	Lazy loading, code splitting par section

🟡 Important (50-200 Kib)

Action	Gain Estimé	Pratique GR491	Hugo Implementation
Images optimisées (WebP, dimensions)	~150 Kib	3.1 - Images responsives	Hugo `image` processing + formats multiples
Ajouter attributs width/height images	~50 Kib	3.2 - Éviter CLS	Front-matter YAML ou shortcodes
Diffuser avec cache HTTP efficace	Voir durée	5.1 - Cache statique	Headers `Cache-Control: max-age=31536000`

🟢 Recommandé (< 50 Kib)

Action	Gain Estimé	Pratique GR491	Hugo Implementation
Ajouter print CSS	~10 Kib	1.3 - Média queries print	`assets/css/print.css` + @media print
Minifier HTML/JSON	~20 Kib	1.2 - Minification	Config Hugo `minify.minifyOutput = true`
Lazy loading iframes	~5 Kib	2.3 - Lazy loading	Attribut `loading="lazy"` sur iframes
Supprimer polyfills inutiles	~15 Kib	2.1 - Code mort	Audit bundle JS, vérifier support navigateurs

🗺️ Mini-Guide Opératoire (Basé sur GR491)

Phase 1: Diagnostic Détaillé (GR491 Critère 1-2)

Objectif: Identifier consommation réelle avant/après

🎯 Bienvenue dans l’Écoconception

Cette section rassemble une démarche complète d’écoconception numérique avec:

✅ Guide complet 5 étapes
✅ 5 cartographies pratiques à chaque phase
✅ Outils et sources fiables
✅ Pièges courants à éviter

📚 Ressources Principales

👉 Guide Complet: Écoconception en 5 Étapes

Le document de référence couvrant:

Étape 1: Alignement Valeurs-Fonctionnalités
- Cartographie: Identifier alignements positifs/négatifs
Étape 2: Audit de l’Existant
- Cartographie: Analyse d’impacts actuels (ACV simplifiée)
Étape 3: Cartographie Détaillée (CENTRALE)

Développement logiciel soutenable, mais depuis quand ?

J’ai choisi de consulter l’histoire de cette notion de “sustainability” dans le développement logiciel, pour voir si ses racines étaient toujours d’actualité, et si nous n’étions pas passé à côté de quelque chose ou carément à autre chose, à l’heure du Green IT et du numérique éthique ou responsable.

Sustainability dans la culture et littérature agiles

Le Manifeste agile

La première référence qui peut venir à l’esprit est le Manifeste agile et son 8ème principe:

Force est de constater qu’il existe de plus en plus de référentiels de pratiques d’écoconception numérique. S’ils ont en commun l’intention d’améliorer le numérique en général pour en limiter les impacts sociaux et environnementaux, ils ont chacun leurs spécificités d’approche, de périmètre et de praticité.

Le meilleur est donc … certainement celui qui vous permettra d’atteindre de meilleurs résultats dans votre contexte.

Aussi le référentiel ne fait pas tout. La démarche d’écoconception est prépondérante. Si les référentiels d’origine évoluent peu, la démarche se veut adaptative, et progressive.

Cet article vise à démontrer que des gains rapides peuvent être réalisés pour rendre son site plus vert, en suivant simplement les recommandations d’outils très accessibles du navigateur : EcoIndex et Lighthouse pour n’en citer que 2 directements utilisables dans Chrome.

Bien sûr, il ne s’agit pas de s’arrêter à ces premières actions, mais si tous les sites pouvaient déjà bénéficier de quelques heures d’attention écoresponsable, tout le monde se porterait un peu mieux.

Numérique

Meta-Cartes à jouer du numérique