Previewing Images

---

Previewing an image's optimization settings is vital, and Fireworks makes it easy. You can view one setting or up to four different optimization settings, including different file formats. You can see the changes each setting will make on the file size and the appearance of the image.

The Preview tab

The preview displays your image as it will look in a browser. The Preview tab in your document window shows only the current view (a selected slice or the entire document if there isn't a selection) with the current optimization settings applied.

The 2-Up and 4-Up tabs

The 2-Up and the 4-Up tabs are used for viewing the effects of the optimization you are applying to an image or slice. The 2-Up tab shows you the original image and another one alongside it with optimization settings you have selected. This is a good way to determine how far you can go in optimizing and still have an image that looks acceptable.

Note 

Which view you see in your preview depends on whether or not a slice is selected. A selected slice shows in preview as it will display in a browser; the other areas will be dimmed. If no slice is selected, there will be no dimmed areas.

The 4-Up tab offers the most flexibility. You can view the original image and three other settings as well. To change the optimization, select the pane you want to change. In the Optimize panel change the setting; do this for each of the three views. You can mix the file formats as well so you can compare JPEG and GIF settings. You will be able to see the results in each view panel. If you look at the bottom of each view, you can see the file type, quality (or dither and colors for GIF), file size, and approximate time required to load the image in a browser (see Figure 23-4). Since this is a photo it is best optimized as a JPEG. Take note that the GIF file is considerably larger.

Figure 23-4: The 4-Up view showing a GIF and two different JPEG optimization settings

The Export Preview dialog box

In Figure 23-5 you can see the Export Preview dialog box (File ® Export Preview). The settings available are the same as those in the Optimize panel and include a few from the Optimize Options pop-up menu.

Figure 23-5: The Export Preview dialog box

You'll notice that there are a few other options, such as the File tab, which enables you to scale your image, and the Animation tab, which enables you to make a few changes to the timing and looping of an animation. Optimize to Size (Figure 23-6) has an arrow pointing to the Optimize to Size icon and the Optimize to Size dialog box open. You can type in a maximum file size you want your image to be and it will be optimized accordingly.

Figure 23-6: The Optimize to Size dialog box open

---