Printed from •

How to Optimize Images for the Web Using Photoshop

When we speak of image optimization, we are talking about how to make an image file size smaller without losing too much visual quality. The smaller the size of the file, the faster the Web page that contains the image will download.

The two factors that determine an image's file size are:

So to optimize an image we need to either reduce the number of pixels, the number of colors, or both.


Basically, first you make the photo the size you wish it to be in pixels (perhaps cropping first), and then you reduce the colors.

1) Open the photo in Photoshop.

2) Go to:
Image > Image size ...

3) Set the width and height in pixels (ignore the resolution setting; it is irrelevant), and click OK.

4) Go to:
View > Actual Pixels
to see the size at which the photo will actually appear on the Web. If this is not the right size, undo and resize it again.

5) Go to:
File > Save for Web and Devices ...
to bring up the Save for Web window.

6) Set it to JPEG (because this is a photo).

7) Set the Quality setting to be a number from 0 to 100. Make it as low as possible, until the image quality starts to suffer, then back off slightly.

8) Click Save.

For more information