Tjetjep Rustandi's Photo Blog

TeeJe Photography blog

Saving Image for a Contest or Web


Here is the steps I use for compressing an image to be smallest enough being asked by webmaster or contest but still the highest quality browser display within the file-size limits. Yes,, the method is not the only one but I found this very useful.

The screenshots in these steps are using Adobe Photoshop CS5, although almost every photo-editor has similar features.

After you’re completing the editing of the image and get it just ‘right’ then you want to save it with the optimal quality allowed by the contest or webmaster. Here is the method.

FILE>Save for Web & Devices
Save as Web

Not to difficult,,,right?

This is the Save for Web dialog box.

"File Save as Web"

File Save as Web

Take a look the numbers from the images as steps need to be taken.

#1) Set the #1 box to “JPEG”.

#2) Is the zoom factor. I recommend you set this to 200%, which doubles the viewing size (it doesn’t change the actual size, only zooming), so at the end of step

#5, we can scroll around and verify the quality is acceptable.

#3) Click the 2-UP, so you can compare the optimized and the original image side by side.

#4) This is where we’ll set the size of our image. In photo contests, your image must be large enough to be seen clearly.

So, let’s assume almost everyone has a screen of at least 1024 pixels high and 768 pixels wide. If we subtract a fudge-factor for the scroll bars (at the side) and the menu bars (at the top); then 900 by 600 seems to be a pretty good guess at the minimum DISPLAYABLE screen size for our photographs.

To keep our entire photograph on the screen, we scale the LARGEST side of our photograph to the dimension above (either 900 OR 600); if a portrait format (taller than it is wide) scale the height to 900 *OR* we’ll scale the width to 900 in the case of a landscape format (wider than it is tall).

We do that by clicking on the IMAGE SIZE tab on the right (#4) and entering either 900, or 600, in the appropriate box. Make sure “chain” icon is checked.

#5) Click the little arrow marked #5 and you’ll get this:Optimize to File Size

Click on “Optimize to File Size” and you’ll get this box:
Optimize File Size

It’s a good idea to reduce the file size you want by 2% and enter that value in the box. So in this case, I wished to make the best possible image in fewer than 200 KB, so I entered 196.

Then compare the two images on the top and below in the 2-UP view, and look for “show-stopper” errors. The chances are very high that you’ll not be able to see much difference in quality between the images at all.

Now, just press “SAVE” and make your own name for keeping the original image name.

Hope it helps.
Excerpt from the book and modified

posted under Tutorial | No Comments »