27. Réduire le poids et la complexité des pages
Pourquoi est-ce important ?
Le poids des pages a considérablement augmenté au cours de la dernière décennie, ce qui a des répercussions importantes tant pour les utilisateurs que pour l'environnement. Entre 2014 et 2024, la taille médiane des pages sur ordinateur de bureau a augmenté de 120 % (soit une augmentation de 1,4 Mo), tandis que la taille médiane des pages sur mobile a bondi de 357 % (soit 1,8 Mo supplémentaires). Les images sont les éléments qui contribuent le plus au poids des pages.
Ces tailles de pages excessives ont de graves conséquences. Les pages plus lourdes augmentent l'utilisation du processeur et l'obsolescence, ce qui contribue à une consommation d'énergie et à des émissions de carbone plus élevées. Elles exacerbent également les inégalités numériques, affectant de manière disproportionnée les utilisateurs disposant d'appareils plus anciens ou de connexions Internet plus lentes.
Que puis-je faire ?
-
Supprimez le code inutile ou inutilisé (scripts, frameworks et plugins) et limitez leur utilisation.
-
Supprimez les modules en double dans les bundles JavaScript.
-
Réduisez l'impact des tiers (consultez Construit avec et Mes tiers sont-ils écologiques ?).
-
Évitez le défilement infini et les carrousels. Préférez la pagination et les options « charger plus ».
-
Utilisez le chargement différé pour réduire les éléments téléchargés
-
Utilisez le rechargement partiel du contenu d'éléments spécifiques (plutôt que de la page entière)
-
Utilisez des polices système, standard ou web-safe pour éviter les téléchargements
-
Utilisez des couleurs et des thèmes plus sombres (moins gourmands en énergie sur OLED)
-
Communiquez de manière à ne pas dépendre uniquement de la couleur, tant pour la durabilité que pour l'accessibilité
-
Réduisez au minimum le nombre d'étapes nécessaires aux utilisateurs pour accomplir leurs tâches
-
Envisagez de concevoir des designs adaptés aux appareils plus anciens et aux vitesses plus lentes, lorsque vous concevez dans un souci d'inclusivité. Définissez des indicateurs de performance clés (KPI) qui tiennent compte des performances dans les « pires conditions »
-
Utilisez le traitement asynchrone pour optimiser l'énergie et les performances
-
Préférez la saisie assistée à la saisie automatique afin de réduire les appels inutiles au serveur
-
Utilisez des langages de programmation et des frameworks à jour pour une meilleure efficacité
-
Préférez les formats de pages statiques
Éléments à prendre en considération
-
🧑 Performances optimisées du produit, illustrées par des temps de chargement plus rapides
-
🧑💰 Réduction des coûts de maintenance, reflétant une conception et une exécution efficaces
-
💰 Optimisation conduisant à une réduction des dépenses liées au cloud
À quoi ressemble le succès ?
Nous vous encourageons à auditer et à optimiser régulièrement les ressources de votre site web ou de votre application. Ces considérations et améliorations environnementales et de performance feront partie intégrante du fonctionnement des équipes interfonctionnelles une fois que vous aurez Intégrez la planète dans votre brief & Choisissez les bons indicateurs . La formation sera essentielle pour que votre organisation et vos équipes produit continuent à découvrir les meilleures pratiques à appliquer. Pour cela, rien de mieux que Organiser des conférences, sensibiliser et promouvoir la formation et Mettre en place un groupe de travail sur le climat. Et n'oubliez pas l'inclusivité du système : concevez pour les appareils plus anciens, les connexions plus lentes, et demandez-vous si les fonctionnalités nécessitent vraiment une connexion Internet.