James Stephens

When saving an image for the web there are basically five things you need to do:

1. Convert the image mode to 8-bit color depth.
2. Convert the image profile to sRGB (and preserve it in the image).
3. Resize the image as desired.
4. Sharpen the image.
5. Save in jpg format.

Adobe Photoshop actually has a “Save For Web” feature that can do most of the above (apart from sharpening), but I find it complicated to use. Also, it removes all non-image data (Exif information, copyright etc.) in order to reduce the file size as much as possible. I prefer to leave this information in the image.

Image Processor (invoked from from Adobe Bridge using Tools –> Photoshop -> Image Processor) is the best tool I have found performing these steps. Image Processor can be invoked on RAW files, it is easy to use in batch mode (simply select the desired number of images in bridge), and the resize feature preserves aspect ratio, so if you specify the desired pixel Height and Width to the same value then images are resized appropriately regardless of whether they are in landscape or portrait mode. This is very useful when batch processing many images and the format is mixed.

Sharpening is where it gets a little tricky because ideally one would use the “Run Action” feature of Image Processor to run a Photoshop Action that would accomplish this but the problem is that Image Processor runs actions before resizing whereas the sharpening has to be done after resizing. The way around this is to invoke Image Processor twice, once to perform Steps 1-3 and again to perform the sharpening. I still find this more convenient than using Photoshop directly, in particular for batch jobs involving a mix of images in landscape and portrait mode where Photoshop falls flat on its face at the resize stage.

Here are some screenshots:

First Time (Convert to sRGB, Resize, Save as jpg)

Note - The “Save In Same Location” actually saves the files in a folder entitled JPEG so navigate to this folder and select the images before running the second time.

Second Time (Run Photoshop Action)

Of course, you’ll need to create an action in Adobe Photoshop for the sharpening step. I’ll leave that as an exercise to the reader … there’s plenty of pages out there on creating actions in PS.

Update Sep 01, 2006

Dr. (Russell) Brown has released a modified version of Image Processor which performs the action after the resize step. Thus, all five steps listed above can be performed in only one invocation of Image Processor and not two as with the version that ships with Photoshop. Download the modified version here.