time_read11mn de lecture

Comment optimiser les images pour le web ?

29 mars 2017

Comment optimiser les images pour le web ?

Optimiser les images de son site internet est une étape importante lors de la rédaction de vos articles ou de vos pages. Il est vrai qu’une image d’une très bonne qualité est magnifique cependant cela impacte votre site assez négativement et dans certains cas, nous ne voyons pas la différence à l’œil nu.

Nous allons donc voir au travers de cet article comment et pourquoi optimiser les images pour le web.


 

Pourquoi optimiser les images de son site web

Tout d’abord, il faut savoir qu’une image non optimisée va être assez lourde. Cela entraîne un chargement qui se fera en plus de temps. Le fait d’optimiser les images de son site, sert à améliorer la vitesse de celui-ci.

Bien évidemment, il n’y a pas que ce facteur qui joue sur la vitesse de votre site mais il s’agit de l’un des principaux . Le temps de chargement d’une page est très important pour les visiteurs mais aussi pour les moteurs de recherche.

Du côté des visiteurs, plus le temps de chargement d’une page est long plus vous risquez d’avoir un taux de rebond élevé. C’est à dire que l’utilisateur ne continuera pas sa visite sur votre site. Autrement dit, un site internet avec un temps de chargement lent conduit à une mauvaise expérience utilisateur.

Du côté des moteurs de recherche, il y a un impact au niveau du référencement naturel (SEO). En effet, Google prend en compte la vitesse de chargement d’un site comme facteur pour positionner vos pages.

 

Comment les optimiser

Nous allons maintenant voir quelques outils pour optimiser vos images et contrôler la vitesse de vos pages web. Je vous propose un outil gratuit et puissant vous permettant de contrôler le temps de chargement des requêtes et des images de votre site (ou de la page que vous ciblez). Grâce à Pingdom, on va pouvoir vérifier et analyser le temps de chargement de nos pages.

Pour nos exemples, nous allons prendre une page de test qui, sans optimisation, a un temps de chargement de 0.8s pour 1.7MB.

Petit bonus, pour tester la vitesse de vos pages et avoir des conseils sur comment l’optimiser, je vous invite à découvrir l’outil de Google PageSpeed Insights.

 

TinyPNG

tinypng

TinyPNG est un outil puissant vous permettant d’optimiser des images en .jpg et .png. Il suffit simplement de déposer les images sur la page d’accueil du site.

Vous pouvez optimiser 20 images simultanément qui font 5MB chacune maximum. Une fois que les images ont été compressé, vous pouvez les télécharger une par une ou bien le tout dans un fichier compressé.

Le bon point pour cet outil est qu’il dispose d’une version plugin sur Worpdress ! Cela vous permettra d’optimiser vos images très rapidement depuis votre espace d’administration WordPress.

Revenons à notre test. Voici ce que l’on obtient après l’optimisation des images de notre page de test :

  • Avant optimisation : 0.8s (1.7MB)
  • Après optimisation : 0.3s (640KB)

Nous voyons clairement la différence ! Vous venez d’économisé de l’espace web mais aussi un temps de changement diminué de 60%, ce qui n’est pas négligeable.

 

Optimizilla

logo optimizilla

Optimizilla est un outil très ressemblant à celui que je viens de vous présenter. Il supporte les images .jpg et .png que vous pouvez optimiser en les déposant sur la page d’accueil de cet outil.

Malheureusement, il n’y a pas de plugin WordPress existant pour Optimizilla au contraire de TinyPNG. Cependant, Optimizilla a une fonctionnalité très intéressante, celui-ci vous permet de visualiser votre image d’origine avec la version optimisée côte à côte vous permettant ainsi de vérifier la qualité de l’image après compression.

En plus de cela, vous disposez d’un réglage en temps réel des couleurs utilisées, vous permettant de modifier de vous même la qualité de l’image et ainsi l’optimiser encore plus tout en ayant l’image de base à côté pour comparer.

Après le test avec les paramètres par défaut, voici ce qu’on obtient :

  • Avant optimisation : 0.8s (1.7MB)
  • Après optimisation : 0.4s (900KB)

C’est un peu moins optimisé qu’avec TinyPNG, cependant comme indiqué dans la description de cet outil, vous avez la possibilité d’optimiser de vous même.

 

Pour conclure

Optimiser les images de son site internet peut sembler superflu mais comme nous venons de le voir, c’est une étape à ne surtout pas négliger !

Rappelons le, en optimisant les images de votre site, vous serez gagnant sur ces deux points :

  • Une meilleure expérience utilisateur
  • Un meilleur référencement

Bonus : Voici un plugin d’optimisation d’images pour WordPress qui est aussi très intéressant. Il s’agit de EWWW Image Optimizer

Toutes ces images, il faut bien les mettre sur un site ! LWS vous propose des hébergements mutualisés pour mettre en place votre site WordPress ou autre. Si vous êtes photographe par exemple, vous pouvez très facilement mettre en place votre galerie de photos sous WordPress et les optimiser avec  EWWW Image Optimizer ou TinyPNG.

Avatar de l'auteur

Auteur de l'article

Gaëtan

Je suis Gaëtan, expert en hébergement web et noms de domaine chez LWS 🌐. J'adore partager mes astuces et mon expérience pour vous aider à briller sur le web ! Suivez-moi pour des conseils pratiques et fun 😊.

Il y a 2548 jours

note article

4.5/5 (287 votes)

Commentaires (0)
Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.

White Book for other Category

Hébergement Web LWS - 3 mois offerts

Hébergement Web Starter LWS GRATUIT pendant 3 mois ! 🚀

Cette offre exclusive comprend tout ce dont vous avez besoin pour créer votre site web GRATUITEMENT : Hébergement 250Go SSD, 5 sites webs hébergeables, WordPress et autres CMS en 1 clic, support réactif 7J/7, serveurs en France...