- JPEG
- GIF
- PNG
Each of these formats have their own unique settings which can effect file size and the appearance of the image. In the Save for Web dialog, box, you can compare two different settings and preview the results before committing to the Save.
Download the Save for Web practice file and open it in Elements: SFW-practice.png
Choose the Save for Web command so you can explore the dialog box as you follow along. The Save for Web (SfW) shortcut is Alt-Shift-Ctrl-S on Windows or Option-Shift-Command-S on Mac. The dialog box is completely resizable, so it can be as large as your entire monitor area if necessary.
The Save for Web dialog offers several settings and two large previews of your images. On the left is the original image, and on the right is a preview of how the Web optimized image will look according to your settings. As you adjust settings, you can see how it affects your image in the optimized preview.
Save for Web Toolbar
Save for Web has its own toolbar on the left edge of the dialog box. Here's a description of these tools:Hand Tool - Use it to pan around the image previews. Both views will pan to show the same area. The same spacebar shortcut for the hand tool works here just as it does in the main Elements workspace.
Zoom Tool - Use it to zoom in on a preview. You can also use the zoom drop down box at the bottom left of the Save for Web dialog. When you zoom in and out, all your views change to the same zoom level. Remember: When judging image quality, it's best to keep the view to 100% magnification (actual pixels).
Eyedropper Tool - Use it to select a color from your image when you want to create a matte (used to blend the edges of a transparent image with the background). The eyedropper color is displayed in the color swatch just below the tool button.
Eyedropper Color - Shows the color you selected with the Eyedropper tool.