Web Sustainability Guidelines du W3C
75 % 46 lignes directrices respectées sur les 61 qui nous engagent.
- 46 respectées
- 14 partielles
- 1 non respectée
- 1 sans objet
- 9 en cours
71 lignes directrices regroupant 196 critères de succès. Le chiffre de la colonne « Critères » est le nombre de critères de succès que la ligne couvre.
Chaque lignes directrice porte l'un de ces verdicts : respectée, partielle, non respectée, sans objet, critère en cours d’analyse.
Conception et expérience
- Identify, assess, disclose, review, and mitigate sustainability impacts Respectée
- L'impact est mesuré à chaque build et publié au lecteur :
/blog-conception/porte trois badges, dont deux vérifiables par un tiers, et le poids servant au calcul est affiché avec sa date. - Understand user requirements or constraints Respectée
- Les contraintes sont écrites et chiffrées dans
.claude/rules/quality.md: budgets de poids, de requêtes, de DOM, plus WCAG 2.1 AA dans les deux thèmes. - Integrate sustainability into every stage of the ideation process Respectée
- La sobriété est un critère de sortie, pas une intention : trois portes de qualité échouent le build, et chaque kilo-octet de script est une exception argumentée dans le code.
- Design efficient and streamlined user journeys Respectée
- Deux niveaux depuis l'accueil jusqu'à l'article. Les deux taxonomies tiennent sur une page unique plutôt que dans un menu déroulant, et le parcours a été vérifié dans un navigateur réel.
- Design to assist and not to distract Respectée
- Aucune publicité, aucune notification, aucun bandeau de consentement puisque aucun cookie n'est posé. Une seule animation, en une passe, neutralisée sous
prefers-reduced-motion. - Avoid being manipulative or deceptive Respectée
- Aucun schéma sombre : pas de compte à rebours, pas d'inscription forcée, pas de collecte. Le chiffre d'empreinte affiché porte sa date pour qu'un chiffre périmé se voie.
- Make deliverables understandable and reusable Respectée
- Dépôt public sous licence, décisions et pièges documentés dans
CLAUDE.mdetPLAN-MIGRATION.md, contenu en Markdown portable dans un dépôt distinct. - Use a design system for interface consistency Respectée
- Jetons sémantiques dans
src/styles/tokens/, alignés sur le Zatsit Design System. Aucune valeur hexadécimale brute n'est admise dans le code produit. - Optimize media to reduce resource use Respectée
- WebP, dimensions plafonnées à 1366 px,
srcsetde six paliers calé sur les largeurs réellement mesurées, chargement différé sous la ligne de flottaison. Un article est passé de 734 à 322 ko d'images sur téléphone. - Ensure animation is proportionate and easy to control Respectée
- Une animation sur tout le site, en une passe et non en boucle, ce qui la sort du critère 2.2.2. Chaque composant animé annule son animation dans sa propre requête de média.
- Use optimized web typography Respectée
- Poppins auto-hébergée en woff2 latin, sous-ensemble par l'API Fonts d'Astro, trois graisses, six fichiers pour 48,5 ko. Aucune requête vers un fournisseur tiers.
- Avoid unwanted notifications Respectée
- Le site ne demande aucune permission et n'envoie rien : ni notification, ni courriel, ni fenêtre modale.
- Reduce the impact of downloadable and physical documents Partielle
- Aucun document téléchargeable n'est publié. En revanche aucune feuille d'impression n'est fournie, alors qu'un article technique est un candidat naturel au PDF.
- Involve users early in the project Respectée
- La refonte a été mise en relecture auprès des treize consultants sur une preview dédiée avant toute bascule.
- Audit and test for bugs or issues requiring resolution Respectée
- axe-core sur les 68 pages, deux thèmes, deux largeurs, avec
target-sizedemandée par son nom, plus le contraste sur les jetons et les couleurs de code. Les trois portes échouent le build. - Validate usability through testing and real-world usage Partielle
- Vérifications systématiques dans un navigateur réel piloté en CDP, et relecture par les consultants. Aucun test d'utilisabilité formel avec des lecteurs extérieurs.
- Provide cross-platform compatibility support Respectée
- HTML sémantique sans framework client : la page fonctionne sans JavaScript, navigation, articles et tirage au hasard compris. Vérifié de 390 à 1440 px.
Développement web
- Set goals based on performance and energy impact Respectée
- Budgets chiffrés et opposables : moins de 500 ko initiaux, 1 Mo au total, 25 requêtes, 1500 éléments de DOM. Le build échoue au dépassement.
- Minify and remove unused code Respectée
compressHTML: true, minification par Astro, et un pruneur maison retire 408 ko d'interfaces Pagefind inutilisées à chaque build.- Modularize bandwidth-heavy components Respectée
- L'index de recherche n'est chargé qu'à la première frappe, et la CSS est découpée par composant, donc la feuille d'un article ne part pas sur la page des auteurs.
- Avoid redundancy and duplication in code Respectée
- Un
PostCardpour cinq surfaces, unlistingPagespartagé par les deux routes de liste, unauthorSlugpour toutes les pages d'auteur. Les duplications trouvées ont été supprimées, la dernière ayant produit un bug de pagination. - Treat third parties the same as first parties Partielle
- Aucun CDN, aucun traceur, aucune police tierce, aucun bouton de partage officiel. Deux appels tiers subsistent, les badges Website Carbon et EcoIndex, chacun argumenté et dégradant proprement.
- Ensure code follows good semantic practices Respectée
<nav>,<main>,<article>,<time>, un seulh1par page, hiérarchie sans saut. Vérifié par axe sur les 68 pages sans violation.- Defer the loading of non-critical resources Respectée
loading="lazy"sous la ligne de flottaison, index de recherche à la demande, badges en chargement différé.- Structure metadata for machine readability Partielle
- Titres, méta-descriptions, Open Graph, carte Twitter, flux RSS et sitemap segmenté sont en place. Manquent un
robots.txtdéclarant le sitemap et des données structuréesschema.orgsur les articles. - Use media queries that support sustainability goals Respectée
prefers-reduced-motionrespecté partout,prefers-color-schemepour le thème par défaut, et des requêtes de largeur qui servent une seule feuille adaptative.- Ensure layouts work for different devices and requirements Respectée
- Grilles en
auto-fit, unités relatives, aucun débordement horizontal sur les 68 pages à 390 px, mesuré. - Use sustainable JavaScript and APIs Respectée
- 4 ko de JavaScript pour tout le site, aucun framework, aucun traitement long. Le tirage au hasard réécrit une adresse plutôt que d'intercepter un clic, ce qui préserve le fonctionnement sans script.
- Use dependencies sparingly and maintain them Respectée
- 215 paquets contre 1478 sous Docusaurus. Les mises à jour sont suivies, et celles qui cassent sont refusées avec la raison écrite.
- Include expected and beneficial files Partielle
sitemap-index.xml,sitemap-0.xmletrss.xmlsont générés,404.htmlaussi. Il manquerobots.txt, etsecurity.txtn'a pas été envisagé.- Use the most efficient solution for your service Respectée
- Génération statique complète : aucun serveur n'exécute quoi que ce soit pendant la lecture. C'est la raison même du départ de Docusaurus.
- Use the latest stable language version Respectée
- Astro 7.2, Node 22.12 minimum, TypeScript vérifié à zéro erreur sur 52 fichiers.
- Reduce the number and complexity of database queries Sans objet
- Aucune base de données : le contenu est lu en place dans des fichiers Markdown au moment du build.
Hébergement et infrastructure
- Use sustainable hosting Partielle
- Stockage d'objets managé, sans serveur allumé pour servir des fichiers. L'hébergeur n'est pas choisi sur un critère d'énergie renouvelable, et le badge CO2.js retient volontairement l'hypothèse pessimiste.
- Optimize caching and support offline access Partielle
- Cache HTTP réglé par famille : un an immuable pour les actifs hachés, revalidation pour l'index, dix minutes pour les pages. Aucun accès hors ligne, choix assumé : un service worker rejouerait ce que le cache HTTP fait déjà.
- Reduce data transfer with compression Respectée
- Compression par la couche d'hébergement, et le gate de poids mesure le texte gzippé plutôt que brut, ce qui est la mesure honnête.
- Setup necessary error pages and redirection links Partielle
404.htmlest généré et statique, et les deux redirections du contrat sont servies. Mais la production répond aujourd'hui par la page d'accueil en 200 sur une URL inconnue, ce qui est mesuré et inscrit au plan.- Avoid maintaining unnecessary virtualized environments or containers Respectée
- Aucun conteneur ni machine virtuelle pour ce site : des fichiers dans un stockage d'objets.
- Use automation wisely Respectée
- La CI construit, vérifie et déploie une preview par pull request, sans tâche périodique inutile. Les portes de qualité sont automatisées, la vérification axe reste locale parce qu'elle exige un navigateur.
- Define the frequency of data refreshes Respectée
- Rien ne se rafraîchit tout seul : le site est reconstruit à la publication d'un article, et le badge carbone met son résultat en cache un jour.
- Back up critical data at routine intervals Respectée
- Le contenu et la coque sont deux dépôts git distincts, donc versionnés et répliqués. Aucune donnée n'existe hors de git.
- Assess the impact and requirements of data processing Respectée
- Aucun traitement de données : pas de collecte, pas de compte, pas de formulaire, pas de journalisation applicative.
- Use Content Delivery Networks (CDNs) when beneficial Partielle
- Aucun CDN, et c'est un choix : l'audience est nationale et un CDN ajouterait une couche pour un gain de latence marginal. La question reste ouverte pour la bascule.
- Ensure infrastructure fits project requirements Respectée
- Un stockage d'objets pour un site statique : c'est le dimensionnement minimal qui rende le service.
- Store data according to the needs of your users Respectée
- Aucune donnée d'utilisateur n'est stockée. Les seules préférences, thème et dernier tirage, restent dans le navigateur du lecteur.
Stratégie et gestion de produit
- Have an ethical and sustainable product strategy Critère en cours d’analyse
- En cours : société à mission et certifiée B Corp, ce que le pied de page documente. Ce dépôt en applique la conséquence technique.
- Assign a sustainability advocate Critère en cours d’analyse
- En cours. zatsit publie un portail Sustainability distinct.
- Inform, raise awareness, and train for sustainability Respectée
- C'est l'objet même du blog : les articles GreenIT, et une page qui explique et mesure sa propre éco-conception.
- Communicate the environmental impact of user choices Respectée
- Trois badges publiés au lecteur, dont un calculé chez nous et deux vérifiables par un tiers, avec le poids et la date du relevé affichés.
- Calculate the environmental impact Respectée
- CO2.js exécuté au build sur notre poids réellement mesuré, plus EcoIndex et Website Carbon en corroboration externe.
- Define clear organizational sustainability goals and metrics Partielle
- Les objectifs du site sont chiffrés et opposables. Les objectifs de l'organisation sont hors de ce dépôt.
- Validate web sustainability efforts through external verification Respectée
- EcoIndex et Website Carbon sont deux vérifications tierces, publiées et cliquables par le lecteur.
- Support mandatory disclosures and reporting Critère en cours d’analyse
- Notation EcoVadis Silver et certification B Corp, affichées dans le pied de page.
- Create one or more impact business models Critère en cours d’analyse
- En cours.
- Follow a product management and maintenance strategy Respectée
- Plan de migration écrit, décisions numérotées et datées, journal des pièges déjà payés. Le dépôt se relit plus qu'il ne se redécouvre.
- Implement continuous improvement procedures Respectée
- Trois portes automatisées, une quatrième locale, et un journal des régressions évitées. Les budgets sont revérifiés à chaque changement.
- Document updates and evolutions Respectée
- Historique git en messages explicites,
PLAN-MIGRATION.mdpour les décisions et ce qui reste,CLAUDE.mdpour les conventions. - Evaluate if a digital product or service is necessary Respectée
- La question a été posée à chaque fonctionnalité, et plusieurs ont été écartées : le nuage gradué, le filigrane des cartes, le bouton de partage X, le garde-fou sur les tags.
- Provide a supplier standards of practice document Critère en cours d’analyse
- En cours.
- Share economic benefits Critère en cours d’analyse
- En cours.
- Share decision-making power with affected parties Respectée
- Les articles sont relus en pull request dans le dépôt contenu, et la refonte a été soumise aux treize auteurs avant bascule.
- Use Diversity, Equity, Justice, Inclusion (DEJI) practices Partielle
- L'accessibilité est traitée comme une contrainte dure, WCAG 2.1 AA vérifiée sur toutes les pages. Les autres dimensions se traitent au niveau de l'entreprise.
- Promote responsible data practices Respectée
- Aucune donnée collectée : ni cookie, ni traceur, ni analytique, ni compte. C'est la pratique la plus responsable possible, ne rien recueillir.
- Establish responsible practices around AI and emerging or disruptive technologies Partielle
- Le dépôt est développé avec assistance d'IA (ici Claude), des skills et rules publiés aident à cadrer les développement sur l'aspect éco-conception et a11y.
- Adopt responsible financial practices Critère en cours d’analyse
- En cours.
- Adopt organizational philanthropy practices Critère en cours d’analyse
- En cours.
- Plan for a digital product or service's care and end-of-life Non respectée
- Aucun plan de fin de vie n'existe, ni pour le site ni pour ses contenus : rien n'est jamais dépublié et
/archive/liste tout, ce qui est l'inverse d'une stratégie. - Repair, reuse, refurbish, recycle or reduce e-waste Critère en cours d’analyse
- En cours. Le site n'a aucun matériel propre, la question se pose au niveau de l'entreprise.
- Define performance, environmental, and human budgets Partielle
- Budgets de performance et d'environnement chiffrés et opposables. Aucun budget humain n'est défini.
- Use and contribute to open source Respectée
- Les deux dépôts sont publics sous l'organisation zatsit-oss, et le site est bâti sur des briques ouvertes, Astro, Pagefind, CO2.js.
- Create a business continuity and disaster recovery plan Partielle
- Le site est reconstructible entièrement depuis deux dépôts git, ce qui est la meilleure garantie de reprise. Aucun plan n'est écrit et aucune restauration n'a été testée.