Deciding which image format to use

Question

I'm working on a web application that will allow users to upload profile pictures (avatars, basically). These images will be no bigger than 100 x 100 pixels and will be pictures of peoples' faces.

We want to allow the user to upload various image formats, but we also want to convert them all to the same image format. What would be the best image format for size, quality, etc.?

Edit

In this case, size is more important than quality, but not by much.

Answer 1

For faces, JPEG is your best bet. Even a relatively high quality JPEG image will be significantly compressed relative to the alternatives.

The JPEG format (and the way its compression works) was designed for "natural" images like photographs. (The alternatives, primarily GIF and PNG, work better for computer graphics, diagrams, etc.)

All that said, you should try it. Take a couple of example photos, convert them to the various image formats, and see how they compare (with apologies for the subject matter! 8-)

JPEG, 6,668 bytes:

_{(source: entrian.com)}

PNG, 31,651 bytes:

_{(source: entrian.com)}

Answer 2

I think JPG is best for avatars, I cant find a need for transparency.

JPG will be ok for photographs and will be overdo for graphics, but it's not a huge size overhead for 100x100

Answer 3

With an image of such limited size, and considering the profile pictures will most likely be a natural image JPEG is most certainly the way to go.

PNG works great when handed a very repetitive pattern. Computer generated graphics like screenshots, gradients. There are a couple of filters that increase the effectiveness of the deflate, however due to the losless nature of PNG, you will almost never get similar compression ratio's on these kinds of images.