J'avais en effet choisi de convertir toutes mes images en WebP au lieu du traditionnel JPG. WebP est un format d'image développé par Google et mis à disposition du public. Ce format a comme gros avantage - entre autres - de se révéler plus léger à qualité équivalente. Vous en avez un exemple ci-dessus, avec une même photo. 153Ko en JPG contre 73Ko en WebP, soit un gain ici de plus de 50%.
Sur une image, le gain est minime, mais quand j'affiche plus de 50 images sur un article, cela peut rapidement faire une belle différences= de plusieurs secondes de chargement.
Un navigateur reste incompatible
Bémol à cette utilisation, un seul navigateur reste à ce jour incompatible, il s'agit de Safari, développé par Apple, qui rechigne à le rendre compatible alors que tous les autres navigateurs gèrent ce format qui existe depuis 10 ans. C'est tout au moins vrai si vous n'utilisez pas au moins macOS 11 Big Sur.
Si ci-dessous, vous voyez deux images, bravo, votre navigateur gère à la fois JPG et WebP (la seconde image).
Si vous n'en voyez qu'une seule, j'en suis désolé, mais il faut :
- tenter une mise à jour de Safari (si votre Mac tourne sur mac OS 11 Big Sur minimum)
- changer de navigateur si vous avez une version plus ancienne
Sur ce lien, on peut voir que tous les autres navigateurs gèrent le format.
Devant le nombre de personnes qui ne pouvaient plus visionner les images sur Matos Vélo, j'ai décidé d'opérer un retour en arrière.
A regrets, car cela permettait pour plus de 80% des utilisateurs d'avoir des gains de confort engendrés par l'adoption de ce nouveau format - ainsi que les gains de CO2, puisque chaque Ko coûte en utilisation serveur - j'ai fait ce choix.
L’impact énergétique : 1Mo = 20g de CO2
Une étude de référence de l’ADEME qui date de 2011, « Analyse comparée des impacts environnementaux de la communication par voie électronique« , fondée sur le choix d’1 Mo comme unité de mesure, estime que le transit de 1Mo de données sur la toile entraîne le rejet de 15g de CO2. Dans mes articles, une page peut facilement dépasser 2Mo en temps normal s'il y a beaucoup d'images. Avec ce nouveau format, je gagne plus de 1Mo par article.
- Envoyer un courrier électronique de 1 Mo à 1 personne équivaut à la consommation directe de 25 Wh, soit 25 min d’utilisation d’une ampoule de 60 W.
- Un mail de 1 Mo envoyé à une personne entraine potentiellement une consommation d’énergie fossile équivalente à 6 g de pétrole.
- L’équivalent de 20 g de CO2 est émis par mail de 1 Mo envoyé. Il en est de même lorsque vous visualisez la page d'un site.
En prenant comme base un gain de seulement 1Mo par article (fourchette basse), en se basant sur une moyenne de 27000 pages chargées par jour (moyenne sur novembre 2020), ce sont pas moins de 540kg de Co2 qui auraient pu être économisés chaque jour. Plus de 16 tonnes par mois.
Kluk lundi 7 décembre 2020, 09:27
Salut,
As tu essayé des solutions d'optimisation d'images. Certains sites le permettent comme kraken.io ou autre, l'abonnement n'est pas très élevé et il tu peux sur un jpg ou un png, selon la qualité que tu veux en sortie, gagner 30 à 50% du poids total donc presque autant qu'un webP et il existe un plug-in WordPress .
Autre avantage de ces solutions, c'est que le temps de traitement est très rapide et tu peux tester gratuitement...
Guillaume [Matos Vélo] lundi 7 décembre 2020, 09:42
J'optimise déjà pas mal via Photoshop, mais le WebP est le seul à permettre de gagner 30/40% par rapport à ce que j'avais sans perte de qualité.
Quant à Wordpresse, je ne suis pas avec ce CMS :-)
Maw lundi 7 décembre 2020, 09:43
Hello,
Top comme démarche !
Étant dans le dev web, je pense que tu peux regarder du côté de la balise picture dans laquelle tu peux avoir plusieurs balises source pour avoir un failover en jpg si le navigateur ne supporte pas le webp.
Côté css, il faut voir mais je pense que c'est aussi possible.
A+
Maw
Phil lundi 7 décembre 2020, 09:46
Tout ça encore à cause de cette marque qui ne fait jamais rien comme il faudrait pour les standards et donc l'ouverture. Les pommes sont ceux qui achètent des patates au prix du caviar !
Sterminus lundi 7 décembre 2020, 10:08
@maw C’est exactement ce a quoi j’ai pensé en lisant l’article la balise Picture. Le seul soucis serait sur du IE a moins d’avoir un polyfill ?!
@phil En faite, le webP n’est pas un standard dans le sens où il n’est pas inscrit au W3C ou une RFC mais une proposition de Google donc les autres ne sont pas obligé de suivre. Mais la plus part des navigateurs utilisant une base de Chromium, ils sont forcément compatibles
jacfon lundi 7 décembre 2020, 10:47
bonjour Guillaume
franchement, tu n'aurais pas du renoncer à faire des économies d'énergie souhaitables pour tous, juste pour certains qui ne veulent pas télécharger un autre navigateur comme Firefox par ex. c'est à Apple de faire le boulot sur les anciens systèmes (bizarre,leur tout dernier système,lui est compatible). je suis sur Mac et je n'utilise plus Safari depuis très très longtemps. aux utilisateurs Mac d'envoyer des messages à Apple pour gueuler !
Guillaume [Matos Vélo] lundi 7 décembre 2020, 10:54
Cette marche arrière n'est pas définitive, je souhaite toujours mettre en place ce format.
grichka lundi 7 décembre 2020, 11:39
Bonjour Guillaume, je trouve dommage d'être tributaire d'une marque minoritaire et qui refuse toute optimisation et standardisation pour faciliter la vie des utilisateurs. Apple est devenue une machine à fric et "fashion victim".
C'est comme les prises des téléphones, c'est la seule marque qui refuse de faire comme tout le monde au mépris d'un règlement européen.
Avec leur connectique et "standards" propriétaire, ils imposent des tarifs plus élevés.
Lolo lundi 7 décembre 2020, 11:53
Je suis sur Mac Catalina et Safari version 14, c’est à dire la dernière version de Safari.
Donc il ne faut pas forcément BigSure mais bien probablement la dernière version de Safari (14).
Crop83 lundi 7 décembre 2020, 12:49
Salut, il est possible d'utiliser un fallback pour continuer à profiter du webp pour les navigateurs qui le supporte en utilisant une balise <picture>
Je mets un exemple :
Ça demande d'exporter les images 2 fois dans les 2 formats. Mais ça passe sur tous les navigateurs. Ceux qui supportent le webp en profiteront et les autres auront le jpeg.
DJ lundi 7 décembre 2020, 13:45
Pour moi tu ne devrais pas d'adapter a un si petit public (on parle des mac de 2013 et avant...)
C'est comme si tu sortais une modification pour Internet Explorer qui n'est plus sensé être utilisé.
Les utilisateurs des anciennes versions des mac peuvent passer sur firefox voir sur chrome pour surfer de manière moderne
Dafy lundi 7 décembre 2020, 15:01
Comparés au 16 tonnes, les utilisateurs de Mac périmés ne font pas le poids. Protégeons la planète :-)
el lundi 7 décembre 2020, 19:14
Tu peux en effet utiliser la balise source ou, ton site étant servi par Apache, ajouter une règle dans le htaccess :
https://github.com/vincentorback/We...
Jcgnad lundi 7 décembre 2020, 21:13
Vous gérez votre commerce (car c’en est un) comme vous le jugez , rentable pour vous .
Maintenant, le client ( moi en l’occurence) choisi votre boutique ou va ailleurs si cela ne lui convient pas.
Cette règle commerciale de base suffit et remplace tous ces commentaires qui n,ont pas lieu d’exister , surtout lorsqu’ils deviennent de la haine dès lors que leurs règles personnelles ne sont pas suivies par les autres.
grichka mardi 8 décembre 2020, 07:55
Je constate, en lisant les solutions proposées par certains et dont je ne nie pas la pertinence, qu'avec Apple tout est possible, mais que rien n'est simple. Pourtant l'informatique est censé nous faciliter la vie. Sauf avec Apple ...
COTIGA jeudi 28 janvier 2021, 22:05
Bravo pour cette article, Apple traine grave la patte et c'est énervant.
On se croirait début 2000 ou il fallait faire des versions de site pour chaque navigateur...
betamax mardi 20 juillet 2021, 22:36
...Ah Apple, de visionnaire à ...la poubelle de l'informatique, en une vingtaine d'années.
Qu'est-ce qui empêche les amateurs de remplacer Safari par Firefox ou Chrome ?
dodo dimanche 22 août 2021, 15:49
Ce n'est pas plutôt 190 tonnes de CO2 par an ??
Guillaume [Matos Vélo] dimanche 22 août 2021, 21:02
Oui, ce qui fait 16 tonnes par mois environ.
fred mardi 9 mai 2023, 15:20
Le CO2 c'est la vie crétin ! C'est de ca dont se nourrissent les végétaux. Plus il y a de C02 et plus la planète est verte.