Optimiser vos images avant de les téléverser sur WordPress améliore considérablement la vitesse de votre site. Pourtant, de nombreux débutants ont des sites lents simplement parce qu’ils téléversent des images non optimisées.
Chez WPBeginner, nous faisons des meilleures pratiques d’optimisation des images une partie de notre routine de blogging régulière. Nous nous assurons que tous nos auteurs créent des images avec les bonnes dimensions et réduisent ensuite la taille du fichier image en utilisant une variété d’outils graphiques.
Dans cet article, nous allons vous afficher comment optimiser vos images pour une performance web plus rapide sans perdre en qualité. Nous partagerons également des extensions d’optimisation d’images automatiques pour WordPress qui peuvent vous faciliter la vie.
Comme il s’agit d’un guide complet sur l’optimisation des images pour le web, nous avons créé une table des matières facile à suivre :
- What Is Image Optimization?
- What Are the Benefits of Image Optimization?
- How to Save and Optimize Images for Web Performance
- Best Image Optimization Tools and Programs
- Best Image Optimization Plugins for WordPress
- Final Thoughts and Best Practices for Image Optimization
- Expert Guides on Improving WordPress Performance
1. Qu’est-ce que l’optimisation des images ?
L’optimisation des images est le processus qui consiste à enregistrer et à fournir des images dans la taille de fichier la plus petite possible sans réduire la qualité globale de l’image.
Bien que le processus semble complexe, il est en fait assez facile de nos jours. Vous pouvez utiliser l’une des nombreuses extensions et outils d’optimisation d’images pour compresser automatiquement les images jusqu’à 80 % sans perte visible de qualité d’image.
Voici un exemple d’image optimisée et non optimisée :
Comme vous pouvez le constater, lorsqu’elle est optimisée correctement, la même image peut être jusqu’à 80 % plus petite que l’originale sans perte de qualité. Dans cet exemple, l’image est 52% plus petite.
Comment fonctionne l’optimisation des images ?
En termes simples, l’optimisation d’image fonctionne en utilisant la technologie de compression.
La compression peut être « avec perte » ou « sans perte ».
La compression sans perte réduit la taille globale du fichier sans aucune perte de qualité de l’image. Avec la compression avec perte, il peut y avoir une légère perte de qualité, mais dans l’idéal, elle ne sera pas notifiée à vos internautes.
Qu’est-ce que l’optimisation des images ?
Vous avez peut-être reçu une recommandation d’optimisation des images de la part du support de votre hébergeur WordPress ou d’un outil de test de vitesse et vous vous demandez ce qu’il faut faire.
Vous devrez réduire la taille des fichiers de vos images en les optimisant pour le web. Nous vous afficherons la marche à suivre étape par étape.
2. Quels sont les avantages de l’optimisation des images ?
L’optimisation de vos images présente de nombreux avantages, mais voici les principaux que vous devez connaître :
- Accélération de la vitesse du site
- Amélioration du classement des moteurs de recherche (SEO)
- un taux de conversion global plus élevé pour les ventes et les prospects
- Moins de stockage et de bande passante (ce qui peut réduire les coûts d’hébergeur et de CDN).
- Sauvegardes plus rapides du site (ce qui peut réduire le coût du stockage des sauvegardes)
Les images sont le deuxième article le plus lourd d’une page web après les vidéos. Selon les archives HTTP, les images représentent 42 % du poids total d’une page web moyenne.
Pour les moteurs de recherche (SEO) et les conversions, l’optimisation des images est une nécessité pour tous les sites d’entreprises qui veulent réussir en ligne.
Vous vous demandez peut-être quelle différence l’optimisation des images peut réellement faire.
Selon une étude de Strangeloop, un retard d’une seconde dans le temps de chargement d’un site peut vous coûter 7 % de ventes, 11 % de pages vues en moins et une baisse de 16 % de la satisfaction des clients/clients.
Si ces raisons ne suffisent pas à accélérer votre site, sachez que les moteurs de recherche comme Google accordent également un traitement préférentiel aux sites qui se chargent plus rapidement.
Cela signifie qu’en améliorant vos images pour le web, vous pouvez à la fois améliorer la vitesse du site et renforcer le classement SEO de WordPress.
Tutoriel vidéo
Si vous préférez des instructions écrites, continuez à lire.
3. Comment enregistrer et optimiser les images pour le Web
La clé d’une optimisation d’image bien réussie pour les performances web est de trouver l’équilibre parfait entre la taille de fichier la plus petite et une qualité d’image acceptable.
Les trois éléments qui jouent un rôle énorme dans l’optimisation de l’image sont les suivants :
- Format de fichier image (JPEG vs. PNG vs. GIF)
- Compression (une compression plus élevée = un fichier plus petit)
- Dimensions de l’image (hauteur et largeur)
En choisissant la bonne combinaison des trois, vous pouvez réduire la taille de votre image jusqu’à 80 %.
Examinons chacun d’entre eux plus en détail.
1. Format du fichier image
Pour la plupart des propriétaires de sites, les trois seuls formats de fichier image qui comptent vraiment sont JPEG, PNG et GIF. Choisir le bon type de fichier joue un rôle important dans l’optimisation des images.
Pour simplifier les choses, il est préférable d’utiliser les JPEG pour les photos ou les images très colorées, les PNG pour les images simples ou transparentes, et les GIF uniquement pour les images animées.
Pour ceux qui ne connaissent pas la différence entre chaque type de fichier, le format d’image PNG n’est pas compressé, ce qui signifie qu’il s’agit d’une image de meilleure qualité. L’inconvénient est que la taille des fichiers est beaucoup plus importante.
En revanche, le format JPEG est un format de fichier compressé qui réduit légèrement la qualité de l’image afin de commander un fichier de taille nettement inférieure.
Le GIF, quant à lui, utilise uniquement 256 couleurs et une compression sans perte, ce qui en fait le meilleur choix pour les images animées.
Sur WPBeginner, nous utilisons les trois formats d’image en fonction du type d’image.
2. Compression
Vient ensuite la compression des images, qui joue un rôle considérable dans l’optimisation des images.
Il existe différents types et niveaux de compression d’images. Les réglages de chacun d’entre eux varient en fonction de l’outil de compression d’image utilisé.
La plupart des outils de modification d’image tels que Adobe Photoshop, ON1 Photo, GIMP, Affinity Photo et d’autres disposent de fonctionnalités de compression d’image avant intégrées.
Vous pouvez également enregistrer les images normalement, puis utiliser un outil web comme TinyPNG ou JPEGmini pour faciliter la compression des images.
Bien qu’elles nécessitent un certain effort manuel, ces deux méthodes vous permettent de compresser les images avant de les téléverser sur WordPress, et c’est ce que nous faisons sur WPBeginner.
Il existe également plusieurs extensions WordPress populaires comme Optimole et EWWW Image Optimizer qui peuvent compresser automatiquement les images lorsque vous les téléversez pour la première fois. C’est pratique, et de nombreux débutants et même de grandes entreprises préfèrent utiliser ces extensions d’optimisation d’images.
Nous en dirons plus sur l’utilisation des extensions WordPress ultérieurement dans cet article.
3. Dimensions de l’image
Normalement, lorsque vous importez une photo à partir de votre téléphone ou d’un appareil photo numérique, elle présente une très haute résolution et de grandes dimensions de fichier (hauteur et largeur).
En général, ces photos ont une résolution de 300 DPI et des dimensions à partir de 2000 pixels. Si les photos de haute qualité conviennent bien à l’impression ou à la publication assistée par ordinateur, leur grande taille les rend inadaptées aux sites web.
La réduction des dimensions de l’image à un niveau plus raisonnable permet de diminuer considérablement la taille du fichier. Vous pouvez simplement redimmensionner les images à l’aide d’un logiciel de modification d’image sur votre ordinateur.
Par exemple, nous avons optimisé une photo avec une résolution de 300 DPI et des dimensions de 4900×3200 pixels. La taille du fichier original était de 1,8 Mo.
Nous avons choisi le format JPEG pour une meilleure compression et modifié les dimensions en 1200×795 pixels. La taille du fichier a été réduite à seulement 103 Ko. C’est 94 % de moins que la taille du fichier original.
Maintenant que vous connaissez les trois facteurs importants de l’optimisation des images, examinons les différents outils d’optimisation des images destinés aux propriétaires de sites web.
4. Meilleurs outils et programmes d’optimisation d’images
Comme nous l’avons mentionné précédemment, la plupart des logiciels de modification d’images sont dotés de réglages d’optimisation et de compression des images.
En dehors des logiciels de modification d’images, il existe également plusieurs outils d’optimisation d’images gratuits et puissants que vous pouvez utiliser pour optimiser les images pour le web (en quelques clics).
Nous vous recommandons d’utiliser ces outils pour optimiser les images avant de les téléverser sur WordPress, surtout si vous êtes perfectionniste.
Cette méthode vous aide à enregistrer de l’espace disque sur votre compte d’hébergeur WordPress, et elle garantit l’image la plus rapide avec la meilleure qualité puisque vous examinez manuellement chaque image.
Adobe Photoshop
Adobe Photoshop est une application de modification d’image haut de gamme qui vous permet d’exporter des images avec une taille de fichier réduite pour le web.
La boîte de dialogue d’exportation vous permet de choisir le format de fichier image (JPG, PNG, GIF) qui permet d’obtenir la taille de fichier la plus petite.
Vous pouvez également réduire la qualité de l’image, les couleurs et d’autres options pour diminuer encore la taille du fichier.
GIMP
GIMP est une alternative libre et gratuite à Adobe Photoshop. Il peut être utilisé pour optimiser vos images pour le web. L’inconvénient est qu’il n’est pas aussi facile à utiliser que d’autres solutions de cette liste.
Tout d’abord, vous devez ouvrir votre image dans GIMP et sélectionner l’option Fichier » Exporter sous… « . Cela fera apparaître la boîte de dialogue Exporter l’image, dans laquelle vous pouvez donner un nouveau nom à votre fichier. Cliquez ensuite sur le bouton « Exporter ».
Les options d’exportation d’images s’affichent. Pour les fichiers JPEG, vous pouvez utiliser le Diaporama « Qualité » pour sélectionner le niveau de compression et réduire la taille du fichier.
Enfin, vous devez cliquer sur le bouton « Exporter » pour enregistrer le fichier image optimisé.
TinyPNG
TinyPNG est une application web gratuite qui utilise une technique intelligente de compression avec perte pour réduire la taille de vos fichiers PNG et JPEG. Tout ce que vous avez à faire est d’aller sur leur site et de téléverser vos images en utilisant un simple glisser-déposer.
Ils compresseront l’image et vous donneront un lien de téléchargement.
Ils ont également une extension pour Adobe Photoshop, que nous utilisons dans le cadre de notre processus de modification des images, car elle vous permet d’accéder à TinyPNG à partir de Photoshop.
Pour les développeurs/développeuses, ils ont une API pour convertir les images automatiquement. De plus, pour les débutants, ils ont une extension WordPress qui le fera pour vous. Nous en reparlerons ultérieurement.
JPEGmini
JPEGmini utilise une technologie de compression sans perte qui réduit considérablement la taille des images sans affecter leur qualité perçue. Vous pouvez également comparer la qualité de l’image originale et de l’image compressée.
Vous pouvez utiliser leur version web gratuitement ou acheter le programme pour votre ordinateur. Ils ont également une API payante pour automatiser le processus pour votre serveur.
ImageOptim
ImageOptim est un utilitaire Mac qui vous permet de compresser les images sans perte de qualité en trouvant les meilleurs paramètres de compression et en retirant les profils de couleur inutiles.
Une alternative à Windows est le Trimage.
5. Les meilleures extensions d’optimisation d’images pour WordPress
Nous pensons que la meilleure façon d’optimiser vos images est de le faire avant de les téléverser sur WordPress. Cependant, si vous gérez un site multi-auteurs ou si vous avez besoin d’une solution automatisée, alors vous pouvez essayer un plugin de compression d’images WordPress.
Voici notre liste des meilleures extensions WordPress de compression d’images :
- Optimole, une extension populaire de l’équipe de ThemeIsle
- Optimiseur d’images EWWW
- JPEG, PNG & WebP Image Compression, une extension de l’équipe TinyPNG mentionnée ci-dessus
- Imagify, une extension créée par la populaire équipe de WP Rocket
- ShortPixel Image Optimizer
- Optimiser
- reSmush.it
- Envira Gallery est une extension de galerie WordPress avec compression d’image intégrée.
Ces extensions WordPress d’optimisation d’images vous aideront à accélérer votre site.
6. Réflexions finales et meilleures pratiques pour l’optimisation des images
Si vous n’enregistrez pas d’images optimisées pour le web, vous devez le faire dès maintenant. La vitesse de votre site s’en trouvera considérablement améliorée et vos utilisateurs/utilisatrices vous en remercieront.
De plus, la rapidité des sites est un atout pour le référencement, et vous constaterez probablement une amélioration de votre classement dans les moteurs de recherche.
En dehors de l’optimisation des images, les deux choses qui vous aideront de manière significative à accélérer votre site sont l’utilisation d’une extension de mise en cache WordPress et l’utilisation d’un CDN WordPress.
Vous pouvez également faire appel à une entreprise d’hébergement WordPress infogérée, car elle propose souvent à la fois la mise en cache et le CDN dans le cadre de sa plateforme.
Guides d’experts sur l’amélioration des performances de WordPress
Nous espérons que cet article vous a aidé à apprendre comment optimiser vos images sur WordPress. Vous pouvez également consulter d’autres articles liés à l’amélioration des performances de WordPress :
- Le guide ultime pour améliorer la vitesse et les performances de WordPress
- Comment accélérer les performances de WooCommerce
- Les meilleurs plugins de mise en cache WordPress pour accélérer votre site web
- Comment optimiser Core Web Vitals pour WordPress (Guide ultime)
- Comment réduire le temps d’affichage du premier octet (TTFB) dans WordPress – Conseils d’experts
- Comment utiliser le plugin GTmetrix pour améliorer les performances d’un site WordPress
- L’hébergement WordPress le plus rapide (tests de performance)
- Les indicateurs importants à mesurer sur votre site WordPress
- Comment effectuer correctement un test de vitesse d’un site web
- Comment tester le stress d’un site web WordPress
Si vous avez aimé cet article, veuillez alors vous abonner à notre chaîne YouTube pour obtenir des tutoriels vidéo sur WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.
Diane Talbotier
Hi, does resizing mean changing the size of the images as they are shown on the website, or resizing the size of the file , please?
And how do I know what is the optimal size?
WPBeginner Support
It would depend on what you mean, for compression in this guide, it is the size for the file. You can also reduce the width and height of an image if it is too large. Your specific theme would determine the specific image size you want to use.
Administrateur
Terri
You mentioned in your optimise example that your original photo was 300dpi, then you optimised it to a smaller file size. But you did not say what the target dpi was. Is it 72 for web? Or higher? Thanks for the informative article.
WPBeginner Support
That would depend on your personal preference and how large you are wanting/needing the images to be.
Administrateur
Romel
thanks a lot it cleared a lot of doubts.
WPBeginner Support
Glad our article was helpful
Administrateur
Odenyi Emmanuel Chidera
What I like most about wpbeginner is how they will give you information on what to implement on your own site but also tell you what they are using on their own site. It really helps me decide faster. Learning from a master is always easier. Thanks.
WPBeginner Support
You’re welcome, glad you like our content
Administrateur
Luz Manalo-Cruz
I’ve compressed images via TinyPNG and tried to replace the heavier images on my site with these (ie. I deleted the heavy photos and uploaded the compressed ones). However the media library is still uploading the old heavier images. Does that mean that I can’t replace the old images already uploaded? Will it only upload the compressed images that have not been uploaded at all?
WPBeginner Support
If you are replacing the heavier images, you would want to ensure you don’t have caching on your site that is showing the old image and when you upload the new image that you are uploading the correct image.
Administrateur
Giovanna
Thanks for the informative article, Syed.
Moving forward I am going to make sure to always use optimized images. Do you recommend I go back to already published posts and replace my images with optimized ones?
WPBeginner Support
If possible we would recommend updating your older images, the plugins we recommended should handle that for you
Administrateur
Percy Young
Thank you for your post. many nice tools. I wonder if theres any thing to be done to rezize images that have been previously uploaded, and how to delete images the worpress is not using any more.
WPBeginner Support
If you need to generate new images you could follow our guide here:
https://www.wpbeginner.com/plugins/regenerate-thumbnails-new-image-sizes-wordpress/
For removing the extra images there are media cleanup plugins that you are able to use
Administrateur
WPBeginner Support
Glad you’ll use our recommendations
Administrateur
Dr Amandeep Sandhu
Thanks for sharing such ideas….!
WPBeginner Support
You’re welcome, thanks for reading our articles
Administrateur
İbrahim BOZKURT
I’m a WordPress developer. I am writing from Turkey.
Very difficult to find quality WordPress resources.
I discovered you. I didn’t know English but learned English. Thanks to you everything.
WPBeginner Support
Thank you for reading our articles and congratulations on learning a new language
Administrateur
Felipe Adan Lerma
Hi, it seems maybe WordPress has incorporated some of this into its current image upload process, at least in the Premium bracket?
I ask cause I now get the option to choose the actual size or something larger or smaller?
Or is that process not an optimization / reduction in size of the image?
Thanks so much! Very important useful topic.
Adan
WPBeginner Support
It sounds like you may be talking about WordPress.com and they have custom plugins setup for sites on their service
Administrateur
Felipe Adan Lerma
Ahhh, yes, I forget the two WP’s differ, sorry. I’m still trying to figure out how to work where I am w/WP & it’s definitely via their .com sites. Thank so much then, WP – Adan
WPBeginner Support
No worries, should it help we have our article listing the differences here:
https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Anna
Very helpful info!! I was just researching how to do this when your email came through! Saved em time and effort and had just the advice I was looking for.
WPBeginner Support
Glad our guide and newsletter could be helpful
Administrateur
Lindsay
When saving on photoshop what width do you suggest for optimum web performance?
My theme is saving 1600×1050 for optimum header but what should I do for the body images. Theme designer doesn’t have a recommendation.
WPBeginner Support
If you’re going through the other steps in this article then the image size would be what would fit your content’s dimensions best so WordPress wouldn’t need to resize the image.
Administrateur
edccde
Please update that youtube video.First of all Jpegmini isn’t a web app and it is a software which i have to install in my pc.
WPBeginner Support
Thank you for letting us know about the video, we’ll certainly look into updating the video
Administrateur
Jackie
Is there way to compress images already uploaded to wordpress? Or do I need to compress all my images and then reupload into WP? THanks in advance for the advices.
Irina
Hi,
Need an advice: I need to upload Low res and Hi-res images (1200pix at 300dpi) so my customers can download them. I have no questions about LR image optimization. How can I save hi-res images? The size is up to 2 MB. I have hundreds of thousands of images…
Ratan Kumar
This post is awesome and really add value to my site. However, I recently tried to save images from flipkart but it saved in very low pixel format. Wondering if you can help me to figure out on how to do that.
Ray
I already bulk uploaded 1500 product images that were connected to image urls I found on the internet.
Now that I have those 1500 images already in my Media Library, how can I go back and resize and compress them?
Also, I’m confused about whether resizing means changing the size of the images as they are shown on the website, or resizing the size of the file.
Thanks!
Sara Lewis
what about the plugin ewww image optimizer?
WPBeginner Support
Hey Sara,
Yes its a good alternative. However, for better results we would still recommend optimizing images in your image editing program before uploading to WordPress.
Administrateur
Donna
I will be travelling to a place where internet connectivity is limited and expensive. So, I want to reduce the file size of my photos before I go online to upload them to my blog. Can someone please recommend for me what resolution and dpi would be good to use? The app I am planning to use asks for three measurements:
resolution – from 200 to 2048
DPI – from 72×72 to 300×300
jpeg quality (compression level) – from 0.00 to 1.00
Carrie
In the video she changes her pic. I understand the screen in PS. But you have not explained what should the width and height be in pixels for WP the limit is 2mb. What would be a good standard for sliders, etc for a wp site?
Carrie
Sorry for being the dunce in the corner, but could someone please clarify one thing? I installed the WP Smush it plugin and have been slowly working through all the photos I’ve uploaded to my site for the last 2 years. I’m doing 50 at a time, the free limit. However, now that I have the plugin, for future photo uploads, does having it mean I don’t have to use any other program to resize my photos before uploading them to my WP site? If I have an 8 MB photo and upload it to my site, the plugin does everything for me? I just want to confirm that the original photo is not still uploaded and saved to my host server, SiteGround. My site is wicked slow, I’ve run tons of diagnostics, and I still can’t figure out why except that everything points to my photos. Thanks!
Tony Squibb
Hi Carrie, I’m defo not an expert in any way but I do have experience with WP Smush it and yes, future uploads should be auto ‘smushed’. There is a little notification in the media gallery as you do so.
To check the causes of your slow site you can use GTmetrix and then open the waterfall page where it will show the times of the individual pages items loading. Once you know what is the problem you can then address it.
I hope that helps from one ‘dunce’ to another
Carrie
Hi Tony,
Thanks for weighing in! Unfortunately I uninstalled WP Smush and tried EWWW Image Optimizer along with the Thumbnail Regerate plugin (based on another bloggers suggestion) and royally messed up the photos on my site. I’m a newb with regards to how to manage my files through the FTP on my web host, so I ended up deleting a bunch of images (as in hundreds) and re-uploading them after resizing them manually in an image program. Turns out that too was a bad idea. Now I have a bunch of error messages when I render my site in my Google Console because when Google crawls my site, those files are now gone or moved. AGH! I’m on the verge of simply paying someone to revamp my site or quitting altogether. But I really appreciate that you took the time to leave a helpful comment.
Happy New Year! May 2017 be better than 2016.
Jeff
hi
Best Image Optimization Plugins for WordPress Site Which is?
Gagan
I was thinking what if i upload my Images to Google Blogger and use them on my wordpress Site by « Insert From URL » option?
Any suggestion if this is a Good Idea or no?
Thanks in advance
Zimbrul
I came back here as I’m looking for plugins that upload a large image as a optimised image straight to WordPress. I’m sure I’ve seen this somewhere here at WP Beginner but I cannot find it.
WPBeginner Support
Please take a look at Optimizing images with WP Smush pros, cons, and alternatives.
Administrateur
Jack
Photoshop is definitely the best one, for online services, kraken.io and resizeimage.net are good alternatives to tinypng.
tanveer
is xnview a good option for compressing images?
WPBeginner Support
We haven’t tried it.
Administrateur
Larry Aldrich
Someone mentioned RIOT in an earlier comment. It is my go-to app for minimizing images BEFORE you upload them. The compression rate is close to phenomenal. Sorry MAC users, but it’s only available for Windows.
Martin
Hello WPBeginner,
I would be very interested in the Windows version of Trimage you have apparently seen.
On the Trimage homepage you just see a link asking for help with the windows port…
Greg
I have got used to using Fireworks even though I have CS3
Zimbrul
Me too. I use CSS4 and still go to Fireworks for image optimisation.
Marianne P.
I just checked out the Trimage site and did not see the Windows version – just various *nix versions. Please point me in the right direction. Thanks so much – really great article!
Corinna
I was wondering if there was any way of reducing the size of the images already uploaded to a site? I have changed the way I upload them so in future all my images will be smaller. But I thought maybe it would be useful to change the size of those already uploaded.
Julie Anglesey
I would also like to know how to reduce the size of images already uploaded.
Zimbrul
It’s (or was) Smush-It.
Samiullah Khan
Search the web too much to find good solution to optimize images; but most of them most of them doesn’t let’s see tools mentioned in this post work or not
Graham
The article defines PNG as an uncompressed file format, but as far as I know, standard PNGs use lossless compression.
And I think it would be helpful to mention why you might choose one format over another for continuous tone images (eg. a photo) vs. limited palette images (eg. a logo).
Rob Dewing
Why no mention of Photoshop Elements, the cut down home use version of Photoshop? It does 90+% of the things full phat Photoshop will do, including ‘save for web’ image compression, all for less than $100.
Ines
Would you recommend to use Flickr to upload your images and then copy the HTML code to your wordpress site? What would you suggest for travel blogs that contain lots of pictures? Thanks.
WPBeginner Support
You can add flickr photos in WordPress by simply pasting the photo URL in a post. Normally we would not recommend it, because people will be viewing and finding your photos on Flickr and may never even get a chance to visit your website. However, if you feel that building a community around your photos on flickr is more useful for you, then sure go ahead.
Administrateur
Benjamin
You could add kraken.io to your list. It does the same thing as Jpegmini but also works with PNG images.
Aurel
I am using RIOT, which is free, very fast and exelent program.
Debra Torres
I’ve been using the Yahoo Smush it tool at: http://www.smushit.com/ysmush.it/
Would you recommend this one? Or are the others you mentioned better?
WPBeginner Support
Smushit is a great tool too. But try other tools we mentioned and compare the results.
Administrateur
James DiGioia
There is WordPress plugin for Smush.it:
http://wordpress.org/plugins/wp-smushit/
This makes it easier to compress images using Smush.it without having to prep them beforehand.
Youri van Dijk
I was about to mention that plugin as well. I generally do save my images optimized myself, but for clients that are not very familiar with these tools installing the plugin is a huge benefit.
John Mauldin
Your article is VERY timely. Just encountered the need to reduce hundreds of photos for a kitchen and bath showroom. Bought JPEGmini since I could only do 20 photos a day in the free version but $19.99 is nothing for the ability to drag and drop entire folders into the program and have it zip them in seconds/minutes. Thanks so much for the help!
Haseeb
Isn’t there any automated way of doing this on wordpress? How about ‘WP Smush.it’ ?
Editorial Staff
You can automate the process with some tools that we mentioned or using this plugin:
http://wordpress.org/plugins/ewww-image-optimizer-cloud/
But why create more server load when this can be resolved by educating the user.
Administrateur
Marlene
Great article, however I was under the impression that any images with text on them should be saved as PNG files for best sharpness….?
Editorial Staff
PNG will definitely have a higher quality, but most folks won’t be able to tell the difference unless you put them side-by-side. If you can speed up your site with a non-noticeable difference, then why not
Administrateur
Adam W. Warner
Great article, and an important subject many WordPress admins miss.
[Link Removed]
Lynn
Lightroom has a number of presets for exporting to Facebook and Web – do those compress the photo files sufficiently or should I still turn to Photoshop?
Editorial Staff
Not sure about lightroom and how it exports image. You can run a side-by-side test.
Administrateur
Graham
Lightroom will do pretty much the same job as Photoshop when exporting photos to JPEGs.
Bill Wells
Lightroom is the go-to for photographers; it allows you to optimise your photos in batches and then will export the batch to your preferred pixel size and compression in a number of formats, including jpeg. It also automatically adds your copyright message to the batch if you want.
I don’t know about batch-processing in Photoshop but I use it for major image manipulation only.
I guess if you’re doing graphics or heavy manipulation, use Photoshop but if you’re using lots of photos and just want them to look their best, use Lightroom.
Scott Wyden Kivowitz
I’m a big advocate for many of the products you mentioned. Now I get to add this link to my resources for whenever customers ask me this exact question. Thanks Syed.
Editorial Staff
You’re very welcome Scott.
Administrateur
Dave Kulas
If you are taking the pictures yourself for your website …. set your camera to take a picture at 800 x 600 and at less resolution. Some camera have a Good – Better – Best resolution setting … use the « GOOD » setting. . You should get an image that will load quickly.
If you already have some images … take a look at for FREE … http://www.getpaint.net ….. I have been using it for years. I take the HUGE photos given to me by clients … then RE-SIZE them to 800 x 600. Then I use the built in compression tool to compress the image.
Steven Alig
I would not recommend taking low resolution photos.
You will want to take your original photos at higher resolutions just in case you want to use them for something else. Plus if you take photos at a higher resolution, you will have the ability to crop in on an area if desired.
If the photos are a lower resolution, you will not have that option and will be stuck with what you have taken as the original.
Mark Pridham
I have to agree with Steven on this. I highly recommend taking high resolution images in your camera. You then have a large file that you can work with, It very easy to reduce file size from a hi-res image, but impossible to go the other way. By taking hi-res images, you also have the option of using them for print work if the need arises, Generally, I end up with the large, raw image, a cropped and retouched print image, and a smaller image for web-based work.
Michael Maye
I would agree too about taking full high resolution photos. Then resize down and compress for uploading to your website. You will always have the original high res photo for other uses.
Zimbrul
I usually use Fireworks and then Tiny PNG if required.
Editorial Staff
Yup that’s a good combination
Administrateur
Geoffrey Gordon
Great article Syed.
However I really think that fireworks is the king when it comes to optimising images for the web and its a whole lot cheaper than Photoshop.
Editorial Staff
Thanks Geoffrey. Yup I know Photoshop is expensive which is why I mentioned other free tools as well. GIMP and Fireworks both has this functionality.
Administrateur
paul
So I’ll just follow the options as seen on the image in this article’s Photoshop section and it’s all good?
Editorial Staff
Yup, if you do that, then you will have probably one of the best performance results. However depending on an image, some might not look as good, so in those cases we try the Very High. Do it on case by case basis, but most images would be fine.
Administrateur
Andrew Brown
You discuss using Photoshop, which is way beyond most bloggers needs or price – why do you not refer to Lightroom, which also has an excellent image export option, including an option to restrict the max file size, as well as save by dimension or using a set dpi.
Once some one knows the comp screens work at 72dpi, the rest becomes much easier, and it becomes amazing as to how easy it is to have a web template amongst the export options without needing any real in depth knowledge of what needs to be done.
Editorial Staff
Andrew,
Yes we understand that Photoshop is expensive which is why we mentioned several other free options. Just updated the article now to add a link to GIMP right below photoshop.
As for Lightroom, didn’t mention it because we don’t use it. Same reason why Fireworks was left out.
Administrateur