WPBeginner

Beginner's Guide for WordPress

  • Blog
    • Beginners Guide
    • News
    • Opinion
    • Showcase
    • Themes
    • Tutorials
    • WordPress Plugins
  • Start Here
    • How to Start a Blog
    • Create a Website
    • Start an Online Store
    • Best Website Builder
    • Email Marketing
    • WordPress Hosting
    • Business Name Ideas
  • Deals
    • Bluehost Coupon
    • SiteGround Coupon
    • WP Engine Coupon
    • HostGator Coupon
    • Domain.com Coupon
    • Constant Contact
    • View All Deals »
  • Glossary
  • Videos
  • Products
X
☰
Beginner's Guide for WordPress / Start your WordPress Blog in minutes
Choosing the Best
WordPress Hosting
How to Easily
Install WordPress
Recommended
WordPress Plugins
View all Guides

WPBeginner» Blog» Beginners Guide» How to Optimize Images for Web Performance without Losing Quality

How to Optimize Images for Web Performance without Losing Quality

Last updated on January 2nd, 2020 by Editorial Staff
1.3k Shares
Share
Tweet
Share
Pin
Free WordPress Video Tutorials on YouTube by WPBeginner
How to Optimize Images for Web Performance without Losing Quality

Did you know that optimizing your images before uploading to WordPress can have a huge impact on your website speed?

When starting a new blog, many beginners simply upload images without optimizing them for web. These large image files make your website slower.

You can fix this by using image optimization best practices as part of your regular blogging routine.

In this article, we will show you how to optimize your images for faster web performance without losing quality. We will also share automatic image optimization plugins for WordPress that can make your life easy.

How to Optimize Your Images in WordPress (Step by Step)

Since this is a comprehensive guide on image optimization for web, we have created an easy to follow table of content:

  • What is image optimization? (optimized vs unoptimized images)
  • Why is image optimization important? What are the benefits?
  • How to save and optimize images for web performance?
  • Best image optimization tools and programs
  • Best image optimization plugins for WordPress

What is Image Optimization? (Optimized vs Unoptimized Images)

Image optimization is a process of saving and delivering images in the smallest possible file size without reducing the overall image quality.

While the process sounds complex, it’s actually quite easy these days. You can use one of the many image optimization plugins and tools to automatically compress images by up to 80% without any visible loss in image quality.

Here’s an example of optimized vs unoptimized image:

Optimized vs Unoptimized Images in WordPress

As you can see, when optimized properly the same image can be 75% smaller than the original without any loss in quality.

How does Image Optimization work?

In simple terms, image optimization work by using compression technology like “Lossy” and “Lossless” which helps reduce the overall file size without any noticeable loss of quality.

What does it mean to Optimize Images?

If you ever received a recommendation to optimize images by your WordPress hosting support or by a speed test tool, then all it means is that you need to reduce the file size of your images by optimizing them for web.

Why is Image Optimization Important? What are the Benefits of Image Optimization?

While there are many benefits of optimizing your images, below are the top ones that you should know:

  • Faster website speed
  • Improved SEO rankings
  • Higher overall conversion rate for sales and leads
  • Less storage and bandwidth (which can reduce hosting and CDN cost)
  • Faster website backups (also reduces cost of backup storage)

Outside of video, images are the next heaviest item on a web page. According to HTTP archive, images make up on average 21% of a total webpage’s weight.

Since we know fast websites rank higher in search engines (SEO) and have better conversions, image optimization is something that every business website must do if they want to succeed online.

Now you might be wondering how big of a difference can image optimization really make?

According to a Strangeloop study, a one-second delay in website load time can cost you 7% of sales, 11% fewer pageviews, and 16% decrease in customer satisfaction.

How speed affects your website

If these aren’t enough reasons to speed up your website, then you should know that search engines like Google also give preferential SEO treatment to faster loading websites.

This means that by optimizing your images for web, you can both improve website speed and boost WordPress SEO rankings.

Video Tutorial

Subscribe to WPBeginner

If you’d prefer written instructions, just keep reading.

How to Save and Optimize Images for Web Performance?

The key to successful image optimization for web performance is to find the perfect balance between lowest file size and acceptable image quality.

The three things that play a huge role in image optimization are:

  • Image file format (JPEG vs PNG vs GIF)
  • Compression (Higher compression = smaller file size)
  • Image Dimensions (height and width)

By choosing the right combination of the three, you can reduce your image size by up to 80%.

Let’s take a look at each of these in more details.

