After reading Is CSS resizing of images still a bad idea?, I thought of a simila
ID: 650898 • Letter: A
Question
After reading Is CSS resizing of images still a bad idea?, I thought of a similar question. (too similar? should this be closed?)
Lets say you need to use 10 different product image sizes throughout your website and you have 20k-30k different product images, should you use 10 different files for each image size? or maybe 5 different files and use css to resize the other 5? Would there ever be combination that would be good? Or should you always make separate image files?
If you use css to resize them, you will save on storage (in GBs) but you will have slight increase in bandwidth and slower loading images(but if images are cached, and you show both sizes of the image would you use less bandwidth and have faster loads?)
(But of course you wouldn't want to use css to resize images for mobile sites.)
Explanation / Answer
I think it depends on context.
If some of your image sizes are relatively the same, why make the user redownload the image? That is, if an image is 400x400 px and 40kb, is it worth it to have the user download a second image that is. Only 390x390 and 39kb? I don't think that it is and would rather use CSS.
Now, asking a user to load up a full detail image when it's not necessary (product info page vs search thumbnails) would be wasteful too.
You may want to go to Cloud Four to learn more about the various ways of dealing with multiple image sizes. I don't think the overhead of storing multiple sizes should be a limiting factor (Wordpress does this and they gotta be doing something right!), but if it is there are possibilities of resizing on the fly.