PageSpeed et optimisation d'images

Bonjour, depuis quelque temps, l'outil pagespeed de Google considère toutes les photos de la plupart des sites comme non optimisées, même sur les sites axés SEO comme abondance, ou à degré moindre mais quand même, le site site webrankinfo.

Pourtant, même si vous essayez de les compresser avec jpegtran (même constat sur jpegoptim) comme Google le recommande, le résultat est le même, avec l'option --strip-all aussi.

Savez-pourquoi?

Google par ailleurs voudrait qu'on bascule sur le format webp beaucoup moins gourmand, cependant, à part Chrome, la plupart des navigateurs ne veulent pas le gérer, bloquant le processus.

Qu'attend Google de nous, alors qu'on ne peut évidemment pas passer en webp, et que l'utilisation de jpegtran et jpegoptim ne semblent pas le satisfaire intégralement, alors que c'est lui même qui les recommande.....

A noter que les images recompressées par Google le sont on ne sait pas comment, sont moins lourdes évidemment, mais restent plus lourdes qu'avec une compression webp sans option.

Merci.

 

Si vous voulez,

sur une baque d'image libre pixabay, test sur cette photo déjà très optimisée :

Voilà l'url de la photo (288ko au téléchargement) : https://cdn.pixabay.com/photo/2013/08/26/09/24/field-175959_960_720.jpg

Cette photo uploadée sur un hébergeur gratuit sans traitement ni de ma part, ni de l'hébergeur (toujours 288ko) : https://img4.hostingpics.net/pics/595054field175959OR.jpg

Avec jpegtran, comme je l'ai dit, elle est déjà bien optimisée, on ne perd que 2ko pour descendre à 286ko : https://img4.hostingpics.net/pics/838310field175959jp.jpg

Passons au PAGESPEED :

Le pagespeed pour l'originale : https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F ... 5959OR.jpg

Normal, il nous dit : qu'on peut réduire la taille de 73,3 Ko (réduction de 26 %).

Moins normal, le pagespeed pour celle traitée : https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F ... 5959jp.jpg

Il nous dit qu'on peut réduire la taille de 70,5 Ko (réduction de 25 %), alors qu'elle a été traitée avec jpegtran et les options -copy none -optimize -perfect, ou avec jpegopti et --strip-all.

Et voilà l'image ré-optimisée par Google (215ko) : https://img4.hostingpics.net/pics/379600838310field175959Go.jpg

Mais on ne sait pas par quel outil, quelles options.

Voilà, ça m'a pris quelques minutes, mais vous avez les tests sous les yeux.. soulignant la quasi inutilité de jpegtran ou jpegopti.

A noter que j'ai déjà fait des tests perso en utilisant plusieurs profils colorimétriques, avec des nuances près, chaque fois c'était pas assez optimisé pour pagespeed.

pour webrankinfo, j'ai pas fait l'essai sur les images, car c'est des petites images peu signifiantes, comme celle-ci :
https://www.webrankinfo.com/images/design/guide_img1.jpg

Test ici : https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F ... e_img1.jpg

 

merci pour vos réponses, alors

pour kevicar :
Je ne cherche pas un outil en ligne, pour traiter des milliers de photos, ce n'est pas évident. Sinon je me servirais de PageSpeed.
Concernant que tu gagnes encore plus que PageSpeed, tout dépend de la dégradation réalisée par l'outil.

pour madri2 :
Les png sont secondaires pour mes besoins. Quant au rendu à droite, c'est rien ce doit être un bug, à la base pageSpeed doit recevoir des urls web (dont le rendu est ok), et pas des urls d'image, c'est sûrement pour ça.

 

Furtif,

Ton image est un peu pixellisée si on s'y penche bien, mais j'imagine que tu peux en obtenir avec une dégradation moindre, et que l'image peut par exemple faire 120 ou 150ko.

De la même façon qu'avec ImageMagick, je fais des mogrify -quality si je veux dégrader une image, mais ça n'a pas d'incidence par rapport à pageSpeed.

Que veux dire optimiser en amont?
Par quel procédé as tu obtenu ce résultat à 89ko qui passe effectivement bien au pageSpeed? Est-ce imageMagick?

Merci.

 

C'est surtout qu'avec Photoshop, même en utilisant un script, les traitements par lots sont toujours ennuyants.

Ok pour ton outil, sauf que si on veut traiter des images dans des dossiers et sous-dossiers, il le fait, mais les nouvelles images sont toutes mises en vrac dans un seul dossier, ce qui est dommage.

Et néanmoins, désolé si je suis tatillon, mais j'aurais bien aimé savoir ce qui tourne à l'intérieur, et passer par des scripts plutôt que par un programme.

Pour le reste, les webmasters qui ne font pas attention au poids de leur page, le fait que je cherche des réponses pour économiser le moindre octets prouve que je n'en fais pas partie et c'est de moins en moins vrai. Aujourd'hui avec des formats comme AMP, et tous les impacts sur le SEO dus aux pages trop lourdes font que de plus en plus de webmasters y font attention (je parle de webmasters qui s'occupent de quelques sites, pas d'agence web qui font 100 sites par an et qui évidemment n'en ont rien à faire).