1. Image File Format

For most website owners, the only three image file formats that really matter are JPEG, PNG, and GIF. Choosing the right file type plays an important role in image optimization.

To keep things simple, you want to use JPEGs for photos or images with lots of colors, PNGs for simple images or when you need transparent images, and GIF for animated images only.

For those who don’t know the difference between each file type, PNG image format is uncompressed which means it is a higher quality image. The downside is that file sizes are much larger.

On the other hand, JPEG is a compressed file format which slightly reduces image quality in order to provide a significantly smaller file size.

Whereas GIF only uses 256 colors along with lossless compression which makes it the best choice for animated images.

On WPBeginner, we use all three image formats based on the type of image.

2. Compression

The next thing is image compression which plays a huge role in image optimization.

There are different types and levels of image compression available. The settings for each will vary depending on the image compression tool you use.

Most image editing tools like Adobe Photoshop, On1 Photo, GIMP, Affinity Photo, and others come with built-in image compression features.

You can also save images normally and then use a web tool like TinyPNG or JPEG Mini for easier image compression.

Although it’s a bit manual, these two methods allow you to compress images before uploading them to WordPress, and this is what we do on WPBeginner.

There are also several popular WordPress plugins like Optimole, EWWW Image Optimizer, and others that can automatically compress images when you first upload them. Many beginners and even large corporations prefer to use these image optimization plugins because it’s easy and convenient.

We will share more about these WordPress plugins later in the article.

3. Image Dimensions

Normally, when you import a photo from your phone or a digital camera, it has a very high resolution and large file dimensions (height and width).

Typically, these photos have a resolution of 300 DPI and dimensions starting from 2000 pixels and more. These high-quality photos are well-suited for print or desktop publishing. They are not suitable for websites.

Reducing file dimensions to something more reasonable can significantly decrease image file size. You can simply resize images using an image editing software on your computer.

For example, we optimized a photo with 1.8 MB original file size, 300 DPI resolution, and image dimensions of 4900×3200 pixels.

We chose jpeg format for higher compression and changed dimensions to 1200×795 pixels, and it reduced the image file size to 103 KB. That’s 94% less than the original file size.

Now that you know the three important factors in image optimization, let’s take a look at various image optimization tools for website owners.

Best Image Optimization Tools and Programs

As we mentioned earlier, most image editing software come with image optimization and compression settings.

Outside of the image editing software, there are also several powerful free image optimization tools that you can use to optimize images for web (with just a few clicks).

We recommend using these tools to optimize images before you upload them to WordPress, specially if you are a perfectionist.

This method helps you save disk space on your WordPress hosting account, and it guarantee the fastest image with the best quality since you manually review each image.

Adobe Photoshop

Adobe Photoshop is a premium software that comes with a feature to save images optimized for the web. Simply open your image and click on the “File » Save for Web” option.

This will open a new dialog box. On the right, you can set different image formats. For JPEG format, you will see different quality options. When you select your options, it will also show you the file size on the bottom left.

Saving images optimized for the web using Photoshop

GIMP

GIMP is a free and open source alternative to popular Adobe Photoshop. It can be used to optimize your images for the web. The downside is that it is not as easy to use as some other solutions on this list.

First, you need to open your image in GIMP and then select File » Export As option. This will bring up the save file dialog box. Give your file a new name and then click on the export button.

Export image in GIMP

This will bring up image export options. For jpeg files, you can select the compression level to reduce file size. Finally, click on the export button to save the optimized image file.

TinyPNG

TinyPNG is a free web app that uses a smart lossy compression technique to reduce the size of your PNG files. All you have to do is go to their website and upload your images (simple drag & drop).

Using TinyPNG to optimize images for WordPress

They will compress the image, and give you the download link. You can use their sister website, TinyJPG, for JPEG image compression.

They also have an extension for Adobe Photoshop which is what we use as part of our image editing process because it combines the best of TinyPNG and TinyJPG inside Photoshop.

For developers, they have an API to convert images automatically, and for beginners they have a WordPress plugin that can automatically do it for you (more on this later).

JPEG Mini

JPEGmini uses a lossless compression technology which significantly reduces the size of images without affecting their perceptual quality. You can also compare the quality of your original image and the compressed image.

JPEGMini online image compression tool

You can use their web version for free, or purchase the program for your computer. They also have a paid API to automate the process for your server.

ImageOptim

ImageOptim is a Mac utility that allows you to compress images without losing any quality by finding the best compression parameters and removing unnecessary color profiles.

