Step 2: Resize All Your Uploaded Images

The "actual size" (pixels) of the image will affect the "file size" (Kilobyte) of the image.

For example, when you upload a 1000pixel by 1000pixel image but the size you use on your site is just 300px by 300px, the image will take a long time to load while you open up the page. This is because the image has a huge file size (probably a few hundred kilobyte) which requires a much longer loading time.

So, the trick here is to upload your images at the exact size you want them to show up on your page (or just a little bit larger).

Below are 2 strategies you can use to resize your uploaded images:

(1) Edit & Scale Your Images Directly Inside WordPress

Go to your Media Library in your WP Dashboard > Choose the image you want to edit > Click "Edit Image" > Go to "Scale Image".

Scale the image to the size you want it to show up on your site. You can also crop your image if you want.

I know you may be unsure about what size to scale. This takes some practice and experience to know roughly the size of image needed.

Alternatively, here is a useful tool for you to simulate the image size for you:

https://red-route.org/code/ima...

(This first method is simpler because you can do it directly inside WordPress. However, I will recommend you to use the second method below if you want to achieve the best results to speed up your site.)

(2) Resize Your Images Using Third-Party Tool and Re-upload them

The benefit of resizing images using a third-party tool and re-upload them is that you can also compress the image file size manually to achieve the best result. (I'll show you how to do this later.)

The Third-Party Tool I'm personally using and recommend is called ImageResize.org.

Below are the steps to take:

1. Upload your image from your computer or from an URL
   
2. Adjust/Crop the image if needed
3. Resize your image (You can choose how much percent smaller)
4. Choose the quality & format of your image

2 Things to Take Note:

• You can use the online tool I stated above to simulate the size of image you want
  
• For the format of your image, it's best to choose JPG because JPG has a much smaller file size. (if you need the image to be super clear, then choose PNG)

(JPG format is a lossy compressed file format while PNG format is a lossless compression file format.)

After you have done this resizing step, your image file size will be much smaller which is a good thing for a fast website.

Common Question: How big should I resize my images to?

The answer is it totally depends on how big you want your image to show up. For example, the typical featured image width for a full-width page is around 1080pixels.

This takes some practice to know exactly how big your different images should be. Use the image size simulation tool above for guidance.

But ultimately, the recommended file size of any image on your website should be less than 100KB!

Next Page: Compress/Optimize Resized Images (Step 3)