Question image sizes uploads

Hi,
So are you seeing duplicate images in your media? I don’t believe this is something the theme does. Are you using a plugin to optimize your images? This would just make it so a large file is not loading on a page if only a thumbnail is needed to show. I do not recommend setting this to 0.

Hannah

Hi,
no, the theme seems to be creating 6 different image sizes for each uploaded image, for example a 100×100 thumbnail etc.
But I don’t need these, as I also don’t need all the three sizes WP is generating – if I need an image to be displayed at 400px x 300px on desktop, I upload it at 400 x 300…why would I need any additional sizes?

This is due to the responsiveness of the theme. The reason for multiple image sizes is due to the fact that there are many different display types that will view your site.

For example, I’m using a Macbook with a retina screen. This is a high pixel density display. So a 400×300 image would need to be loaded at 800×600 on this screen.

Same goes for the smaller images. On a low definition screen, you would want to use smaller images to avoid distortion.

Does that make sense?

-Kevin

But I am confused…when I use an image of let’s say 1000 x 1000px and then use my cell and go to “view media info” it says the image is size is 300x 300 (downsized from 1000x 1000). So it’s still the same 1000 x 1000 px size that is used for smaller screens, it’s just resized by the browser…

Hey,

I believe it is woocommerce, I know it’s not the theme that creates a 100×100 thumbnail on upload.

On upload, the theme only creates three images:

600×600
540×620
720×480

These can be used throughout the site for the different ways images are shown in a blog list.

You can unhook this by using: https://codex.www.ads-software.com/Function_Reference/remove_image_size in a child theme.

Here are the three names:

‘ascend-600×600’
‘ascend-540×620’
‘ascend-720×480’

But based on your site settings more thumbnails can be created on a page load (not on upload but when that size is needed).

The theme will also do whatever it can to have retina versions of each site so that your images are clear on HD screens. For example, lets say you upload an image that is not square like 800×1200 and your output is a square 400×400 image. It would create that size and the 800×800 version so that there is a retina version in the srcset attribute. Browsers then read the srcset and pull the size that matches the pixel density of the screen being used.

This happens on the fly if an image size is needed that has not yet been created.

In your theme options > shop settings, you can turn off the theme ratio size for your woocommerce images. If you do that then the theme will not create any new sizes for your product images. (woocommerce still would).

It’s usually very desirable that you have multiple versions of images so they can be served at the dimensions needed and not at whatever size they are uploaded at.

If you have a specific place you don’t want the theme to create an image please post a link I may be able to offer some suggestions for a child theme modification.

Okay, I saw that for each uploaded image Woo creates 3 additional sizes and then the theme another 3.

But I still don’t completely understand that I would need these. In my case, I do NOT have a blog or portfolio, no galleries, and I upload all my pictures in exactly the size they are going to be displayed on the desktop, for example I want it to be 600 x 400 on the screen so I upload it in this size. Then I would not need any other sizes, correct? Since even on cells and tablets this size is getting used and resized by the browser.

Hey,
That is close but you would still be missing support for retina desktop screens. For example, almost every new computer (especially mac) has a screen with a pixel density twice that of a normal screen. An image showing at 600×400 on a normal screen would appear blurry or at least not as sharp on an HD screen because it’s stretching the 600 pixels across 1200 pixels. So it’s best that you upload larger images and let the theme or plugin or wordpress output a resized versions that also includes a version twice as large in the srcset so for retina/HD screens the correct quality image is used.

I hope that helps,

Ben

Okay, that helps. But one last thing – If I always upload images in the right ratio(meaning I always upload a 1:1 image if I want it to be displayed square for example), I would not need the 3:4 or 3:2 versions for this particular image, am I right? Since my picture is square from the beginning and I am displaying it square on the site?

Hey,
Yes you wouldn’t need those image sizes unless you changed the settings in the theme to use them. Either way, they would be available if needed. If you are worried about space or something then you can unhook the creation of these sizes using a child theme.

Ben