Archive for February 5th, 2007

Websizing images

Add a comment

Factoid: The lovely, enormous images we take with our digital cameras are too big for displaying on the web. Here’s a few reasons why:

(1) Because we can’t see better than 72 or 90 dpi on our screens anyhow.

(2) Even with North America’s huge number of users on highspeed internet, who wants to wait an interminable time for a huge image file to download and display? And if you’re on dial-up or one of the godzillion people in the world who don’t access the internet through a great big fat pipe with a reliable connection, well, your 2.3 MB pic and the Second Coming are gonna be kind of neck and neck, know’m’sayin’?

(3) Space on your home computer is cheap and plentiful. Space on your hosted domain on a server connected to the internet… now that’s a little more expensive.

So what do we do? We shrink our files!

Best bet for “here, lookit this photo I took” websize is
– under 800 pixels as the larger dimension
– under 80% quality for jpgs, and
– under 120KB in size
(of course this is just a guideline — you should try it a few different ways and decide what suits you best)

I’ve attached three pics to illustrate what I’m going on about here.

The first one (below) is a quite shrunken screenshot (a picture of what I’m looking at on my computer monitor) of what one uploaded file would look like, if viewed at 100% size. This is on my big display 19″ monitor at a high resolution. Someone viewing at a more common lower resolution, and smaller monitor size will see only a corner of this corner of the image. The original image is 2,287 kilobytes.

beanscreenshot1.jpg

The second image is a resize of the original 2.3 MB image, at a reasonable size for many webgraphics. It’s a jpg at 75% quality, and is just about 500 pixels wide. It takes up 45kb of disk space, or about 2% of the space that the original does. The red square in the corner shows how much of this image showed on my monitor in the screenshot above.

beans1.jpg

The third image is my ideal, as I cropped in to get a closer view of these rather pretty beans, and then reduced the image in size and saved at 75% quality as a jpeg. This image is 615 pixels wide, and takes up 85KB of disk space. It fits my guidelines for size, and still shows off the subject of the photo. (This works for both pinto beans and human beans.)

beans2.jpg