Compression of full size images

Hello @cag8f,

That is correct, only Pro version of Smush will compress original image sizes. In the Free version, all the created sizes by WordPress will be compressed.

Let me know if you have more questions

kind regards,
Kasia

Thanks for the reply. All of the images I upload to my site are already at the size in which they are displayed on the screen. In this case, the free version of Smush will not do anything for me–is that correct? I just want to confirm that before searching for another solution.

Thanks.

Hey @cag8f,

I’ve just taken a look at how you are outputting your images on your website and it appears you are using the full size (original upload) on the frontend. Therefore, Smush won’t touch these images. Even though this is a limitation of the free version, there’s an easy work around…

If you instead get WordPress to create a thumbnail at this size (728 x 728 px) and use this size on the frontend, smush will include and optimize the images.

This little article covers how to do this quite well: https://soliloquywp.com/beginners-guide-to-add-custom-image-sizes-in-wordpress/.

In general we don’t recommend compressing your original images unless you have a unique use case that requires it. By not touching your original full size images, you always keep a non-optimized version available incase something goes wrong. Hope this helps you!

Cheers,
Andy

>> If you instead get WordPress to create a thumbnail at this size (728 x 728 px) and use this size on the frontend, smush will include and optimize the images.

OK got it–thanks for that.

>> In general we don’t recommend compressing your original images unless you have a unique use case that requires it. By not touching your original full size images, you always keep a non-optimized version available incase something goes wrong. Hope this helps you!

Well in my case, I already have the original full size image saved elsewhere. My guess this is the case for most WordPress users. It would be nice to have the option to optimize the original size images. But, I guess that’s why you have the premium version ??

We can consider this resolved.

>>It would be nice to have the option to optimize the original size images. But, I guess that’s why you have the premium version

Precisely. We give pretty much everything most people need in the free version, and the pro version offers power user features. The thumbnail approach is generally a good idea as it ensures you’re always serving images at the right size (which Google recommends). You have a bit of a unique case, but it sounds like you managed to get around it.

Cool tattoos too!

Cheers,
Andy

@andywpmudev Thanks for that. I’ll have a look into the pro version.

>> The thumbnail approach is generally a good idea as it ensures you’re always serving images at the right size (which Google recommends). You have a bit of a unique case, but it sounds like you managed to get around it.

Well since you brought it up, can you clarify what you mean by “the thumbnail approach?” Are you referring to the default WordPress system, of uploading one larger image, allowing WordPress to create several smaller thumbnail versions, and allowing the page to choose which thumbnail size to serve?

@cag8f yup, exactly that :).

In a general sense, here’s the problem with using ‘full’ size images in your theme frontend.

Ouputting fullsize: One of your staff log in and they accidentally upload a 4000x4000px image as their profile image. Because your theme is set to display the ‘full’ size image, it will output a 4000x4000px image to a 728px container. That means visitors to your site will end up loading up this huge image for no reason.

Creating and serving a specific thumbnail size: Even if your staff upload a 4000x4000px image, it doesn’t matter. WordPress will create the 728px size it needs and serve that on the frontend. Visitors only ever load up the size of image needed for the size it’s displayed at.

Hope this helps ??

OK thanks for that. Here’s my take. I’m using my current system because I actually think the WordPress thumbnail system does *not* ensure I’m always serving images at the right size. Here is why I say that.

First of all, this WordPress site has no other users–I’m the only one making any edits. I agree with you that the thumbnail system is very helpful if you have non-technical staff that might upload very large images. But in this case, that’s not a worry.

Let’s say my site has the following three thumbnails defined:

100 x 100 (defined by WordPress; inserted into footer)
300 x 200 (defined by a plugin; inserted into sidebar)
750 x 500 (defined by my theme; inserted into header)

Now let’s say I upload a 1000 x 1000 image and add this image to all three areas (header, sidebar, and footer).

The footer image will be displayed with no cropping, since its 100 x 100 dimensions are exactly proportional to the original 1000 x 1000 image.

But the sidebar and header images will be cropped–correct? How will they be cropped? From the center? From the top? Do we know? As I understand, we don’t always know–it varies by theme/plugin. So if I use the thumbnail system, I have no control over how these images are cropped (unless I add custom PHP code). In certain cases, I need this control–if the image is to be cropped, I need to decide how it is cropped, and many times that varies by image. My solution to this is to always crop to the display size before uploading, then upload that cropped image to WordPress, and insert that full size image into the element.

Also, in the above example, let’s say I add the image to a page, and specify that image to be 400 x 400 in size. Well the thumbnail system is going to ensure the page downloads the 750 x 500 image, then scale it down, which is sub-optimal. My system ensures the page downloads only the 400 x 400 image.

What are your thoughts on that? I’m open to critiques.

>Let’s say my site has the following three thumbnails defined:

Those are the default image sizes you can customise with a standard WordPress install. Mostly, you should keep those free for just your pages/post content – not the bits outside of this (like your footer, profile photos etc).

For those more specific image sizes I would create separate specific image sizes for those use cases. That way, you can have standard 100, 300 and 750px image sizes to use on your page content, but maybe a 125px footer image, a 40x40px logo in the heading and a 728px size for the profile images. Yes, WordPress will then generate and store all of those image sizes when you upload an image, but it means then you are serving the right size for the user on the front end.

It’s a bit of a wormhole topic, ha! In the end, there’s no real right and wrong way – this is just the way WP intends developers to use the thumbnail system.

Cheers!
Andy

Sorry, missed the bit about cropping. When you set up custom thumbnail/image sizes in WP, you can tell it how to crop the photo. In general though, because you know exactly where you’re doing to use the image, you’ll know the size of it. Create your images to match the ratio/size and you’ll be fine.

Side note: If you have a 728px square image and you upload an image double that size, WP will automatically output the required code to support retina screens which will give crisper images to higher resolution screens. Nice little feature ??

>> When you set up custom thumbnail/image sizes in WP, you can tell it how to crop the photo. In general though, because you know exactly where you’re doing to use the image, you’ll know the size of it. Create your images to match the ratio/size and you’ll be fine.

Right. But what about themes/plugins that add their own custom thumnbnail images, with different sizes? They may have their own cropping rules that I can’t control (unless I add custom PHP code). Furthermore, there might be a global cropping rule in-place that crops all images from the center. But I might not want to crop *all* images from the center–some might require cropping from the top, some might require cropping from the bottom, and some might require some custom cropping. That’s the specific problem I’ve encountered many times.

>> because you know exactly where you’re doing to use the image, you’ll know the size of it. Create your images to match the ratio/size and you’ll be fine.

That’s exactly my system–I determine the size of the image on the screen, then upload an image of that size. It’s a tad unfortunate that your free plugin doesn’t optimize these images. I’ll have a look at the premium version though.

>> this is just the way WP intends developers to use the thumbnail system.

Right O. It does indeed provide a set-it-and-forget-it type of solution in most cases, which makes it very easy, especially for non-technical users. It’s not perfect though, as it can sometimes lead to undesirable cropping. Furthermore, I don’t think the system can be perfected. I think it’s the best possible system, and the undesirable cropping is unavoidable.