Du coup ça répond à moitié à ma question tout ça, car PageSpeed indique d'utiliser jpegtran, or ce n'est pas suffisant, et dans ce cas, ils auraient dû préciser, d'utiliser autre chose. N'ai-je pas raison?

Le fait est que Google n'est pas parfait non plus, en atteste le bug relevé par madri2 par exemple, ou est volontairement imprécis, et que donc, leur outil comporte au moins un manque d'information.

 

Bonjour Noren,

je n'apprends rien à personne en disant que Google c'est 93% de requêtes en France et en Europe et bla bla bla.

J'ai constaté comme tant d'autres webmasters, une baisse conséquente de connexions à partir du mois de février, due au nouvel affichage des images par oncle Google.

Google qui veut qu'on passe en format AMP nos pages hors landing page. (Même si là je trouve ça très très grave dans le fond)

Il est clair que Google pousse à la rapidité, alors que paradoxalement, le débit n'a jamais été aussi élevé.

Donc oui c'est important, quitte à se mettre à genoux pour plaire à Google. C'est ainsi.

Sinon, pour ceux que ça intéresse, sans certitude, car plein de paramètres entrent en jeu : complexité de l'image, profil colorimétrique, taille etc... cf (https://developers.google.com/web/fundamentals/performance/optimizing- ... tion?hl=fr) avec jpegopti (contrairement à jpegtran), on peut gérer la qualité de l'image sans dégrader avec autant d'impact que le ferait imageMagick par exemple.

Ensuite, suivant les images, à nous de définir un seuil de dégradation à partir duquel, Google sera happy ... et qui permettra à toutes nos images d'être bien considérées.

Vivement que Firefox et internet explorer et tous les retardataires adoptent le format webp ...... cela nous facilitera la vie.

 

L'important est ce que toi tu vois à l'oeil nu, en changeant d'images entre l'origine et la nouvelle, si c'est imperceptible, si tu n'es pas en mesure de dire, celle là est l'originale, et que tu as diminué de moitié la taille de ta photo, faut le faire.

Le format webp de Google est monstrueux, mais si on zoom à fond, on voit bien une petite perte de netteté.

Les compressions sans perte de données ne permettent pas aujourd'hui de réduire de façon assez conséquente les images. C'est ce que Google PageSpeed devrait spécifier au lieu de nous indiquer qu'un optimiseur d'images suffira à le satisfaire.

Après si on veut être très méticuleux, chaque photo est différente, tout dépend de si tu l'as traitée avant aussi avec LR par exemple, j'ai dû augmenter la qualité pour des images avec ciel bleu uniforme, car ça pixellise vite dans ces cas là.

 

Certaines choses sont si implicites qu'il me semblait inutile de les rappeler.

Optimiser ses images avant, merci du conseil. C'était déjà fait ! Tu oublies un paramètre de taille, c'est que le temps passe et avec lui les années, les technologies évoluent, les traitements d'image aussi, et bientôt on verra surement déferler le format webp, déjà présent avec chrome sur certains sites. Ce qui nécessitera à nouveau de tout retraiter !

Depuis quand le web est figé ???

J'optimise mes images depuis des années, après les avoir retravaillées, elles passent toutes à travers des scripts, il s'avère que ce n'est pas assez efficace.

Du coup explique moi comment faire quand on accumule plus de 10 000, puis 100 000 images, réparties dans des centaines voir des milliers de dossiers, et que de nouvelles évolutions permettent de les optimiser encore mieux. Que fait-on? Rien? On est bien obligé de repasser dessus, c'est évident non?

La plupart des internautes n'utilisent pas un écran géant comme le mien où les détails sont invisibles, ils surfent sur divers supports, sur des smartphone aux multiples résolutions, où l'image paraîtra parfois bien plus détaillée, et où il est aisé de zoomer.

Pour répondre à Noren et madri2, il n'est pas question de viser le 100%, évidemment, sinon on pourrait aussi s'amuser à viser le 0 erreur et 0 avertissement du W3C, que même Google ni Facebook ne respectent pas.

Mais pour des sites qui misent énormément sur l'image, la photographie de qualité, sur des diaporamas, qui affichent des images en full screen, etc... oui c'est très important.

Il ne s'agit pas d'optimiser une image isolée pour la bannière d'un site, sinon je m'en préoccuperais pas.

Je ne sais pas si vous vous rendez compte, puisque personne n'a rebondit dessus, que depuis début février, l'affichage des recherches d'images sur Google a changé, impactant considérablement le trafic de la plupart des sites. Pourquoi à votre avis?

Et que penser aux origines du format AMP?

Oui la vitesse d'affichage est importante, surtout quand on sait que la part des connexions via smartphone est en constante progression.

Et si c'est 15ko de gagner par image, si c'est une image, ok c'est rien, si c'est 10 000 x 15 ko, ça vaut peut-être le coup.