Earthbound Light - Nature Photography from the Pacific Northwest and beyond by Bob Johnson
Online Ordering
Recent Updates

Photo Tip of the Week

Photoshop Save for Web versus Save As JPEG

Photoshop gives you two ways to create a JPEG to be posted on a website or sent by email: "Save As..." and "Save for Web...." Both are found on the File menu and they have a lot in common, but also a few significant differences.

When creating web images, file size is an important consideration. The bigger the file you send someone is, the longer it will take for them to receive it. If you send them an image bigger than their monitor is set to display, they can't even see the whole thing all at once. Images from a standard six-megapixel cameras measure around 2000 x 3000 while the average monitor in use currently is no bigger than 1024 x 768. To accommodate smaller monitors too, it is best to keep images to no more than 800 pixels on their longest side, smaller still if you want to be extra sure people will be able to see the entire thing.

Resolution for web and email images is irrelevant as this field will be completely ignored by the recipient's browser or email program. As mentioned back in 2002, monitors aren't really all 72-dpi. They vary widely based on how big they are and how they are set. More importantly though, they don't care about pixels per inch. Images are composed of pixels and so are Monitor displays. Image pixels are displayed one to one via monitor pixels with no scaling whatsoever. If your friend's monitor is running at 1024 x 768, that's the biggest image they will be able to see in their browser. Smaller still if you account for the space taken up by menus, borders and other elements of the program itself. While Photoshop and similar programs will resample images to allow you to get images bigger than this to fit, there's still no sense in sending people such images for general use. If they can't see all the detail you send them, the extra data will only serve to slow down their online experience. Stick with images that can be seen in their entirety at full size unless you know ahead of time that the person you are sending them to wants and can handle bigger.

Bit depth may also be an issue since JPEG images come in 8-bit mode only. "Save As" will only present you with the option to create a JPEG if your image in 8-bit mode. To convert from 16-bit (or 32-bit) mode, use Image >> Mode >> 8-bits/Channel. If you use "Save for Web" instead, Photoshop will handle this for you. Your original image will remain unaltered.

Both methods offer you the ability to specify the degree of compression with lower numbers creating smaller files, but causing higher degrees of quality loss in the process. Oddly, the two don't use the same numeric scale for compression values. "Save As" gives you choices from 0 through 12 while "Save for Web" uses a scale from 0 through 100. No real differences in the results other than how many steps the range from low to high is divided into. Twelve in the one is the same as one hundred in the other. For convenience, each also assigns names to portions of the scale and you can generally stick with either "Medium" or "High."

Both also give you the option of creating a standard JPEG ("Baseline") or a Progressive JPEG. Baseline images display in a single pass from top to bottom while Progressive ones display in several passes starting with a low resolution version and progressively (hence the name) getting better with each pass. Progressive JPEG files are slightly larger and not as universally supported as is the Baseline JPEG format.

If your original image contains EXIF data from your camera or elsewhere, it will be preserved by "Save As" while "Save for Web" will strip it out. There are plug-ins for browsers that can show you this data, and some photo sharing sites can automatically extract and display it, but generally this information will be inaccessible to those viewing your image. For most situations including it will only serve to create bigger files.

The web is sRGB territory when in comes to color. Web browsers and email programs (with few rare exceptions) don't understand color profiles. If you send someone an image in a different profile the colors won't look right. Specifically, Adobe RGB images will tend to appear somewhat dull and washed out. It is also important that you have your own monitor profiled if possible so that you know what you are looking at really does look the way you think it does. Even if you can get prints that seem right, you may have merely compensated in your printer settings for any problems in your monitor so this is no guarantee that your friend will see what you do when they get your email or look on your web page. Of course, unless their monitor is profiled too they may still see the wrong colors, but the only thing you can control is your own monitor, not theirs. At least if they complain and you know your monitor is profiled you can explain with a subtle grin of superiority that they should profile theirs. Both "Save As" and "Save For Web" allow you to embed the current ICC profile in the resulting image, but since it will be ignored even if present, the only thing including one will do is make your file bigger, making it take longer to download. So, while it is important that you convert your image to sRGB, you don't want to include the profile to tell people that. Instead, you have to rely on the fact that the web operates on sRGB even without the profile.

The following table summarizes the differences between the two methods for creating JPEG files:

   "Save As..."   "Save for Web..." 
Source bit depth (both create only 8-bit JPEG's) 8-bit only 8-bit or 16-bit
Compression scale (both really the same) 0 - 12 0 - 100
Preserves EXIF ? (Not seen by most programs) Yes No
Converts to sRGB for you? No No
Permits embedding profiles ? (but you generally don't want to)  Yes Yes

Generally, I prefer "Save for Web" for web and email. The interface is a lot nicer and it strips EXIF data which can't be seen anyway by most browsers. When I need JPEG files for other purposes, "Save As" comes in handy. I'd like to think Adobe had the same thought when they designed things, but perhaps I'm reading too much into the names..

Date posted: October 23, 2005 (updated April 3, 2006)


Copyright © 2005, 2006 Bob Johnson, Earthbound Light - all rights reserved.
Permanent link for this article

Previous tip: Adobe RGB is not a Monitor Profile Return to archives menu Next tip: New Windows XP Color Control Panel from Microsoft

Related articles:
Adobe Lightroom's Equivalent of "Save For Web"

Tweet this page       Bookmark and Share       Subscribe on Facebook via NetworkedBlogs       Printer Friendly Version

Machine translation:   Español   |   Deutsch   |   Français   |   Italiano   |   Português

A new photo tip is posted each Sunday, so please check back regularly.

Support Earthbound Light by buying from B&H Photo
  Buy a good book
Click here for book recommendations
Support Earthbound Light
  Or say thanks the easy way with PayPal if you prefer

Home  |  About  |  Portfolio  |  WebStore  |  PhotoTips  |  Contact  |  Comments  |  Updates  |  Support
Nature Photography from the Pacific Northwest and beyond by Bob Johnson

View Cart  |  Store Policies  |  Terms of Use  |  Your Privacy