PAGE 1 – What happens when you upload an image to your WordPress website
PAGE 2 – What the default WordPress Media Library Settings mean to low performance
PAGE 3 – How to change the WordPress Media Library Settings for faster performance
PAGE 4 – Results of change and how the EWWW Image Optimizer recognizes it
When you upload a picture into the WordPress Media Library on your website, by default WordPress will save up to 4 different sizes of the same image. This means that though you uploaded only 1 image, WordPress is saving 4 images all at different sizes.
WHY IMAGE OPTIMIZATION IS IMPORTANT
When doing the Google PageSpeed Insights the one common culprit to slower website speed are the images saved and used on your website. If you are using a plugin like the EWWW Image Optimizer you will notice that after you optimize an image it will say how many sizes were compressed, see image below.
These sizes indicate how many images WordPress has saved in your Media Library. So when you optimize an image you are actually optimizing all 4 images. What are these 4 images and why are they created by default in WordPress?
In the top image above it said that 4 sizes compressed, reduced by 6.2%, for a total size of 9.4 KB saved. But what does that really mean? In the above image you can see the 4 image sizes that were compressed, and when you add their final savings, 5.6 KB + 2.6 KB + 731 B + 402 B, you get 9.4 KB.
Now fortunately before I upload images to my Media Library, I always reduce the size in Microsoft Paint. For this particular image it was already down to a memory size of 74.4 KB before EWWW optimized it by 7%. But there are 3 other image sizes WordPress has saved that were also optimized.
Nowhere on my website do I use these other sized images, so these 3 duplicate images of different sizes are taking up space in my Media Library and contributing to a less efficient overall website performance. How can this be easily resolved, especially if I have no intentions of using the other sizes of the image I uploaded? Read on.
NEXT UP = Why the default WordPress Media Library Settings contribute to slower website performance
Can you tell me something. I also size my images to 800x500 for feature images before uploading. However, I use Divi theme and the featured images on a blog roll are large by default. I have some code to make these images reduced by 40% on my home page blog roll.
So, I suppose they become thumbnails. I set my 'Media' sizes to 0,0,0 as you suggested. But I want these thumbnails created at the 40% size, which is approximately 320x200. So, do I set this size in the 'Media' setings or 'EWWW Image Optimizer' settings?
I also have all these sizes in my EWWW 'Resize Setting' tab.
et-pb-post-main-image - 400x250
et-pb-post-main-image-fullwidth - 1080x675
et-pb-portfolio-image - 400x284
et-pb-portfolio-module-image - 510x382
et-pb-portfolio-image-single - 1080x9999
et-pb-gallery-module-image-portrait - 400x516
et-pb-post-main-image-fullwidth-large - 2880x1800
I assume I should also tick 'Disable Creation' checkbox for all these.
Any advice would be grateful.
Also do the images added in the new Content feature take care of size automatically or do they need to be fixed too.
Thank you for this training, Robert. Wish I would have known this before I had so many images. :)
Anyway, I'd like to add a well-known and recommended plugin to my current site as a test to see how it works in removing 2/3 (not actually of course) of my Library. I really don't care what happens to this site version as it will be replaced in a week or so.