Optimizing images
Now that we've cropped our image and adjusted brightness and contrast, it's time to optimize it for use on our Web site.
To avoid long page loads for our visitors, we need to make sure the total file size on our pages is not too large. An uncompressed image, even a small one like ours (150x300 pixels) would be too large to add to a Web page. Luckily, Photoshop Elements provides a useful tool under the Save for Web option.
Original file size: 132k
Compressed size: 17k
Optimizing JPEG files
JPEG (.jpg) compression is a 'lossy' compression scheme. This means that as you increase compression (reduce file size) you lose some of the data. When you export your images for the Web, you need to find a balance between quality and file size. Here's how:
1. With your image open, select File>Save for Web from the main toolbar. (You can save time by using the keyboard shortcut Alt+Shift+Cntl+S.) This will open a new window. The left side shows before and after images, the right side (see example) contains your options.
2. For photos, use the JPEG option. Select one of the preset quality options, or adjust the slider for finer adjustments.
3. If you resize your image, be sure to click Apply prior to clicking OK.
4. Be careful not to overcompress your image. Here's a look at some compression options. For the final image at the top of this page, we used a quality setting of 73. You decide at which point the image becomes 'unacceptable'.
Quality: 45 File size: 8.5k
Quality: 30 File size: 6.4k
Quality: 15 File size: 4k
Quality: 0 File size: 2.8k
Home | Design | Dreamweaver | Fireworks | Photoshop | AdSense
©2006 Wilk Web Works
All rights reserved.