ImageOptim

Windows alternative to this is Trimage.

Best Image Optimization Plugins for WordPress

We believe that the best way to optimize your images is by doing it before uploading them to WordPress. However, if you run a multi-author site or need an automated solution, then you can try a WordPress image compression plugin.

Below is our list of the best WordPress image compression plugins:

  1. Optimole – popular plugin by the team behind ThemeIsle.
  2. EWWW Image Optimizer
  3. Compress JPEG & PNG images – plugin by TinyPNG team mentioned above in the article.
  4. Imagify – plugin by the popular WP Rocket plugin team.
  5. ShortPixel Image Optimizer
  6. WP Smush
  7. reSmush.it

Using any of these WordPress image optimization plugin will help you speed up your website.

Final Thoughts and Best Practices for Image Optimization

If you’re not saving images optimized for web, then you need to start doing so now. It will make a huge difference on your site speed, and your users will thank you for it.

Not to mention, faster websites are great for SEO, and you will likely see an increase in your search engine rankings.

Outside of image optimization, the two things that will significantly help you speed up your website is using a WordPress caching plugin and using a WordPress CDN.

Alternatively, you can use a managed WordPress hosting company because they often offer both caching and CDN as part of the platform.

We hope this article helped you learn how to optimize your images in WordPress. You may also want to see our guide on how to improve your WordPress security and the best WordPress plugins for business websites.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

1.3k Shares
Share
Tweet
Share
Pin
Popular on WPBeginner Right Now!
  • Revealed: Why Building an Email List is so Important Today (6 Reasons)

    Revealed: Why Building an Email List is so Important Today (6 Reasons)

  • How to Start Your Own Podcast (Step by Step)

    How to Start Your Own Podcast (Step by Step)

  • Google Analytics in WordPress

    How to Install Google Analytics in WordPress for Beginners

  • How to Fix the Error Establishing a Database Connection in WordPress

    How to Fix the Error Establishing a Database Connection in WordPress

About the Editorial Staff

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi. Trusted by over 1.3 million readers worldwide.

The Ultimate WordPress Toolkit

94 Comments

