Optimiser les images de son blog, de son site ou de son e-commerce est aujourd’hui une obligation. Les images doivent être qualifié, mais surtout se charger toujours plus rapidement.
Alors, comment trouver la bonne image, la mettre à la bonne taille et surtout au bon poids ?
53% des internautes abandonnent quand le temps de chargement dépasse 3 secondes !
C’est cruel, mais c’est comme ça, l’internaute n’est pas patient, 20 secondes d’attente et l’on a tous l’impression que cela dure une heure !
Cependant, il existe de nombreuses méthodes pour accélérer l’affichage de son site. Ce sont souvent des techniques assez complexes demandant une expertise externe et pas mal de temps.
Toutefois, en appliquant quelques bonnes pratiques simples, facilement accessibles et ne nécessitant aucune compétence technique, on peut optimiser les images de son site et accélérer son affichage.
1 – Choisir une bonne image
En effet, choisir une image d’illustration ne devrait jamais être un problème. Il existe de nombreuses façons de récupérer des images libres de droits de qualités.
ATTENTION, vérifier toujours que c’est le cas. Vérifiez aussi que celle-ci est utilisable à des fins commerciales.
À titre d’exemples, on peut citer :
Unsplash a clairement ma préférence. En effet, il ne demande pas d’enregistrement, sa base de photos est gigantesque, elle est enrichie tous les 10 jours et les photos sont super canon !
Une fois l’image de votre choix téléchargé sur votre poste il est temps de passer à l’étape 2.
2 – Mettre l’image à la bonne taille et compression
Avec l’avènement du mobile, il n’est plus indispensable de publier des images gigantesques.
Limitez-vous à la taille max de votre blog entre 600 à 800 px max, cependant, ne dépassez pas 1200 px, cela ne sert à rien sur mobile et la majorité de vos lecteurs est sur mobile.
Une fois que vous avez déterminé qu’elle est votre taille idéale, direction Squoosh, le meilleur outil de compression du moment.
Importez votre image.
Photo by Dmitry Mashkin on Unsplash
Dans le panneau de gauche, cliquez sur resize et choisissez la nouvelle taille.
En dessous dans Compress, choisissez le format de compression.
Attention, certains formats ne sont pas compatibles avec tous les navigateurs. Dans le doute prenez browser jpeg ou Browser png, en fonction de votre image de départ.
Enregistrez votre nouvelle image.
3 – Postez votre image sur votre site
Et c’est tout !
Cependant si vous avez des besoins plus importants, vous pouvez utiliser caesium (uniquement PC) pour faire par exemple de la retouche par lots.
Enfin, si vous connaissez ou utilisez d’autres outils, n’hésitez pas : partagez-les en commentaires.
À propos : Frédéric Décamp
Depuis 20 ans, j’expérimente tout ce que l’on peut faire avec Internet. J’ai créée des sites, fait du web marketing, du community management, de l’UX et de l’UI… Beaucoup de tout, toujours avec passion. Trouver des réponses simples à des problématiques complexes, c’est mon job.
