Save for web image larger than original

[Laura T.]

I'm trying to optimize and reduce an image for web. Here are the steps I am doing:

1. Right click on the image in my finder and hit get info, the original file size is 16KB.

2. Open the image in photoshop, the image size says 401.1K (I know that image size is different than file size, and file size in your finder is a compressed version of the image, while photoshop gives you an uncompressed version and image size is expected to be larger.)

3. Bring the image into save for web. Original image size says 401K. The exported/saved versions image size is 21.23K. Metadata selection is none. Optimized is also selected (screenshot below of sizes). 

5. Save image with above settings. 

4. Right click on the save for web version, file size is 22KB. Right click on original version, file size is 16KB. 

When I upload both versions to Wordpress, the original file is listed at 16KB and the save for web version is 22KB, so the file sizes I'm getting from my finder are consistent with the sizes in Wordpress.

How does the save for web version of the image have a larger file size than the original version? Again, I am aware that file size on your finder and image size in photoshop for one image won't be the same thing, but I still expect the save for web version of the image to have a smaller file size than the original version. What am I misunderstanding/doing wrong?

[TheDigitalDog]

You can't rely on the Finder and Photoshop reporting the 'size' the same so do not. The Finder is correct. Photoshop takes other items into consideration (like possible layers and such) into its calculations yet, you can't save a JPEG with layers as one example of why, the size reported by Photoshop and the size reported by the Finder don't always (often) match. 

[Laura T.]

Thanks for the reply. As stated in my original question, I understand that the Finder and Photoshop will not report the same size and why that is so. That is not my issue/question. 

My question is, when I export/save an image using save for web, the exported version has a larger file size than the original. To be clear, I am looking at both the original and the save for web version in the finder (screenshot below):

Isn't the point of save for web to optimize and reduce the file size? Why would the save for web version be a larger than the original?

[rudo123]

Your original.jpg image is already compressed (not losslessly). In Photoshop it opens with artifacts from initial compression. Save it again (export for web), it is saving and compressing all these new artifacts - your opened image is more complex then primordial image (before initial saving to original.jpg. New file is bigeer. (sorry, used google translate for this response).

[D Fosse]

That's exactly right. When you resave a jpeg, file size tends to increase a bit, and for precisely the reason explained above.

[Laura T.]

Thank you both for your responses. I was aware that when you resave an image just using save as, that the jpeg would be larger than the original for the reasons you described.

My confusion is that I thought save for web specifically always created a smaller file size than the original (isn't the point of the save for web to create smaller, optimized images?).

[davescm]

Save for web still uses jpeg compression so the facts on repeated saving still apply. The advantage in using save for Web is :

a. It allows you to preview the compression next to the original as you change the quality slider

b. It gives additional options to remove metadata from the image file (data stored alongside the image)

Dave

[Laura T.]

Got it — thank you all for clarifying! 

[Test Screen Name]

This seems entirely normal. The size a JPEG has comes from its original image size, and the level of compression you choose. There's no special magic in Save For Web to squeeze more out of a JPEG. So did you experiment with setting sizes? You can expect a different of 1000% in size for an ordinary image depending on your quality settings. You seem to be saving it as 100 quality, the highest quality and hence the largest possible file.

16K is very small already, it may have been carefully saved with particular settings. In case you didn't know, every time you resave a JPEG it damages it a bit more, so you may want to stick with that original.