Leave a Reply
  1. Eddier Naranjo says:
    Dec 11, 2020 at 10:52 pm

    The optimization plugins make a copy of the “heavy” image and serve the optimized version. But that increases the storage space on the site.
    Is there a way to delete the old version and leave only the optimized image?

    Reply
    • WPBeginner Support says:
      Dec 14, 2020 at 10:53 am

      We would recommend checking with the support for the plugin that you are using as they normally have an option to remove the unoptimized version.

      Reply
  2. Diane Talbotier says:
    Aug 26, 2020 at 12:04 am

    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?

    Reply
    • WPBeginner Support says:
      Aug 26, 2020 at 11:24 am

      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.

      Reply
  3. Terri says:
    May 25, 2020 at 9:46 am

    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.

    Reply
    • WPBeginner Support says:
      May 27, 2020 at 8:56 am

      That would depend on your personal preference and how large you are wanting/needing the images to be.

      Reply
  4. Romel says:
    May 15, 2020 at 8:07 am

    thanks a lot it cleared a lot of doubts.

    Reply
    • WPBeginner Support says:
      May 15, 2020 at 8:56 am

      Glad our article was helpful :)

      Reply
  5. Odenyi Emmanuel Chidera says:
    May 12, 2020 at 2:02 am

    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.

    Reply
    • WPBeginner Support says:
      May 12, 2020 at 11:15 am

      You’re welcome, glad you like our content :)

      Reply
  6. Luz Manalo-Cruz says:
    Apr 5, 2020 at 11:51 pm

    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?

    Reply
    • WPBeginner Support says:
      Apr 6, 2020 at 3:04 pm

      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.

      Reply
  7. Giovanna says:
    Oct 23, 2019 at 7:49 pm

    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?

    Reply
    • WPBeginner Support says:
      Oct 24, 2019 at 10:28 am

      If possible we would recommend updating your older images, the plugins we recommended should handle that for you :)

      Reply
  8. Percy Young says:
    Oct 23, 2019 at 5:38 pm

    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.

    Reply
    • WPBeginner Support says:
      Oct 24, 2019 at 10:14 am

      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

      Reply
  9. Dr Amandeep Sandhu says:
    Oct 23, 2019 at 7:28 am

    Thanks for sharing such ideas….!

    Reply
    • WPBeginner Support says:
      Oct 23, 2019 at 9:45 am

      You’re welcome, thanks for reading our articles :)

      Reply
  10. İbrahim BOZKURT says:
    Oct 23, 2019 at 4:02 am

    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.

    Reply
    • WPBeginner Support says:
      Oct 23, 2019 at 10:00 am

      Thank you for reading our articles and congratulations on learning a new language :)

      Reply
  11. Wontstop Records says:
    Oct 22, 2019 at 3:03 pm

    Yea real good info i will start to use this immediately has picture size is important also fast loading thanks

    Reply
    • WPBeginner Support says:
      Oct 23, 2019 at 9:44 am

      Glad you’ll use our recommendations :)

      Reply
  12. Felipe Adan Lerma says:
    Oct 22, 2019 at 11:53 am

    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

    Reply
    • WPBeginner Support says:
      Oct 23, 2019 at 9:40 am

      It sounds like you may be talking about WordPress.com and they have custom plugins setup for sites on their service

      Reply
      • Felipe Adan Lerma says:
        Oct 23, 2019 at 8:18 pm

        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

        Reply
        • WPBeginner Support says:
          Oct 24, 2019 at 10:17 am

          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/ :)

  13. Anna says:
    Oct 22, 2019 at 10:04 am

    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.

    Reply
    • WPBeginner Support says:
      Oct 22, 2019 at 10:13 am

      Glad our guide and newsletter could be helpful :)

      Reply
  14. Lindsay says:
    Jun 7, 2019 at 8:48 pm

    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.

    Reply
    • WPBeginner Support says:
      Jun 10, 2019 at 11:45 am

      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.

      Reply
  15. edccde says:
    Apr 9, 2019 at 12:36 pm

    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.

    Reply
    • WPBeginner Support says:
      Apr 10, 2019 at 11:14 am

      Thank you for letting us know about the video, we’ll certainly look into updating the video :)

      Reply
  16. Jackie says:
    Oct 24, 2018 at 2:02 pm

    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.

    Reply
  17. Irina says:
    Feb 23, 2018 at 3:07 pm

    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…

    Reply
  18. Ratan Kumar says:
    Sep 14, 2017 at 11:00 am

    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.

    Reply
  19. Ray says:
    Aug 18, 2017 at 9:46 am

    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!

    Reply
  20. Sara Lewis says:
    Jul 18, 2017 at 1:50 pm

    what about the plugin ewww image optimizer?

    Reply
    • WPBeginner Support says:
      Jul 18, 2017 at 8:02 pm

      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.

      Reply
  21. Donna says:
    Jul 11, 2017 at 7:10 pm

    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

    Reply
  22. Carrie says:
    Dec 6, 2016 at 9:40 am

    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?

    Reply
  23. Carrie says:
    Sep 7, 2016 at 8:56 am

    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!

    Reply
    • Tony Squibb says:
      Dec 30, 2016 at 2:55 am

      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 :)

      Reply
      • Carrie says:
        Jan 2, 2017 at 5:46 am

        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.

        Reply
  24. Jeff says:
    Feb 29, 2016 at 3:22 pm

    hi

    Best Image Optimization Plugins for WordPress Site Which is?

    Reply
  25. Gagan says:
    Nov 8, 2015 at 12:00 pm

    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

    Reply
  26. Zimbrul says:
    Aug 3, 2015 at 11:15 am

    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.

    Reply
    • WPBeginner Support says:
      Aug 3, 2015 at 7:06 pm

      Please take a look at Optimizing images with WP Smush pros, cons, and alternatives.

      Reply
  27. Jack says:
    May 17, 2015 at 6:13 pm

    Photoshop is definitely the best one, for online services, kraken.io and resizeimage.net are good alternatives to tinypng.

    Reply
  28. tanveer says:
    May 4, 2015 at 9:35 am

    is xnview a good option for compressing images?

    Reply
    • WPBeginner Support says:
      May 6, 2015 at 1:35 am

      We haven’t tried it.

      Reply
  29. Larry Aldrich says:
    Mar 20, 2015 at 10:36 am

    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.

    Reply
  30. Martin says:
    Jan 29, 2015 at 3:37 am

    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…

    Reply
  31. Greg says:
    Mar 16, 2014 at 1:24 pm

    I have got used to using Fireworks even though I have CS3

    Reply
    • Zimbrul says:
      Aug 3, 2015 at 11:12 am

      Me too. I use CSS4 and still go to Fireworks for image optimisation.

      Reply
  32. Marianne P. says:
    Mar 7, 2014 at 8:55 am

    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!

    Reply
  33. Corinna says:
    Mar 5, 2014 at 1:22 am

    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.

    Reply
    • Julie Anglesey says:
      Nov 24, 2014 at 8:50 am

      I would also like to know how to reduce the size of images already uploaded.

      Reply
    • Zimbrul says:
      Aug 3, 2015 at 11:13 am

      It’s (or was) Smush-It.

      Reply
  34. Samiullah Khan says:
    Feb 3, 2014 at 2:29 am

    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

    Reply
  35. Graham says:
    Feb 2, 2014 at 8:42 am

    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).

    Reply
  36. Rob Dewing says:
    Jan 29, 2014 at 8:37 pm

    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.

    Reply
  37. site says:
    Jan 29, 2014 at 6:31 pm

    So what can I do, having my images on amazon s3 ? I don’t know how to auto optimize….I have plenty there ATM and don’t know what tool to run through now and in the future…

    Reply
  38. Ines says:
    Jan 29, 2014 at 12:14 pm

    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.

    Reply
    • WPBeginner Support says:
      Jan 29, 2014 at 8:51 pm

      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.

      Reply
  39. Benjamin says:
    Jan 29, 2014 at 6:30 am

    You could add kraken.io to your list. It does the same thing as Jpegmini but also works with PNG images.

    Reply
  40. Aurel says:
    Jan 27, 2014 at 4:23 pm

    I am using RIOT, which is free, very fast and exelent program.

    Reply
  41. Debra Torres says:
    Jan 27, 2014 at 12:38 pm

    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?

    Reply
    • WPBeginner Support says:
      Jan 27, 2014 at 2:06 pm

      Smushit is a great tool too. But try other tools we mentioned and compare the results.

      Reply
      • James DiGioia says:
        Feb 25, 2014 at 11:07 am

        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.

        Reply
        • Youri van Dijk says:
          Mar 26, 2014 at 8:00 am

          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.

  42. John Mauldin says:
    Jan 27, 2014 at 10:16 am

    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!

    Reply
  43. Haseeb says:
    Jan 27, 2014 at 9:53 am

    Isn’t there any automated way of doing this on wordpress? How about ‘WP Smush.it’ ?

    Reply
    • Editorial Staff says:
      Jan 27, 2014 at 10:13 am

      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.

      Reply
  44. Marlene says:
    Jan 27, 2014 at 9:52 am

    Great article, however I was under the impression that any images with text on them should be saved as PNG files for best sharpness….?

    Reply
    • Editorial Staff says:
      Jan 27, 2014 at 10:05 am

      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 :)

      Reply
  45. Adam W. Warner says:
    Jan 27, 2014 at 9:46 am

    Great article, and an important subject many WordPress admins miss.

    [Link Removed]

    Reply
  46. Lynn says:
    Jan 27, 2014 at 9:35 am

    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?

    Reply
    • Editorial Staff says:
      Jan 27, 2014 at 10:07 am

      Not sure about lightroom and how it exports image. You can run a side-by-side test.

      Reply
    • Graham says:
      Feb 2, 2014 at 8:30 am

      Lightroom will do pretty much the same job as Photoshop when exporting photos to JPEGs.

      Reply
    • Bill Wells says:
      May 20, 2015 at 7:53 pm

      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.

      Reply
  47. Scott Wyden Kivowitz says:
    Jan 27, 2014 at 9:22 am

    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.

    Reply
    • Editorial Staff says:
      Jan 27, 2014 at 10:07 am

      You’re very welcome Scott.

      Reply
  48. Dave Kulas says:
    Jan 27, 2014 at 9:21 am

    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.

    Reply
    • Steven Alig says:
      Jan 29, 2014 at 7:38 pm

      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.

      Reply
      • Mark Pridham says:
        Feb 5, 2014 at 9:32 am

        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.

        Reply
      • Michael Maye says:
        May 4, 2015 at 12:12 pm

        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.

        Reply
  49. Zimbrul says:
    Jan 27, 2014 at 9:20 am

    I usually use Fireworks and then Tiny PNG if required.

    Reply
    • Editorial Staff says:
      Jan 27, 2014 at 10:08 am

      Yup that’s a good combination :)

      Reply
  50. Geoffrey Gordon says:
    Jan 27, 2014 at 8:51 am

    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.

    Reply
    • Editorial Staff says:
      Jan 27, 2014 at 8:58 am

      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.

      Reply
