Progressive JPEGs 285
JPEG
Progressive JPEGs
Web Design in a Nutshell, eMatter Edition
The scales for specifying Q-settings (or “Quality”) vary among tools that create
JPEGs. For example, Photoshop uses a scale from 0 to 10 (an improvement over
3.0’s options of “low, medium, or high”), but it should be noted that its highest
level of compression (0) corresponds to a Q-factor of approximately 30 on the
standard scale.
Image Loss
Be aware that once image quality is lost in JPEG compression, you can never get it
back again. Loss in image quality is also additive, meaning you lose a little bit
more information each time you decompress and compress an image, so each time
you edit a JPEG and resave it—even if it’s just to crop the image—you degrade the
image further. Not only that, you may introduce new artifacts to the image that
prevent the second compression from working as efficiently as the first, resulting
in higher file sizes.
It is a good idea to hang on to one copy of the original digital image if you antici-
pate having to make changes, so your final image only goes through the
compression process once. You should also start from an original image each time
to experiment with different compression levels.
When to Use JPEGs
As mentioned earlier, JPEGs, with their 24-bit color capacity and specialized
compression scheme are ideal for photographic and other continuous-tone images,
such as paintings, watercolor illustrations, and grayscale images with the 256
shades of gray.
JPEGs are notablynotgood at compressing graphical images with areas of solid
color, such as logos, line art, type, and cartoon-like illustrations. JPEG’s lossy
compression makes flat colors blotchy and pixilated, resulting in unacceptable loss
of quality in some cases. Not only that, the files will generally be quite a bit larger
than a GIF file of the same image. JPEG compression is also not good at sharp
edges or typography since it tends to leave artifacts that “ripple” the edges.
It is generally best to let JPEGs handle photographic material and to leave the
graphics to GIF.
Progressive JPEGs
Progressive JPEGs are just like ordinary JPEGs except they display in a series of
passes (like interlacing in the GIF format), each pass containing more detailed
information until the whole image is rendered clearly. Graphics programs allow
you to specify the number of passes it takes to fill in the final image (3, 4, or 5
scans). Bear in mind that over a fast Internet connection, the image may load and
render so quickly the user may not see any passes at all.
Advantages
One advantage to using Pro-JPEGs is that like using interlaced GIFs, they provide
some indication of the full image for the reader to look at without having to wait