Pourquoi c'est important d'optimiser vos images
Comme vous le savez très bien, la vitesse d'un site est un élément incontournable de sa réussite. D'abord, les internautes réclament des sites rapides avec des pages qui se chargent en peu de temps - sinon ils repartent ! Ensuite, Google milite aussi pour la vitesse d'Internet ; ses équipes ont utilisé un des meilleurs moyens pour inciter les webmasters à s'y mettre : déclarer que la vitesse d'un site est un critère officiel de classement.
L'optimisation de la vitesse nécessite beaucoup de travail. Vous trouverez d'autres dossiers sur WebRankInfo pour progresser sur le sujet, par exemple les contrôles à faire sur les images, les diagnostics avancés de Dareboost ou la liste complète de conseils pour la webperf. Dans la plupart des cas, les images représentent une grosse partie de la taille totale des fichiers qui doivent être téléchargés pour consulter une page web. En réduisant leur taille, vous réduisez aussi la bande passante et l'espace disque sur votre serveur.
💡 mon outil RM Tech d'audit SEO sait repérer les images trop grandes ou trop lourdes
La solution Image Recycle
J'ai trouvé à cette solution Image Recycle plusieurs atouts, c'est pourquoi je l'utilise et vous suggère de l'utiliser ! Sur un de mes sites, j'ai optimisé plusieurs centaines de photos avec un gain moyen de 23%. Je vais le faire également pour les images de WebRankInfo, mais vu leur nombre je n'ai pas encore eu le temps de m'en occuper...
ImageRecycle est payant et je sais qu'il existe des plugins gratuits (j'en ai testé) mais ils ne proposent pas toutes ces caractéristiques qui m'ont plu :
- l'intégration à votre CMS permet d'optimiser les images en 1 seul clic. C'est possible sous forme de plugin pour Wordpress, Joomla et Magento et sous forme d'appli pour Shopify. Espérons que ce soit disponible pour d'autres CMS à l'avenir.
- leur algorithme détermine automatiquement le niveau de compression optimal en maintenant la même qualité visuelle.
- pour les plus exigeants, il est possible de configurer la compression pour qu'elle soit sans aucune perte de qualité ("lossless"). Le taux de compression est alors moins bon, mais vous avez l'assurance qu'aucun pixel ne sera modifié.
- toutes vos images peuvent être restaurées à tout moment à leur version d'origine (à condition de maintenir l'abonnement au service)
- en plus des images (formats GIF, PNG et JPEG), vous pouvez aussi optimiser le poids de vos documents PDF !
- les agences ou freelances peuvent utiliser un seul compte pour optimiser les images de tous leurs clients. En d'autres termes, il n'y a aucune limite dans le nombre de sites ou projets gérés avec votre compte. Vous pouvez même créer (gratuitement) des sous-comptes si vous souhaitez en faire profiter à plusieurs utilisateurs.
- il existe une API si vous souhaitez intégrer ces fonctionnalités dans un de vos projets
- la tarification est transparente : elle est basée sur la taille totale des fichiers traités. A 7$ le Giga d'images (par mois), vous n'allez pas vous ruiner ! Par ailleurs, pour ceux qui ne souhaitent pas payer tous les mois, il suffit d'arrêter votre abonnement. Vous conserverez sur votre serveur toutes les images (et PDF) optimisés ; par contre évidemment vous ne pourrez plus compresser les images que vous rajouterez à l'avenir.
Parmi les choses que j'aimerais qu'ils améliorent :
- il n'y a pas de réglages précis de la compression : c'est soit lossless (sans pertes), soit lossy (avec pertes). Dans ce second cas, j'aurais aimé pouvoir configurer un niveau de qualité (ou de compression) comme on le trouve dans d'autres logiciels, plugins ou applis
- même s'il est indiqué image par image, je ne trouve pas le taux de compression moyen sur mes images (j'ai dû le calculer à la main)
- j'aimerais voir le nombre de Ko ou Mo économisés sur l'ensemble de mon site
- j'aimerais avoir la possibilité d'afficher en plein écran les 2 versions de l'image : à gauche l'image originale et à droite l'image optimisée, sans zoom (affichage à 100%). Ca permettrait de vraiment comparer les 2 et de mieux décider si on conserve effectivement l'image optimisée.
Tuto Image Recycle (plugin WordPress)
Je vous ai tourné une petite vidéo d'un tuto d'Image Recycle dans WordPress :
Testez et dites-moi ce que vous en pensez !
Si vous avez des questions, posez-les dans le forum WebRankInfo.
Si vous préférez du consulting, j'en propose sur mon site WebRankExpert.
➡️ Offre MyRankingMetrics ⬅️
pré-audit SEO gratuit avec RM Tech (+ avis d'expert)
coaching offert aux clients (avec Olivier Duffez ou Fabien Faceries)
Voir les détails ici
Merci Olivier pour cette recommandation.
Pour mes premiers tests, je constate que le "Uploader" ne fonctionne pas si l'on a choisi le Français comme langue d'affichage du site. En Anglais, cela fonctionne parfaitement. La compression du Pdf n'est pas satisfaisante actuellement pour nous Français car les accents de toutes sortes génèrent des résultats illisibles et non professionnels.
Pour les images, en revanche, cela me semble très intéressant à ce stade de mes tests.
Cordialement.
Jean-Marc
Merci pour ce retour d'expérience Jean-Marc. Pour ma part je ne l'utilise que pour les images.
Bonjour,
Très pratique merci.
Du coup, Quel est le poids idéal d'une image ? Poids Max : 100 ko ?
Il n'y a pas de poids idéal car ça dépend tout de même beaucoup de la taille (en pixels) et du type d'image (logo, vectoriel, photo de la vie réelle...).
Peut-être en effet que 100Ko est une bonne valeur à essayer de ne pas dépasser.
intéressant pourrez vous nous informer lorsque cela sera compatible avec PrestaShop ?
Merci d'avance
Bonjour Olivier,
Excellent idée. Auriez-vous le même type de logiciel sous Drupal car ne trouvons pas d'offre similaire ..
D'avance merci de votre réponse,
F. De Jonckere
@François : désolé je n'en connais pas spécialement pour Drupal, je vais chercher
Pour ceux qui se le demandent, il existe des modules dédiés à l'optimisation des images pour Drupal : https://www.drupal.org/project/imageapi_optimize
Bonjour,
Question SEO : est ce que si je passe toutes mes images via imagerecycle et que je garde tout identique (url, nom, alt, title...) je garde aussi mon référencement sur google image ? Ou est ce que je perds mon référencement puisque la photo a changé, de fait, pour une image plus petite ?
Merci d'avance,
Barnabé
@Barnabe : il n'y a aucun impact négatif vu que le nom du fichier image ne change pas, ni le contenu visuel. Que du bon donc !
Bonjour,
est ce que c’est possible pour site e commerce prestashop?
merci
Chrys
Oui Chrys, mais (pour l'instant) en passant par l'API d'ImageRecycle (c'est ce que font les développeurs de modules)
Bonjour,
merci pour cette info.
J'ai regardé l'aspect juridique (leurs CGU) et ça c'est pas terrible.
Je n'utiliserais pas cet outil. Pour ma part, j'utilise Paint.net même s'il n'est pas optimisé à fond.
Encore merci
Bonjour Olivier
Merci pour cette présentation. Je ne connais pas cette solution.
Mais j'ai découvert imagify développé par wp rocket. Utilisant leur système de cache j'ai testé ce produit de réduction de poids des images sans peur et sincèrement je suis convaincu.
Vous devriez y jetter un oeil si ce n'est déjà fait.
Même la solution gratuite est seulement merveilleuse, c'est celle que j'utilise.
A bientôt
J'en ai aussi entendu parler, mais ayant déjà optimisé toutes mes images avec ImageRecycle, je n'ai pas testé...
Est-ce que ça marche avec le plugin Retina ?
Désolé, je n'ai pas testé Fredm...
J'ai du mal à comprendre le concept.
Il faut obligatoirement un CMS donc ?
Un site codé à l'ancienne à la main on peut rien faire ?
@Sve : Non, un CMS n'est pas obligatoire. on peut uploader les images sur le site ImageRecycle puis les récupérer et les mettre en ligne en remplacement des images non optimisées. Ou alors on peut utiliser l'API pour l'automatiser.
Bonjour,
N’étant pas un spécialiste comme vous je n'arrive pas à comprendre si il y a une différence avec un plugin WordPress comme Ewww Image Optimizer Unoptimized ?
Parlez vous du même type de compression?
Avant même de parler simplement d'optimisation de poids, regardez aussi la taille de l'image originale n'a pas besoin dans 99% des cas de dépasser 2000px de largeur
J'utilise Imsanity pour wordpress perso :)
En effet l'outil automatise le process et la compression est bonne mais au détriment parfois de la qualité. Pour ma part je n'utilise que des outils lossless car avec les écrans retina les artefacts des images compressées sont encore plus visibles.
Je dirais ok pour compresser automatiquement les images envoyées par des utilisateurs ou les images d'un article, mais pour les logos, hero image que l'on retrouve sur la page d'accueil ou toutes les pages il ne faut pas hésiter à passer quelques minutes pour tester et gagner quelques Ko.
Hello Olivier, tu connais Tinypng ?
Je pense que les tarifs sont plus attractifs et la facilité / qualité tout aussi présentes.
Pour les tarifs ils sont là https://tinypng.com/developers j'avais fait un petit billet dessus il y a quelques semaines http://www.visibilite-referencement.fr/blog/alleger-vos-images
tu installes le plugin rentres ta clé API cliques sur un bouton pour optimiser toutes les images déjà présentes sur le site. Et pour celle à venir pas de soucis, à chaque upload le plugin s'en chargera tout seul.
Testes à l'occasion et redis moi si tu vois des différences
Oui j'ai entendu parler de Tinypng. Je ne sais pas comment tu arrives à comparer aussi facilement les tarifs, vu que l'un se base sur le nombre de fichiers et l'autre sur le volume de données... Ca peut dépendre des cas. Par exemple :
TinyPNG: $13.50/mois >> 2000 images
ImageRecycle:
$7 >> 1Go soit 2000 images de 500Ko ou 4000 images de 250Ko
$14 >> 3Go soit 6000 de 500Ko ou 12000 images de 250Ko
Parmi les autres raisons qui font que j'ai fait un article sur ImageRecycle :
Quelqu'un sait si l'excellent smush.it est maintenu quelque part ou sera relancé ? C'était l'outil le plus efficace que j'ai trouvé.
Bonjour,
En effet Olivier il existe des dizaines d'outils gratuits ou payants pour gérer le problème de la taille des images. Personnellement je préfère gérer moi-même la compression manuellement avec des outils comme ImageOptim, ImageAlpha, Gifsicle et JPEGmini.
On peut aussi automatiser le process avec des outils comme pngcrush, jpegtran, optipng...
Oui Nicolas, il y a plein de solutions. Celle que je mets en avant dans cet article intéressera ceux qui souhaitent une solution intégrée ne nécessitant aucune installation ni paramétrage, ni API pour un outil externe (ce qu'exigent certains plugins gratuits).
J'utilise ImageOptim en local et j'en suis très content, sauf que c'est manuel.