: Why does saving low quality JPGs as high quality in Photoshop increase their file size? I have a low quality background image that is about 85kb. If I open the file in Photoshop and then

@Shelley591

As stated, that's how JPG compression works.

If you're trying to compress large areas of a JPG but not others, then you want to use selective compression...something I've only seen available in Adobe Fireworks software.

Vote Up Vote Down

@LarsenBagley460

Why low quality JPG saved as high quality in Photoshop increases the file size?


If you have a low quality JPEG which you open and re–save with 100% quality (or 0% compression) in any image editing software, the output will be bigger in size than the source. In order to understand this, it is good to take a crash course on JPEG.

JPEG compression isn't comparable to ZIP compression: ZIP works both ways—you can compress and later decompress to have the original file back.

JPEG compression, however, is a one-way job. Roughly speaking, during the encoding of the JPEG file, the image is split to 8×8 px blocks, from which a kind of spatial frequency spectrum is created by discrete cosine transform. After transform, the amplitudes of the frequency components are quantised.

The quality setting will (roughly) determine how much quantisation will be made. What gets lost in quantisation is long gone. Some further compression will be applied, but from this point forward it is usually lossless.

Now, when you open the encoded JPEG image in your favorite image processor, the JPEG gets decoded. If the JPEG isn't encoded with a lossless setting, you don't have all the same details as the original JPEG had: remember—some bits of data has been lost i.a. during the quantisation. As JPEG is encoded block–by–block the compression appears in the decoded image as jaggedness and JPEG–artefacts. Also some colour & brightness information has been lost.

When you save this decoded JPEG file again, the image processor's JPEG encoder does not take into account whether the file has been compressed before or not—it just encodes it as it would encode a lossless file, i.e. every pixel should look as every pixel looks like. When using 100% quality / 0% compression setting, the encoder will try as hard as it can to preserve all the details—and that includes all the jaggedness, artefacts, color & brightness data as they are.

The file size increases because the actual compression is not the jaggedness or the artefacts. The compression is the rounding and quantisation of the "instruction set" from which the JPEG is decoded and rendered to your screen.

In other words, you don't decrease file size with great effect just by making the image look more jaggy or by adding artefacts. This means that if you save a jagged JPEG with the best quality, its size will not greatly differ from a non-jagged JPEG saved with the best quality.

Again: the JPEG encoder assumes its input is lossless and when you open a compressed JPEG the rendered image (what you see on your screen with all the jaggedness & al.) will be the "lossless input" for the encoder.


The problem is, I have this background and want to add a logo image over it, and then save it. But If I do so, I have to save this with 10% quality, and the logo looks horrible. If I save this to 100% quality, the file size is huge.


There is a lot of options between 10% and 100%! In the dialog that allows you to set the JPEG compression, you can choose it to preview the output. This, for one, allows you to visually inspect which would be a good setting.

Other good option, as many of users have already suggested, is to use Save for Web & Devices… dialog, which allows you to preview not only different JPEG compressions, but also how your output would look if you convert the image to PNG-8, PNG-24 or to a GIF image.

A PNG-24 image is lossless and in many cases beats JPEG when the source image is not photography–like: shapes and solid/predictable areas of colour are areas in which PNG will excel. As you have a logo on a background, it might be a good option. Of course the artefacts from the low-quality JPEG-background will be included in the output.

The best option I would suggest (as the question is migrated form webmasters.se) is that you leave the background as it is and save the logo as transparent PNG-24. Then you position the logo on top of the background with CSS. You retain the quality of the logo and will not cripple the JPEG background more.

Vote Up Vote Down

@Jennifer810

I ever face this problem. So for the solution.
I open the file in photoshop > Do whatever change i want > go for Save for web with 100% quality > see its preview in web browser instead of saving it directly > Now i save it from the browser > Then i finally compress the image file with some separate tool.

Vote Up Vote Down

@Carla748

Have you tried flattening the image then going to save > save for web? 'Save for web' gives you more control over the output size plus lets you see the quality change with each setting.

There are online services such as www.smushit.com/ysmush.it/ , which might help squeeze some kb's out of your images.

Vote Up Vote Down

@Caterina889

Convert the image into a smart object first and then expand the image. This will help in preserve quality. When you have added the logo over that image, press ctrl+alt+shift+S. This will help you save for web devices. Choose the quality(after checking the output quality on the right and the file size at the bottom). You should have a fairly compressed jpeg.

Also, when photoshop opens a JPEG compressed image, it decompresses it. And when you save it at it highest quality, it saves it without compression. Hence the difference in file sizes.

Vote Up Vote Down