Web Design with HTML and CSS

104

Saving as a PNG

Web Design with HTML and CSS Digital Classroom

3 Click the plays animation icon ( ) to test your animation.

4 Choose File > Save for Web & Devices and make sure the setting for Preset is

GIF 64 No Dither. Then press Save.

5 Choose File > Save to save this fi le and then choose File > Close.

Saving as a PNG

Some characteristics, such as the ability to display variable levels of transparency, are

uniquely supported by the PNG format, but you cannot reduce the fi le size such as you

can with JPEG and GIF formats. You can use the PNG format to benefi t from its unique

characteristics more than for a need to reduce fi le size.

In the following steps, you will create a navigation bar.

1 Choose File > Open, and in the Open dialog box, select the fi le named web0506.psd.

You will use this image at the top of a web page.

The initial artwork.

2 Choose Window > Layers. The Layers panel appears with three layers already created.

You will fi rst group these layers, and then apply a mask to all three layers to allow the

image to fade from 100-percent to 0-percent opacity.

Three layers exist in the Layers panel.

3 Select the bottom layer (baseimage) and Shift + click the top layer (Get Healthy). All

three layers are now selected.