How To Optimize an Image for WordPress

How to Optimize an Image for WordPress

There is a right way of how to optimize an image for WordPress websites, so that all of your images load superfast.


This practice will even further enhance your loading speeds from my previous training. (To view training, click on the link at the end of this post)

First I’d like to share with you a simple habit I always use that either too many people aren’t aware of, overlook, or simply take for granted.


It will make a big difference in your image optimization which will transfer to much faster loading speeds for your websites.

how to optimize an image for WordPress makes a night and day difference in page speeds

I always pre-compress all of my images before I upload them to my Media Library in my WordPress Dashboard.

Ever since I’ve been doing this, the difference in my page speeds has been night and day.

There are affiliate links within this post. What this means is that if you decide to purchase anything through one of my links, I'll be rewarded with a small commission at absolutely no extra cost to you. This small commission helps me run and maintain my website.

An Image Opt program isn't enough

When An Image Opt Program Isn't Enough

You may say “Well, I have the EWWW Image Optimizer activated, that takes care of it.”

The answer is the EWWW Image Optimizer or any similar plugin that offers “lossy compression” is not the answer.

Believe me, I used to think this was true as well. But having used the EWWW Image Optimizer or an equivalent lossy compression plugin by simply having it activated and letting it do its job was never enough.

I have learned this through hard experience. My go-to platform Thrive Themes has a feature called Lossy Compression (inside Thrive Options) that when turned and left on, is supposed to automatically pre-compress all the images you upload through Thrive onto your Media Library.

However, I have learned the hard way that simply running it through this Thrive plugin (or any plugin) is far from ideal. These pre-compressed images through a plugin will still slow down your site. It is simply not enough.

The only solution will be to manually pre-optimize all of your images.

how to optimize an image for WordPress

Ever since I’ve been manually pre-compressing my images, my pages have been loading superfast. In addition to taking this extra pre-compression step, you can do additional editing within the Media Library.

I cover everything else on optimizing your site speed in my evergreen training. Simply click the link near the bottom of this post.

how to optimize an image for WordPress using free compression programs

How to Optimize an Image for WordPress: Find Free Compression Programs

My personal favorite compression program (and the one that I currently use regularly) is Optimizilla and it FREE. However, there are several other image optimization programs out there that are FREE.

The free versions of, TinyPng, and Squoosh all work very well. At one time or another, I have used all of them., Squoosh, and TinyPng will pre-compress your images and do a great job before you upload them into your Media Library. In addition to these three, there are a few other great free programs that you can find if you simply Google them.

Optimize before uploading to Media Library

All of these image optimization programs also have paid for premium versions, but you won’t need any of them. Therefore I would only recommend that you use the Free versions for all of them.

You should find that FREE version will be more than enough to get the job done!

how to optimize an image for WordPress, here is what I do

How to Optimize an Image for WordPress: Here's What I Do

Ideally, in terms of dimensions I want my final image to be the exact size as it will appear on your web page or post. Or at the very least, I will want it to be close in size to the actual size it will be on your web page.

Next I make sure ALL of my images are pre-compressed, I always aim to have every one of my images pre-compressed to less than 100kb after uploading them.

Most of the time I will get the majority of them to less than 50kb. This is ideal and in the end what you want to achieve.

Use PNG Files for Super Sharp Images or Transparent Backgrounds Only

PNG files are great if you need a super sharp image or one with a transparent background. However, most of the time you won’t need them, as PNG files are much larger files. By adding several PNG files to your blog post or web page, you will find that the aggregate size of the images will cause a highly detrimental effect.

Loading many PNG images in any blog post or page will significantly slow down loading times on your site.

That’s why I first convert all of my images to.jpeg if they are .png’s almost all of the time (unless I need a super sharp image or one with a transparent background). The way that I accomplish this is by using Canva.

Avoid GIFs

If I can best avoid it, I will try not to use too many GIF’s. GIF’s are files that take up a lot of memory. I only will use GIF’s sparingly within my posts and pages for special effects.

Note that it is perfectly acceptable to embed the custom HTML code for displaying videos on any post or page. The videos live elsewhere on other platforms such as You Tube and Vimeo and will not take up any memory.

Fitting the Pieces Together

How to Optimize an Image for WordPress: Fitting All the Pieces Together

Let’s now fit all the pieces together in order to summarize the process of how to optimize an image for WordPress.

Here is my 10 Step Pre-Compression Blueprint:

  • First convert all PNG images to JPEG images using Canva (or any equivalent graphic design tool)
  • Use PNG images sparingly, and only if you need a super sharp image or one with a transparent background
  • While still in Canva (or your equivalent graphic design tool), resize your images to the actual size in dimensions as it will appear on your web page or post
  • Transfer these resized JPEG images from Canva to a place on your desktop
  • Manually pre-compress each image by transferring them into any FREE image compression program (such as, TinyPNG, or Squoosh) prior to uploading them in your Media Library in WordPress
  • Transfer these optimized JPEG images from your FREE image compression program back to a place on your desktop
  • Activate any “lossy compression” plugin you have for your website in your WordPress dashboard. This will provide an additional layer of optimization
  • Load these optimized JPEG images to your Media Library in WordPress
  • Edit your final images within your Media Library using “Scale” or “Crop” options to make them all less than 100 KB
  • Add those final beautiful pre-compressed images to your website
My 10 Step Pre-Compression Blueprint

Once these 10 Steps to my Pre-compression Blueprint are completed, you can then add those images to your website. And you can add them with the knowledge and comfort that you will have completely optimized images.

As I mentioned, pre-compressing all of your images first before uploading to your Media Library is only one important component to get your page speeds loading superfast.

By adding this 10 step pre-compression blueprint, in addition to following all of the steps in my full comprehensive evergreen training, in short order your Site Speeds will be BLAZING!

How to Make My Site Load Faster

I hope this short post on this important technique of how to optimize an image for WordPress will help you to drastically increase your page speed load times both in desktop and mobile.

Knowing how to optimize an image for WordPress increases the user experience

And decreasing page speed load times you will greatly increase the quality of the user experience.

Once you see its effects, you will never want to look back!

If you enjoyed this post on image optimization for WordPress, please feel free to make any comments below.

About the Author

KAJU is the band leader and founding member of OFF THE HOOK, one of the premiere dance party bands in the New York Tri-State Area. After contracting a mysterious hand disorder, Kaju now writes to help other musicians and artists deal with disabilities. Currently he is a Full-time Affiliate Marketer and 1-on-1 mentor at Wealthy Affiliate, a community that can help anyone start an online business without prior experience. This is where he teaches others how to make a great passive income. Read more about his story here!

  • Fran Kelso says:

    When you say “preoptimize,” if you put all your pictures in your media library before you put them in your post, won’t my Kraken plugin do all the optimizing they need?

    I just disabled my Smush plugin, since I have Kraken. When I select a pic from the media library, it says it is already optimized. Both plugins say the same thing. I don’t know how to optimize it before putting it in the media library unless I use tinypng, and that is too slow.

    Could you clarify, please?

    • Kaju says:

      Thanks for your comment Fran. Like any plugin, your Kraken optimizer isn’t doing enough optimization. The best thing to do is to manually optimize each image 1-by-1 first, and then load them into the Media Library. Make sure all of your images are <100kb.

  • >