Leçon 2

Eco-concevoir pour le web

mis à jour le
 16/10/2023

Nous envoyons et recevons une quantité énorme de données chaque fois que nous interagissons avec un site web ou une application mobile, ce qui émet du carbone. Cela dépend de nombreux facteurs, tels que l’efficacité énergétique de nos appareils ou le protocole de réseau utilisé pour la transmission des données.

Mais le poids des données ainsi que la distance qu’elles vont parcourir ont également une incidence ; c’est pourquoi il est indispensable d’optimiser nos contenus web.

3 idées pour réduire le poids d'un site internet

Comment éco-concevoir ses contenus web ?

Pour optimiser les images sur votre site web :

  • Priorisez des images de moins bonne qualité.
  • Compressez au maximum les images.
  • Choisissez le format adéquat : .jpeg ou .webp pour les photos, .svg ou .png pour les illustrations, etc.
  • Assurez-vous que les images chargées soient à l’échelle des images à l’écran.
  • Ne modifiez pas la taille des images depuis le navigateur.
  • Evitez de charger les images en automatique.
  • Utilisez l’ensemble des règles CSS3.

Pour optimiser les vidéos sur votre site web :

  • Compressez ou changez le format des vidéos.
  • Utilisez les formats de vidéo les plus courants.
  • N’implémentez pas de lecture automatique.
  • Proposez seulement la qualité de lecture standard, ne proposez pas de haute ou basse qualité.
  • Limitez l’utilisation des gifs animés.
  • Adaptez les dimensions de la vidéo aux appareils mobiles.
  • Hébergez vos vidéos sur une plateforme externe, comme YouTube, et implémentez simplement un bouton de lecture qui renvoie sur la plateforme.

Pour optimiser les polices de caractères sur votre site web :

  • Utilisez deux ou trois polices maximum.
  • Priorisez les formats de fichiers WOFF et WOFF2 pour vos polices.
  • Evitez d’insérer des polices provenant de services d’hébergement de polices de caractères.
  • Créez des sous-ensembles de polices qui incluent seulement les caractères dont vous avez besoin.
  • Veillez toujours à ce que vos polices soient bien lisibles sur l’écran de vos internautes.

Pour optimiser votre application :

  • Éliminez les fonctions qui ne sont pas essentielles.
  • Limitez l’envoi de notifications et évitez celles qui ne sont pas utiles.
  • Utilisez la méthode DevOps pour optimiser le processus de développement des logiciels.
  • Optimisez l’utilisation de la batterie grâce aux profils énergétiques inclus dans les systèmes d’exploitation des smartphones.
  • Réduisez l’utilisation des données en arrière-plan.
  • Adaptez la précision de la géolocalisation au besoin réel.

Vous pouvez envisager de migrer vers une Progressive Web Apps :

  • Réduisez la consommation des ressources de votre application, son utilisation des données et son impact environnemental.
  • Améliorez la compatibilité de votre application sur plusieurs appareils, ce qui la rendra bien plus accessible.
  • Améliorez l’expérience utilisateur.

Pour améliorer le temps de chargement sur votre site et diminuer la consommation des données :

  • Utilisez la technologie Accelerated Mobile Page (AMP) pour améliorer le chargement de vos pages web dans les endroits où la couverture réseau est mauvaise (et le référencement sur Google).
  • Optez pour une structure statique pour améliorer le temps de réponse, l’expérience utilisateur et le référencement de votre site web, et pour éviter le besoin d’une base de données.