Pour accélérer le chargement de tes articles et pages Web, l’une des solutions est de réduire la taille des images. Si tu fais des photos avec un réflex ou avec un smartphone, dans quatre-vingt-dix pourcents du temps, cela ne sert à rien de mettre des images aussi grandes sur le Web, à part à ralentir le chargement. Dans ce tutoriel, nous allons voir comment réduire la taille d’une image (réduire la taille jpeg, jpg, png, gif…), comment redimensionner rapidement et gratuitement. Prêt à accélérer ton site Web ?
Avant de commencer, tu souhaites peut-être découvrir 4 façons pour réduire le poids de tes images pour accélérer le chargement des pages et articles de ton site Web ou gagner de la place sur ton disque dur.
Comment réduire la taille des images jpg, jpeg... gratuitement
Pour commencer, voyons comment réduire la taille des images sur son ordinateur. Nous allons utiliser un logiciel gratuit qui se trouve sur tous les ordinateurs Windows.
Tout d’abord, dans la barre de recherche de Windows, tape « paint » et sélectionne cette application :
Le logiciel t’affiche une page blanche, c’est normal, nous n’avons pas encore commencé. 😉
Clique sur l’onglet Fichier (en haut à gauche), et sélectionne Ouvrir ou tape CTRL + o sur ton clavier :
Ensuite, choisis une image (extension jpeg, jpg, png…) que tu souhaites redimensionner. Je sélectionne une image de 4032px de large et de 3024px de long. Cette image est très grande, je déconseille d’utiliser une image aussi grande pour un site Web, car elle mettra du temps à charger, et cela risque de ne pas plaire à tes visiteurs. Sauf, si tu es photographe et que tu souhaites conserver la meilleure qualité possible. Bref… nous allons redimensionner cette image.
Si tu souhaites utiliser la même image.
Pour ce faire, dans le menu de Paint, clique sur Redimensionner, là, un pop-up va apparaître. Clique sur le bouton radio Pixels, et dans l’un des deux champs juste en dessous (Horizontal, Vertical) inscris la dimension que tu souhaites. Je vais mettre « 720 », dans le champ Vertical :
Tu remarqueras que le second champ est automatiquement redimensionné. Dans mon cas, j’ai mis « 720 » dans le champ vertical, horizontal passe automatiquement à 960 au lieu de 4032, cela va éviter que ton image soit étirée !
Si tu souhaites ôter cette fonction, c’est possible à décocher Conserver les proportions.
N’oublie pas de cliquer sur OK, lorsque tu as terminé.
Réduire la taille jpeg, jpg... en ligne
Tu peux aussi très bien réduire la taille de tes images en ligne. Pour ce faire, nous allons utiliser le site Resizing-Pictures.
Tu es certainement sur la page d’accueil de Resizing-Pictures ? Nous voyons que cela se passe en trois étapes :
- Tout d’abord, choix de l’image sur son disque dur.
- Ensuite, choix de la taille de l’image souhaitée (soit en largeur, soit en hauteur).
- Enfin, téléchargement de l’image.
Pour commencer, à CHOISIR UNE PHOTO, je vais sélectionner la même image que j’ai utilisée dans l’exemple plus haut.
Ensuite, à REDUIRE LA TAILLE, je vais sélectionner Hauteur, et mettre la valeur 720, comme pour l’exemple précédent !
Enfin, à SAUVEGARDER, nous allons cliquer sur le bouton Réduire, (cela peut prendre quelques seconds, sois patient).
Super, mon image a été redimensionnée ! Tu remarques que si tu as redimensionné la hauteur comme moi, la largeur est proportionnée en fonction de la valeur que tu as mise en hauteur, et cela fonctionne aussi inversement. Dans mon cas, j’ai mis « 720 » en hauteur, la largeur passe automatiquement à 960, comme pour l’exemple plus haut.
Tu ne sais peut-être pas comment vérifier cela ? C’est ce que nous allons voir de suite.
Comment découvrir la taille d'une image ?
Voilà une chose bien utile : découvrir la taille de ses images, comment faisons-nous cela ?
Pour commencer, sur Windows, va dans un dossier où tu as une image, peut importe l’extension : jpg, jpeg, png…
Ensuite, fais un clic droit sur l’image, et sélectionne Propriétés :
Puis, clique sur l’onglet Détails, plus bas tu verras écrit Dimensions, les valeurs correspondent à la largeur et à la longueur de ton image. Chez moi, il s’agit d’une largeur de 960 pixels et d’une longueur de 720 pixels. Lorsque tu as terminé, tu peux cliquer sur OK ou Annuler :
Voilà comment connaître la taille d’une image.
Comment réduire un fichier jpeg, gif, png... sur son site Web ?
Nous allons voir comment redimensionner les images de son site Web fait avec WordPress.
Pour ce faire, nous allons utiliser un plugin.
Installation du plugin réduire la tailles des images
Tout d’abord, nous allons télécharger et installer l’extension Resize Image After Upload de ShortPixel. Tu remarqueras que ShortPixel font aussi d’autres plugin :
- Pour commencer, Survol Extensions dans le menu de ton administrateur WordPress.
- Ensuite, clique sur Ajouter.
- Ecris « resize image after ».
- Ensuite, clique sur le bouton Installer maintenant.
- Puis, sur le bouton Actif.
- Ensuite, survol Réglages.
- Enfin, clique sur Resize image upload.
Que nous dit-il ce plugin ? Il a actuellement (au moment où j’écris ces lignes) quatre-vingt-dix mille installations actives pour cinquante votant, avec une moyenne de cinq étoiles sur cinq. La dernière mise à jour date de neuf mois : ça, c’est moins bien ! Et la version n’a pas été testée avec mon WordPress.
Utilisation du plugin pour Réduire la taille d'une jpeg, png...
Tu es dans les paramètres de l’extension (Réglages -> Resize image upload) ?
A Enable re-sizing : Nous allons laisser yes, pour que le plugin fasse son travail !
Max image dimensions : cette partie va nous intéresser en particulier. C’est ici que nous allons redimensionner nos images, Width correspond à la largeur et Height à la longueur de l’image. J’ai indiqué 600 x 600 sur mon exemple. Il faut savoir qu’en fonction de l’image le plugin ne va pas forcément donner la taille de « 600 x 600 », pourquoi ? Pour que l’image ne paraisse pas étirée, l’extension va conserver les proportions :
Sur l’exemple plus haut, nous voyons que le plugin a gardé 600 en largeur comme convenue, et 424 en hauteur, pour ne pas déformer l’image : pratique non ?
JPEG compression level : je laisse à 90, comme le conseille le plugin.
Force JPEG re-compression : Je laisse sur no, j’utilise rarement l’extension JPEG !
Enfin, Convert PNG to JPEG : je choisis NO – just resize uploaded png images as normal, je préfère le format PNG !
Modifier les paramètres des dimensions d'images sur WordPress
Il existe d’autres façons pour modifier la taille des images sur WordPress. Une autre façon consiste à faire ces modifications directement dans WordPress. En fait, WordPress par défaut redimensionnent les images en trois types :
- Taille des miniatures (par défaut 150 x 150 px).
- Taille moyenne (par défaut 300 x 300 px).
- Grande taille (par défaut 1024 x 1024 px).
Tu trouveras ces réglages dans Réglages -> Médias du menu admin WordPress.
Bien sûr, il est possible de modifier ces réglages.
Ce qu'il faut retenir
Nous avons vu qu’il est possible de redimensionner une image en jpeg, jpg, png… facilement, rapidement et gratuitement sur son ordinateur. Cela dit, il est également possible de redimensionner tes images en ligne. Si tu as un site sous WordPress, tu pourras utiliser un plugin qui va te redimensionner tes images à la dimension que tu souhaites. Enfin, WordPress te permet aussi de redimensionner les images dans ses paramètres. Les images de ton site Web seront plus légères, elles se chargeront plus rapidement : les visiteurs de ton site vont apprécier !
Quelle est la méthode que tu préfères pour redimensionner tes images ?
Hello Marc, merci beaucoup pour cet article super intéressant et très clair ! 🙂
Tu parles de l’utilisation de Paint mais je vois que tu es sur PC et moi sur un Mac. Est-ce que Paint X est l’équivalent ? Olivier recommandait le plugin Smush et le logiciel ImageOptim également pour la compression d’images. Tu en penses quoi toi ? Très belle fin de journée, Kim
article très instructif , merci beaucoup ; je vais installer le plugin 🙂
Merci Emma 👍. Merci pour ton commentaire.
Merci, j’en avais vraiment besoin! Le tuto est très clair… je m’en vais télécharger ton ebook!
Merci pour ton commentaire… Cela tombe bien, j’ai mis à jour mon e-book il n’y a pas longtemps, j’ai rajouté plein d’infos 😊