When saving a image for web and devices as JPEG, I can either choose “progressive” or “optimized” or “none.” What is the difference between both and what should I use? In my case, the image is the background image or a website which has a file size of about 20KB.
On mouse-over, it says:
Progressive: Download in multiple passes
Optimized: Creates smaller but less compatible files
3 Answers
Progressive JPEG encoding organizes data in such a way that the image can be decoded at low quality first, and then details are added as the complete file becomes available. Therefore, while downloading the image, you can already see a "Preview" of the image.
Optimized JPEG means that tables used for Huffman lossless coding are adaptively calculated for the file. This has no impact at all on the file quality (the Huffman coding stage is lossless, it does not affect pixels) but may reduce file size by some percent.
For practical usage, progressive JPEG could be used to optimize file size:
...progressive JPEGs are smaller on average. But that's only the average, it's not a hard rule. In fact in more than 15% of the cases (1611 out of the 10360 images) the progressive JPEG versions were bigger.
The take-home messages after looking at the graphs above:
- when your JPEG image is under 10K, it's better to be saved as baseline JPEG (estimated 75% chance it will be smaller)
- for files over 10K the progressive JPEG will give you a better compression (in 94% of the cases) So if your aim is to squeeze every byte (and consitency is not an issue), the best thing to do is to try both baseline and progressive and pick the smaller one.
The other option is have all images smaller than 10K as baseline and the rest as progressive. Or simply use baseline for thumbs, progressive for everything else.
Here’s one answer:
1progressive JPEG - Computer Definition
A JPEG image that comes into focus while it is being displayed. Instead of rendering the image a line at a time from top to bottom, the whole image is displayed as very low-quality and fuzzy, which becomes sharper as the lines fill in. It gives the illusion that the page has downloaded faster even though it takes the same time to achieve the final sharpness. The progressive JPEG is created in multiple passes (scans) of the image. See interlaced GIF and JPEG.