Resize and optimize an image for the Web using the Save for Web dialog box in Photoshop.
When
you save an image for the Web, you must balance maintaining image
quality with minimizing file size and thus download time. The Save for
Web dialog box lets you preview different optimization settings. Each
preview includes file size and estimated download time. Thus, without
altering the original image, you can see the results of various
settings and choose the setting that best meets your needs.
Open the image in Photoshop, and choose File > Save for Web.
In
the Save for Web dialog box, click the 4-Up tab. The dialog box
displays the original image and three previews using different
optimization settings.
Click
a preview to select it, and then choose a file format preset from the
Preset pop-up menu to see the difference in quality. Repeat as needed
for each preview. Choose presets based on the file format appropriate
for your image:
- JPEG for
continuous tone images, such as photographs. JPEG compression preserves
a broad range of color and subtle variations in brightness, but does
not support transparency.
- GIF for
animations, solid-color images, and images with repetitive color, such
as line art and logos. GIF supports transparency.
- PNG-8 for solid-color images with sharp detail. Note that many older browsers do not support the PNG format.
- PNG-24
for continuous tone images, such as photographs. PNG-24 preserves
transparency, a broad range of color, and subtle variations in
brightness. Note that many older browsers do not support the PNG format.
Choose
200% from the zoom pop-up menu at the bottom left corner of the dialog
box. Zooming in lets you examine the detail in each of the previews.
If
you want to compare other areas of the image, click the Hand tool (on
the upper left side of the dialog box) and drag the image. All the
previews move together.
If
you want to resize the image, click the Image size tab on the right
side of the dialog box. Enter the desired dimensions for Width and
Height. Click the Apply button in the tab. (When you save the file,
Photoshop resizes only the Web-optimized version.)
Select the preview that best meets your needs, and click Save.
In
the Save Optimized As dialog box, locate the folder in which you want
to save the image, type a name for the file, and click Save.
No comments:
Post a Comment