This post is a work-in-progress. Have a favourite that isn’t listed here? Shoot me an email below and tell me about it.

Online (no download, platform independent) Applications

GifWorks.
For GIFs, animated or no.
http://www.gifworks.com/image_editor.html

On Your Windows Computer

Image Resizer
http://www.microsoft.com/windowsxp/downloads/powertoys/xppowertoys.mspx

My friend asked me to explain, to explain in 5 minutes or less, the difference between some of the different image file formats! I’ll give it a shot, bare-naked, like.

There’s a crapload of different formats for pictures, and they all save the picture differently. There’s two main kinds, raster and vector.

VECTOR IMAGES

A simple vector image (illustrator, flash type images) contains instructions like this:
“make a point on this white background at co-ords. 10.6″ X 9.4″. inscribe a circle of exactly 4″ radius. Fill this circle with hot pink. Done.”

The more complex the shapes, the bigger the instructions get

RASTER IMAGES (jpeg, gif, tiff, png, bmp)

Imagine a sheet of graph paper.

Now imagine that there’s an image on this graph paper, with each little square being one square dot of colour.

Okay, so a TIFF file, which doesn’t lose quality, goes through the image, one pixel at a time, starting at top left and reading along the line to the right, describing the pixels’ colour one at a time. For every. single. pixel. (row 8763, column 64499, rgb values thus and so)

BMP files do something like the above, as well.

GIF files only describe 256 colours max, and they encode in a tighter way, perfect for line art and cartoons and logos. They describe lines. They say “start here and draw white until you get to this pixel, then draw pink until here, then draw red until here”
You can make gif files encode even less colours, down to 2. this makes ‘em smaller and smaller.

Jpegs encode in a good way for making small files — but bad for quality if you set the quality too low. So, a jpeg at 100% quality will be a large clear file, the same one at 75% quality will be good for web stuff, at 40% quality will look like michael jackson’s nose — all broke up.
It does this by sorta waving in the direction of the image and saying “Oh this section here is kinda greenish, and that one’s pretty blue, oh who cares, really.”

_____________________________________

totally apart from all this, the image size (5″ X 7″ or 8″ x 10″ or…), and the resolution (dpi/lpi… dots per inch or lines per inch) make a big difference to what the final file size is gonna be.

So. format, resolution, file size, image size, color values… all make a difference. Crazy, no?

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.

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.

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.)