lucy24 - 5:33 am on Jan 10, 2013 (gmt 0)

Funny to see this question come up in a www forum because it's a perennial favorite among e-book producers too.

Can we assume ordinary pictures that are simply part of the page design-- nothing fancy like zooming in on map detail or fine art? If so, smaller is better. No, not the physical size of the picture measured in pixels, inches or linear measure of your choice. Filesize in bytes.

Do not even think about png for full-color ("millions", with or without alpha channel) images. Even using uncompressed jpgs, the size difference is enormous.* If you can cut the bitdepth to 256 colors or less, use png and/or gif. (Different argument here ;)) Otherwise use jpg and experiment. Even compressing a little bit, like 90%, will cut the filesize in half.

Also look at image content. jpg is lousy at sharp edges and abrupt contrasts, as in a logo or design-- and the more you compress, the muddier it gets. Anything you're designing from scratch should be constrained up front. You can do a lot with 16 colors if they're the right 16.

But speaking of physical size: you can make an image a particular size and resize it in the browser based on viewport dimensions. But "can" does not mean "should". Just use a smaller picture in the first place. Or, if you must offer different sizes, get one of those utilities that does it server-side so the user never downloads more than they need. People will small viewports and restricted bandwidth (read: most cell phone users) will thank you.


* I once came across a site where many of the photographs were in
:: drumroll ::
.bmp format. Oh, and resized in the browser by a significant factor. You would not think anything could be bigger than a png, but these ran several megabytes each. I tried conveying this to the site owner-- via an intermediary-- but he wasn't interested. So I just painted the picture he'd ordered and shut up about it.