Ok lets start,
We have three different Formats for Images used on the web JPG/GIF/PNG
GIF And PNG are both looseless formats (means no information will be lost during save)
JPG on the other side will drop some image infos to get a smaller filesize.

GIF/PNG achive a reduction in filesize by writing the image data in a better form then a uncompressed format would (BMP).

This is how a BMP stores information.

line1 pixel 1 red, pixel 2 red, pixel 3 red, pixel 4 blue, pixel 5 blue, pixel 6 red, pixel 7 red;

This is how GIF/PNG would save the same data.

line1 pixel 1-3 red, pixel 4-5 blue, pixel 6-7 red;

Ofcourse thats just a helper.
I'm not a programmer and dunno how it realy looks inside, but that should be the way it works.

One thing that can be seen from this is, that gif/png work best if alot of the same colored pixel is next to each other.
Making it a good format when you save lineart or flat colored and simple shaded work.
Here is a nice effect that puts the compressing routine in very good use.

The image to the left is 111,928kb in filesize where the image to the right is only 62,946kb small.

Save the images and zoom them to see how it works.

JPG try's to mathematical round out the color usage in a curtain area.
This especial works well with gradient color transitions, but has its problem with sharp details.
Also keeping the exact colors is not possible with JPG at higher compression lvls.

Another important thing to keep in mind is, that JPG compress everytime you save the image (saving in the browser excluded, but open and saving a jpg in an image suite will constantly decrease the image quality).

This is a extremly compressed JPG picture.
Notice how it turned all blocky and the colors went off compared to the png version.

Color depth
Just a small information addon, GIF is a relativ old format that only supports 256 colors.
If your image contains more (you can count the used colors normaly in a graphic suite), they will be lost.
PNG on the other hand does'nt have this limitation.

Usage.

Ok after this theoretical stuff my tips and guide to when use which format.

JPG. Is best used, when the image contains alot soft gradients and colors like photos or detailed coloring.

Remember tho to keep the compression rather low (personaly I try to stay between 1-10% compression) and to only save a image once as a jpg in the end (keep a working image in the editors own format psd for photoshop or psp for paintshop pro).

Gif/PNG. Those formats are best used, when details are more important then filesize.
Especial lineart, used for coloring, should be saved in either one of this formats.
You can also use this format if you deal with grayscale images, as those only have 256 colors(greyshades) and images that have areas with a single color (make sure that it is realy one color tho).

Ok thats this for now I hope it helps a bit, if you have questions just ask them I will try to anwser them.
Also if you find spell errors, tell me those aswell so I can correct them, tnx.

--------------------
Wer nicht vom Meister lernt, lernt nie etwas.

Hope you can get on our nerves with your happy mood again, pretty soon .

--------------------
Wer nicht vom Meister lernt, lernt nie etwas.

i have a question. if i scan a picture, and i want to make a print out of my scan - what file format should i save it under? jpg is such a pain!!! since pictures always print out smaller, and if you blow it up it gets fuzzy

Thanks a lot for the info, GIAM!

But it sounds like you scanned it with a too low dpi.
See your printer prints with a certain dpi (can be selected in the printer setup normaly) if you scan with a lower dpi than you print, the image will apear smaller (resizing in a program has the same effect ofcourse).
So make sure you scanned it with the right dpi.

Hmm southern when PNG does weird coloring things it is normaly because of wrong gamma settings (in the png).
PNG can save a gamma setting.
This way a image should look almost the same no matter on what computer it is viewed.
But unfortunaly browsers seem to apply different base gamma when no information was saved(IE darkens the image).

BMP is actually pretty cool.
It is normaly uncompressed and this way you see instantly how much ram this thing will use.

--------------------
Wer nicht vom Meister lernt, lernt nie etwas.