Minimizing JPEG File Size 287JPEGMinimizing JPEG File SizeWeb Design in a Nutshell, eMatter EditionAll of these products provide the ability to save images in Progressive JPEG format
with a checkbox control. Special features for optimizing JPEGs for web delivery
are discussed in the following section, “Minimizing JPEG File Size.”
There are also plug-in utilities especially for JPEG creation, such as ProJPEG from
Boxtop Software (www.boxtopsoft.com/) and HVS JPEG 2.1 from Digital Frontiers
(www.digfrontiers.com/). These plug-ins work with all of the programs mentioned
here and are discussed further in the following section.
Regardless of the tool you use, the following guidelines apply:
- Make sure your file is in RGB or grayscale format. You can apply JPEG com-
pression to CMYK files in some applications, but these files are not compati-
ble with web browsers. - If you are working in Adobe Photoshop, whether with its native JPEG tools or
with plug-ins, all layers will need to be flattened before you can save it in
JPEG format. - Name your file with the suffix.jpgor.jpeg. This is necessary for the browser
to recognize it as a readable JPEG file type.
Minimizing JPEG File Size
As for all files intended for Web delivery, it is important to optimize JPEGs to
make them as small as possible. Because JPEGs are always 24-bit by nature,
reducing bit-depth is not an option. For the most part, all you have to play with is
the quality setting, however, it is possible to prepare an image prior to compres-
sion. There are a number of specialized tools available for making JPEGs as small
as they can be while letting you make decisions about image quality.
Aggressive Compression Ratios
If your image has a lot of continuous tone or gradient colors, you can be pretty
aggressive with the compression level and not worry too much about loss of
quality in the resulting JPEG. Even at some of the lowest quality settings, (0 or 1 in
Photoshop, 20–30 on the standard scale) the image quality is still suitable for
viewing on web pages.
Of course, this depends on the individual image. Photoshop’s low-quality setting
will result in a blocky or blotchy effect in areas of flat color, which may be unac-
ceptable to you. You may need to do some testing to find the compression level
that works best. Be sure to save a copy of the original image so you can do a
fresh JPEG compression with each test.
ImageReady, Fireworks, ProJPEG, and HVS JPEG provide previews of the effects
of your compression settings, both as an image preview and its corresponding file
size. This makes it easier to experiment with compression ratios before saving the
JPEG. With Photoshop and Paint Shop Pro, you need to save the file and open it
again in the program or a browser to see the effects of your compression
selection.