Optimiser ses images pour le web s’avère de plus en plus crucial, car les algorithmes de google sont de plus en plus exigeants en matière de performance et de temps de chargement des sites web ; Heureusement que Shortpixel est là, juste installez et configurez-le et laissez le reste pour lui.
Parmi tous les plugins d’optimisation d’images, ShortPixel Image Optimizer a su se démarquer par rapport aux autres plugins, de par sa simplicité et facilité d’utilisation et son efficacité.
S’inscrire sur Shortpixel
Pour optimiser vos images à l’aide de Short pixel, vous devez avant tout vous inscrire sur leur site en cliquant ici.
Pour s’inscrire, cliquez sur « Sign up » puis renseignez votre adresse e-mail, cochez la case des conditions du service pour les accepter, puis cliquez sur le bouton « SIGN UP ».
Juste après, vous recevrez un mail, dont lequel vous trouverez votre mot de passe, et votre clé API qui est une suite de 20 caractères alphanumériques, et que vous utiliserez pour activer votre plugin shortpixel image optimizer sur WordPress.
Copiez votre mot de passe, et connectez vous à votre compte Shortpixel, en cliquant sur le bouton « LOGIN » en haut à droite, puis entrez votre adresse mail et votre mot de passe.
Comme vous voyez, en tant que membre gratuit, vous avez droit à 100 crédits par mois, ça veut dire que vous pouvez optimiser au max 100 images par mois ; au delà il faut souscrire un des quatre plans payants que vous voyez sur l’image ci-dessus.
Passons maintenant à l’étape suivante ; l’installation du plugin ShortPixel Image Optimizer.
Installer ShortPixel Image Optimizer
Comme toute installation de plugin wordpress, pour installer shortpixel image optimiser rendez-vous dans le menu sur Extension > Ajouter ; puis tapez dans le champs de recherche le nom du plugin « Shortpixel image optimizer » ; puis dans les résultats de recherche installez et activez le plugin.
Une fois le plugin est activé, vous serez directement redirigé vers la page des paramètres de shortpixel ; afin d’introduire votre clé API.
Valider la clé API de Shortpixel sur WordPress
Pour permettre à votre site de communiquer avec l’API de shortpixel, copiez la clé API que vous avez reçu dans le mail de confirmation, et collez là dans dans le champ de « API key »
Vous avez installé shortpixel ? si oui, passons à l’étape la plus importante, la configuration de shortpixel.
Configurer Shortpixel Image Optimizer
Comme vous voyez nous avons 5 onglets (General – Advanced – Cloudflare – Statistic – WP Ressources) ; qu’on va explorer un par un ci-dessous.
Commençons par le premier onglet
1. Onglet « General »
Nous avons 6 paramètres à régler dont le premier l’a été déjà, c’est la clé API (car on l’a introduit au début juste après l’installation de shortpixel) ; les 5 autres paramètres sont :
Compression type (Type de compression)
Ce réglage vous permet d’optimiser une image sous WordPress selon trois types de compression :
- Lossless : permet de faire un compression d’image sans aucune perte de qualité.
- Glossy : permet de faire une compression d’image avec une légère perte de qualité.
- Lossy : permet de faire une compression d’image très puissante mais avec une perte de qualité plus importante.
Si vous voulez mon avis, je suis pour la compression « lossy« , d’ailleurs c’est ce que j’utilise sur WPdezero, théoriquement il y’a une petite perte de qualité, mais cette dernière n’est même pas visible à l’œil nu.
Vous pouvez même faire des tests sur vos images, en cliquant sur « Make a few tests« , sur la fenêtre qui s’ouvre, choisissez le type de compression, lossy par exemple, puis glissez l’image ou les images (pas plus de 50) que vous voulez convertir dans le rectangle bleu; puis la conversion se fera automatiquement.
Vous pouvez par exemple essayer les 3 modes de compression sur la même image, puis choisir celui qui vous donne l’optimisation d’image ayant le meilleur rapport Qualité/Poids.
Also include thumbnails
Si vous cochez cette option, la compression s’appliquera aussi sur toutes vos vignettes, dont le nombre dépasse probablement votre quota autorisé sur short pixel, surtout si vous avez choisi le plan gratuit, évitez de cocher cette case au début, sauf si vous avez opté pour un plan payant.
Image backup
Cette option vous permet de sauvegarder une copie de vos images originales, dans un dossier séparé, je vous conseille de l’activer.
Remove EXIF
Cette option sert à supprimer les informations ajoutées aux images comme la date, le lieu de prise de la photo, les réglages etc .. Je vous recommande de la cocher, à moins que vous êtes photographe et que vous voulez partager les réglages de prise par exemple avec votre communauté.
Resize large images
En français « redimensionner les grandes images », ça vous permet de redimensionner automatiquement les images dépassant certaines dimensions, tout en conservant les proportions de l’image originale.
Inutile de vous dire qu’il faut appuyer sur le bouton « Save changes » après chaque modification des réglages précédents afin de les sauvegarder.
Passons maintenant aux réglages avancés (Advanced)
Onglet « Advanced »
Ces réglages sont destinés aux utilisateurs avancés, commençons par le premier paramètre.
Additional média folders
Permet d’optimiser des images qui ne se trouvent pas dans la bibliothèque Media de WordPress, mais ailleurs sur votre hébergement, il suffit juste de choisir le dossier où se trouvent vos images.
Convert PNG images to JPEG
Ce paramètre vous permet d’activer la conversion automatique des images PNG sans fond transparent en images JPEG.
CMYK to RGB
Le format CMYK ou (CMJN en français) est dédié à l’impression alors que le format qu’il faut utiliser pour le web est le format RGB ou RVB en français.
En activant cette option, toutes les images au format CMJN seront automatiquement converties au format RVB ce qui nous fait gagner quelques kilos de poids.
WebP images
WebP est un nouveau format d’images créé par Google permettant d’obtenir des images trois fois plus petites tout en gardant une qualité similaire à l’image initiale.
Ce paramètre vous permet d’optimiser vos images sur WordPress en créant une version WebP de vos images gratuitement et de la livrer au visiteur si son navigateur web supporte ce format ; donc je vous recommande fortement d’activer cette option.
Voici un article pour en savoir plus sur le format WebP.
Optimize retina images
Les images Retina mettent plus de temps à se charger, pour s’afficher sur des écran Retina, cette option sert à optimiser les images Retina si vous utilisez ces dernières sur votre site.
Optimize other thumbs
Permet d’optimiser les vignettes non optimisées par WordPress comme celles crées par certains plugins donc cochez là.
Optimize PDFs
Si vous avez des documents pdf sur votre site vous pouvez les optimiser en activant ce paramètre.
Exclude patterns
Ce paramètre vous permet d’exclure certaines images de l’optimisation en définissant certaines valeurs comme name, size ou path (chemin du fichier).
Je m’explique, admettant que vous voulez exclure les images contenant dans leurs noms le mot (logo) tous formats confondus, pour le faire tapez :
name : logo
Dans ce cas, des images comme (jolilogo.jpg) (monlogo.PNG) etc.. seront aussi exclues.
HTTP AUTH credentials
A remplir uniquement si votre site est un site privé (site d’entreprise par exemple).
Process in front-end
Cette option vous permet d’optimiser automatiquement les images ajoutées par les visiteurs de votre site s’ils ont la possibilité de le faire, c’est à vous de voir s’il faut l’activer ou non.
Optimize media on upload
En activant cette option, les images ajoutées à votre bibliothèque média de WordPress seront automatiquement optimisées.
Exclude thumbnail sizes
à utiliser si vous voulez exclure les vignettes de certaines dimensions de l’optimisation.
Passons maintenant au 3ème onglet destiné aux utilisateurs de cloudflare.
Onglet Cloudflare
Pas grand chose à dire ni à faire dans cet onglet, Il suffit juste d’entrer vos informations et codes cloudflare (email, clé API, Zone ID), et c’est tout.
Onglet statistiques
C’est là ou vous trouvez les statistiques de votre utilisation de short pixel, entre autres :
- Le quota mensuel
- L’espace disque et la bande passante économisée grâce a shortpixel.
Le dernier onglet ne nous intéresse pas, ils contient juste quelques ressources recommandées par short pixel.
Maintenant que le plugin est configuré, les nouvelles images ajoutées seront optimisées automatiquement, mais il faut penser à optimiser les anciennes images déjà présentes sur votre site ; découvrons ensemble comment le faire.
Comment optimiser les anciennes images de votre site
Pour optimiser les images déjà existantes dans votre site ou blog, il suffit juste de vous rendre à la bibliothèque média de WordPress en cliquant sur Media dans le menu du tableau de bord, puis cliquez sur le bouton « Bulk shortpixel ».
Conclusion
J’ai aimé :
- La facilité d’utilisation
- L’efficacité
- L’automatisme
Je n’ai pas aimé :
- La limitation du plan gratuit à 100 images par mois
Comme je disais la version gratuite de shortpixel est limitée à 100 images/mois, et pour optimiser plus de 100 images/mois il faut passer aux formules payantes.
Vous avez 2 options, vous pouvez acheter un certain nombre de crédit, que vous pouvez consommer à n’importe quel moment, cette option est pratique pour des petits blogs ou sites qui n’ont pas beaucoup de contenus, et qui n’en publient pas régulièrement.
Comme vous pouvez acheter un abonnement mensuel avec un quota d’optimisation chaque mois, ces derniers ne sont pas cumulables et expirent à la fin de chaque mois s’ils ne sont pas utilisés.
Voilà, j’ai fait tout le tour de Shortpixel ; et vous savez à présent comment optimiser vos images pour le web ; et il ne vous reste qu’à choisir de belles images et créations graphiques pour illustrer vos articles ; d’ailleurs au passage je vous propose de lire cet article qui vous présente les meilleurs sites où vous trouverez des images libres de droits.
Si vous avez aimé cet article n’hésitez pas à le partager avec vos amis, et de vous inscrire à notre Newsletter pour recevoir toutes nos nouveautés ; et bien sûr si vous avez des questions ou des suggestions à nous faire n’hésitez pas à nous les poser dans les commentaires.