« 1 2

Leave a Reply Cancel reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

Over 1,320,000+ Readers

Get fresh content from WPBeginner

Featured WordPress Plugin
WP Mail SMTP logo
WP Mail SMTP
Fix WordPress email delivery issues. #1 SMTP plugin. Learn More »
How to Start a Blog How to Start a Blog
I need help with ...
Starting a
Blog
WordPress
Performance
WordPress
Security
WordPress
SEO
WordPress
Errors
Building an
Online Store
Useful WordPress Guides
    • 7 Best WordPress Backup Plugins Compared (Pros and Cons)
    • How to Fix the Error Establishing a Database Connection in WordPress
    • Why You Need a CDN for your WordPress Blog? [Infographic]
    • 30 Legit Ways to Make Money Online Blogging with WordPress
    • Self Hosted WordPress.org vs. Free WordPress.com [Infograph]
    • Free Recording: WordPress Workshop for Beginners
    • 24 Must Have WordPress Plugins for Business Websites
    • How to Properly Move Your Blog from WordPress.com to WordPress.org
    • 5 Best Contact Form Plugins for WordPress Compared
    • Which is the Best WordPress Popup Plugin? (Comparison)
    • Best WooCommerce Hosting in 2020 (Comparison)
    • How to Fix the Internal Server Error in WordPress
    • How to Install WordPress - Complete WordPress Installation Tutorial
    • Why You Should Start Building an Email List Right Away
    • How to Properly Move WordPress to a New Domain Without Losing SEO
    • How to Choose the Best WordPress Hosting for Your Website
    • How to Choose the Best Blogging Platform (Comparison)
    • WordPress Tutorials - 200+ Step by Step WordPress Tutorials
    • 5 Best WordPress Ecommerce Plugins Compared
    • 5 Best WordPress Membership Plugins (Compared)
    • 7 Best Email Marketing Services for Small Business (2020)
    • How to Choose the Best Domain Registrar (Compared)
    • The Truth About Shared WordPress Web Hosting
    • When Do You Really Need Managed WordPress Hosting?
    • 5 Best Drag and Drop WordPress Page Builders Compared
    • How to Switch from Blogger to WordPress without Losing Google Rankings
    • How to Properly Switch From Wix to WordPress (Step by Step)
    • How to Properly Move from Weebly to WordPress (Step by Step)
    • Do You Really Need a VPS? Best WordPress VPS Hosting Compared
    • How to Properly Move from Squarespace to WordPress
    • How to Register a Domain Name (+ tip to get it for FREE)
    • HostGator Review - An Honest Look at Speed & Uptime (2020)
    • SiteGround Reviews from 4196 Users & Our Experts (2020)
    • Bluehost Review from Real Users + Performance Stats (2020)
    • How Much Does It Really Cost to Build a WordPress Website?
    • How to Create an Email Newsletter the RIGHT WAY (Step by Step)
    • Free Business Name Generator (A.I Powered)
    • How to Create a Free Business Email Address in 5 Minutes (Step by Step)
    • How to Install Google Analytics in WordPress for Beginners
    • How to Move WordPress to a New Host or Server With No Downtime
    • Why is WordPress Free? What are the Costs? What is the Catch?
    • How to Make a Website in 2020 – Step by Step Guide
Deals & Coupons (view all)
Advanced Coupons
Advanced WooCommerce Coupons
Get 50% off the Advanced Coupons smart coupons plugin for WooCommerce.
WP Mail SMTP Coupon
Get $50 off WP Mail SMTP Pro so you can ensure all your WordPress emails reach the inbox.
Featured In
About WPBeginner®

WPBeginner is a free WordPress resource site for Beginners. WPBeginner was founded in July 2009 by Syed Balkhi. The main goal of this site is to provide quality tips, tricks, hacks, and other WordPress resources that allows WordPress beginners to improve their site(s).
Join our team: We are Hiring!

Site Links
  • About Us
  • Contact Us
  • FTC Disclosure
  • Privacy Policy
  • Terms of Service
  • Free Blog Setup
  • Free Business Tools
Our Sites
  • OptinMonster
  • MonsterInsights
  • WPForms
  • SeedProd
  • Nameboy
  • RafflePress
  • Smash Balloon

Copyright © 2009 - 2021 WPBeginner LLC. All Rights Reserved. WPBeginner® is a registered trademark.

Managed by Awesome Motive | WordPress hosting by SiteGround | WordPress CDN by MaxCDN | WordPress Security by Sucuri.