Introducing JPEG in Photoshop

The JPEG format was developed somewhat later than GIF in response to the need for a file format that provides smaller images without sacrificing all the colors found in true photographic images. The JPEG format reduces file sizes by using a somewhat different scheme than GIF, a type of lossy compression that discards some image information as the image is squeezed down. Each image is divided into 8-x-8-pixel blocks, the pixels in those blocks are analyzed, and the pixels that are similar in color are combined. The color information for the pixels that are merged is discarded, producing an image that has less detail than the original, but is still a good representation of all the colors it contained. As a result of this process, JPEG images have that distinctive blocky look when you zoom in on them in Photoshop.

Choosing between GIF and JPEG file formats
Knowing the differences between GIFs and JPEGs helps you make your images more suitable for one format or the other. Here are some tips for getting the most from these file formats:
- Make a better GIF. Modify your image so that it contains larger areas of a single color; reduce unneeded colors manually (you know what they are better than the Save for Web tool knows); convert anti-aliased lines to solid lines where possible.
- Make a better JPEG. Decrease the color saturation of your image. Lower the contrast. Blur unimportant areas if feasible. The JPEG algorithms do a better job on low-saturation, low-contrast, blurry images than on vividcolor, high-contrast, or sharp images.

You can choose the amount of compression the JPEG uses and, therefore, the tradeoff between file size and sharpness. Photoshop uses a sliding scale from 0 (small file size/maximum compression) to 12 (larger file size/minimum compression). The Save for Web command helps you decide how to make the tradeoff for individual images. You can also save JPEG files by choosing File-->Save. If you save from the File menu, you can choose from these options:
- Matte: Use this option to choose a color to represent any transparency in the image.
- Image Options: Specify the amount of compression/quality level by using the slider (from 0 to 12), or by typing a value into the Quality text box, or by choosing a quality level from the menu.
- Format Options: Select Baseline (“Standard”), a format compatible with virtually all graphics-capable Web browsers; Baseline Optimized to create a file with optimized color and a more compact file size; or Progressive to show a series of scans that increase in resolution as the download proceeds (similar to GIF’s interlacing). You can choose between three and five scans. Baseline (“Standard”) is the only option supported by all Web browsers.
- Size: If you choose the Preview option in the Save dialog box, the Size area displays the file size and approximate download time at a particular connection speed. You can change the connection speed in the range 14.4 Kbps to 2 Mbps.

JPEG advantages
The advantages of the JPEG format are in many cases nearly identical to those of the GIF format:
- The file sizes can be very small. In some cases, JPEGs are even smaller in size than their GIF equivalents. The amount of compression you can use varies with the particular image. Compression works best when you have images with lots of low-contrast areas that have only subtle variations that won’t be missed when pixels are combined.
Bottom line: The JPEG format works best with images that can be squeezed without the process becoming obvious to the unaided eye.
- JPEGs preserve the colors of your original image. Gradations in tone are preserved well, so your gradients and soft edges look good.
Bottom line: JPEGs are great for continuous-tone color photographs.
- You can save JPEGs in Progressive format. Progressive format is similar to the interlacing process most commonly used in GIFs, in which alternate lines are displayed as the file downloads.
Bottom line: Use this capability when you really need a full-color rendition and want to provide interlacing for visitors with slow dial-up connections. If their browsers don’t support interlaced JPEGs, they’ll still see the image.

JPEG disadvantages
The following list details the disadvantages of JPEG files:
- Files saved in other formats may be smaller. Broad areas of a single color won’t be compressed at all, so the equivalent GIF may be a lot smaller in size.
Bottom line: Compare the file size of JPEG and GIF images by using the Save for Web feature to see which provides the smallest file.
- JPEGs don’t preserve the detail in your image. At high compression ratios, JPEGs can take on an objectionable, blocky appearance.
Bottom line: Review the final appearance of your JPEG before using it. Some images can take high compression and still look good, but others can’t.
- JPEGs don’t support transparency. Often, you’ll end up using a GIF instead, even when JPEG would do a much better job.
Bottom line: Choose your images carefully so that they don’t require transparency if using JPEG is really important.

Editing JPEGs isn’t a good idea because each time you save a JPEG file, additional image data due to lossy compression is lost. Work with an original TIFF or PSD file and save it as a JPEG when you’re finished editing it. If you need to make additional changes, return to the TIFF or PSD file.