Comment savoir si vos photos et images ralentissent votre site web ?

Je suis très souvent sollicitée pour des questions de lenteurs de site internet. Qu’il s’agisse de site de e-commerce ou non. C’est une préoccupation courante et majeure. Qui prouve que beaucoup de propriétaires de site internet et de blogs s’inquiètent de cet aspect du confort de navigation pour leur audience. Une préoccupation qui prouve aussi combien la vitesse d’affichage est importante comme centrale pour ces mêmes personnes. Qui souhaitent également que leur contenu, leur marque comme leurs produits et services soient mis en avant dans un cadre qui retient l’internaute. Alors que clairement, des lenteurs, ça dissuade. Plutôt que de pousser à l’action et idéalement, à la conversion.

Alors si vous cherchez à savoir si ce sont vos images et/ou les photos de vos pages web qui peut-être les ralentissent, découvrons ensemble comme justement, le déterminer !

Utiliser des outils d’estimation des performances de site internet

Oui, il existe des outils complètement gratuits ou partiellement gratuits qui permettent d’avoir des pistes assez précises sur ce qui peut ralentir un page de site internet. Abordons tout de suite deux outils majeurs et populaires de mesure de performances de site web : 

Dans les deux cas, vous pourrez tester gratuitement une ou plusieurs pages de votre site internet.

Pagespeed Insights

Si vous optez pour PageSpeed Insights qui est un outil gratuit fourni par Google, vous pourrez effectué du testing quasiment sans limite de volume. Vous pourrez tester par exemple l’url de votre page d’accueil, l’url de certains de vos articles de blog ou encore votre page de contact. PageSpeed Insights est traduit en français. Il est assez précis et saura vous indiquer si vos photos et images sur la page testée sont un frein ou non à une vitesse d’affichage optimale. 

Cet outil a tendance à être plus tolérant sur les résultats d’une page web pour desktop que pour le test d’une page sur mobile. Il est parfois difficile d’obtenir une note supérieure à 85 pour la partie performances sur mobile. Il ne faut donc pas hésiter à pondérer les résultats qui vous sont proposés. Et comparer par exemple ces résultats avec d’autres outils comme GT Metrix. 

GT Metrix

L’outil n’est pas traduit en français. Du coup, pour des aspects très techniques d’une page web, il peut être difficile de tout comprendre. Toutefois, ne serait-ce que dans le résumé suite au test de performances, vous pourrez avoir un feedback sur le travail à potentiellement apporter à des images. 

Prenons le cas d’un test effectué sur un blog où la plupart des photos sont optimisées en taille, dimensions et format (avec d’ailleurs du webp) : 

taille image gt metrix

 

On peut voir que même si le blog a une note de A, l’outil GT Metrix donne des conseils avec des infos sur ce qui pourrait être encore optimisé pour des images qui sont déjà optimisées. Aussi, n’hésitez pas à faire un test de certaines de vos pages qui selon vous sont peut-être lentes ou ralenties à cause des médias photos et images. 

Bien entendu, quand il s’agit de ne gagner que 5 ko sur une photo, c’est bien évidemment négligeable ! Vous pouvez tout à fait ne pas tenir compte de toutes les infos restituées lors d’un test. 

-> Un test contient des recommandations et parfois des alertes. Libre à vous d’en tenir compte et d’agir ensuite. 

Testez vos pages via votre téléphone

On oublie parfois de tester son propre site web sur mobile parce qu’on a des habitudes bien installées de le voir sur un grand écran de bureau ou PC portable/Mac. Pourtant tester son propre site web sur mobile est crucial. Lors de vos tests, tentez d’ailleurs de désactiver le wifi. Histoire que l’expérience ne soit pas biaisée par la vitesse de navigation plus rapide offerte par un wifi en fibre qu’on peut avoir chez soi. Pour que l’expérience soit concluante, il faut se rapprocher du réel, de ce qu’un(e) internaute vivrait en se connectant depuis la rue ou depuis une salle d’attente. Sans wifi. Avec son réseau mobile seul. 

Si quand vous êtes sur une page web de votre site internet via votre téléphone et qu’une image met plusieurs secondes à s’afficher, alors oui, il y a un souci de taille de l’image (parfois aussi de connexion). En cas de doutes, ce sont les outils cités plus haut dans cet article qui pourront vous indiquer si c’est l’image qui pose problème avec son poids ou si c’était votre connexion qui expliquait que cette image mettait autant de temps à s’afficher. 

Rendez-vous sur la médiathèque de votre site web

Partez du principe que si vous avez des fichiers images et photos aux formats JPG et PNG qui font plus de 200 ko, c’est déjà presque trop. Auquel cas, rendez-vous dans la médiathèque de votre site web et regardez la taille de vos dix dernières images et/ou photos. Si plus de la moitié de vos fichiers médias images font plus de 200 ko, alors il vaut mieux opter pour une réduction de leurs dimensions et donc de leur poids dans la foulée. 

Vous pouvez les remplacer sans en changer le lien ou le nom ou la date d’ajout via des outils WP comme Enable media replace. Vous pouvez également réfléchir à proposer du webp à vos visiteurs. Même s’il reste préférable d’avoir à la base, des fichiers à dimensions raisonnables et poids léger. On évitera ainsi les photos et images : 

  • De plusieurs MO
  • de plus de 1500 pixels de haut ou de large ou les deux

Il faut en effet chercher le doux équilibre entre dimensions raisonnables et un poids qui serait idéalement inférieur à 100 ko (moins c’est, mieux c’est. Sans dégrader la qualité d’un photo en JPG bien sûr). 

Comment savoir si vos photos et images ralentissent votre site web ?

Vous l’aurez compris, si vous voulez savoir si des images ou des photos sont trop lourdes et ralentissent certaines pages de votre site web, le mieux reste de tester des pages via des outils dédiés comme GT Metrix ou pagespeed Insights. 

Ces outils sauront par ailleurs classer pour vous dans l’ordre les principales causes de ralentissement de vos pages. Car vous pouvez soupçonner vos images et photos alors que d’autres éléments sont à étudier de plus près. 

En effet, il est fréquent que le temps de chargement d’une page soit allongé à cause de : 

  • nombreux scripts appelés à chaque chargement de page et/ou clics
  • de CSS lourd sur des thèmes plutôt mal fichus
  • de système de cache non installé alors que cela peut être très utile selon les sites web
  • de performances serveur d’hébergement low cost non adaptées à vos besoins

Aussi, n’accusez pas vos image alors que peut-être, d’autres éléments de vos pages sont encore plus coupables de ralentissements 😉

Partager ce contenu :
Griselidis
Griselidis

Bonjour ! Je suis Griselidis. Webmaster & Webdesigner freelance, je tiens ce site web depuis mai 2014. Depuis 10 ans déjà, je partage ici des tutoriels et articles pour vous aider à créer votre site web, le faire vivre et le faire connaître.

Newsletter

Saisissez votre adresse e-mail ci-dessous et abonnez-vous à la newsletter

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *