Saving Images for the Web or E-Mail - Photoshop


It is considered a breach of "netiquette" to place high resolution files with little or no compression in e-mail or on web sites. Sizing and compressing pictures is easy in almost every image processing program or even viewer utilities. Both the full version of Photoshop and Photoshop elements has a very slick feature "Save for Web".

First I will go through the steps of sizing and saving without the "Save for Web" feature. This will be similar in pretty much every other program.

On the left is Image Size on the Image menu. Select it and the requester below comes up.
Under pixel dimensions enter a width. Generally a value between 480 and 640 width is polite. As long as "Constrain Proportions" is checked, Photoshop will enter the other dimension automatically. "Document Size" refers only to Printing, so ignore it.
Under the File menu select "Save As..." and the standard savings requester will come up. Give the image a name different from the original, so you don't overwrite it..
When you click "OK" in the file requester above, the JPEG Options requester opens.

This lets you set the amount of compression and therefore the size of the image file.

Note that one can select the speed of the connection and it will give a readout on the size of file and how long it will take to download. Since most people now have 56K modems, that is a safe choice.

For a 480 pixel wide image, a size of 48K or less would be polite. Move the slider until you get a reading about that size.

Photoshop has a "Save for Web" feature, as mentioned above. This puts all the controls in one place.

Photoshop creates a virtual image for you to play with. You can size it up or down and try various levels of compression, without impacting the actual image. You can also directly compare it to the original just by clicking a tab at the top of the page. Only when you save it do the changes become permanent.

Click on "Save for Web..." and a nearly full screen window opens. Take a moment to explore it.

The first step we will do, is reduce the size of the image. On the right hand side of the screen there is the image size tab. Click on it and insert the dimension and click "Apply"

The moment you click "Apply", the image at its new size will appear in the window to the left. If the image is too small to show the detail you need, size it a bit larger. This does no harm.
You can click on these tabs to toggle between the view of the original and optimized versions.

Click on the tiny triangle (red arrow) and choose "Optimize to File Size" left. The requester on the right will show up. Numerically enter the size and Photoshop will seek the proper level of compression.

Check the level of artifacting, and if necessary increase or decrease the size accordingly. Once you have achieved the best combination of size and compression then click on "OK" and a requester will come up and let you save it.

When the "Save for Web" feature closes, you will find the original image intact. This is a totally nondestructive way to save an image for the net.

© Larry N. Bolch 2002