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)



Join the Discussion
Write something…
Recent messages
Gopika1 Premium
I've been trying to delete themes and I cannot find the way, any help?
Reply
JHaugland Premium
Appearance > Themes
Then hover over a theme that is not in use and click Theme details.
In the window that opens, click Delete in the bottom right corner.
Reply
JerryHuang Premium
Go to your themes > Click on the theme you want to delete and there's a "delete" button at the bottom right corner :)
Reply
JerryHuang Premium
Haha, thank you Haugland! We posted the answer together.
Reply
JHaugland Premium
Hehe :)
Reply
Gopika1 Premium
hahaha :)
Reply
Gopika1 Premium
hehehe
Reply
drjec Premium
Thanks. This is a very practical, clear training.
Reply
JerryHuang Premium
My pleasure :)
Reply
BenjisDad Premium
Good stuff Jerry.

Really appreciate you taking time to write this out!

On Lesson 2, Do you know if that affects SEO at all?

Also, do you know of a bulk way to turn it off on all pages and posts?
Reply
JerryHuang Premium
Hi Chris!
Do you mean if deleting the unused stuffs affects SEO?

For those published posts & pages, if your original setting is to have trackbacks and pingbacks turned on, you have to edit it one by one.

You can only change the setting for all your future contents in the WordPress Discussion setting page.
Reply
BenjisDad Premium
Does turning off the trackbacks and pingbacks affect SEO. IDK why it would, but I guess i need to do more research as to what it is! lol.

Thanks for the info, I will use this stuff to speed up the site.

Do you think Thrive makes the site run slowly at all? I dont think so, just curious your thoughts.
Reply
JerryHuang Premium
Hi Chris, here is a good post you can refer to to learn more about trackbacks and pingbacks.
https://www.elegantthemes.com/blog/resources/wordpress-trackbacks-and-pingbacks

Basically, they have both pros and cons. But many believe that they are dead today. Check it out yourself :) I'm also learning at the same time!

As for Thrive Themes and its plugins, I know they have huge file sizes. However, they work great on my end. Maybe because their products are well-coded.

There are some people having issue with Thrive products but I don't know much about that because it doesn't happen on my end. If you have any issue, you should approach SiteSupport and Thrive Support!
Reply
SeanGreentre Premium
Great article. Thanks Jerry.
Reply
JerryHuang Premium
My pleasure!
Reply
MKearns Premium
Good points on the speed issue Jerry. Before you load for speed don't forget image attribution also!
Reply
JerryHuang Premium
Thanks Michael, good input! Image attributes are important for SEO!
Reply
Top