When producing images for the web i’m still finding sites that aren’t quite getting it right. Much of the blame may lie at the feet of content management systems and their ability to upload any image to a site and force it’s dimensions. The webby amongst you will know why this is bad, but perhaps I can offer some advice to those who aren’t quite sure.
Images are made up of pixels, individual dots. When setting your screen resolution in windows you may have seen “1024 x 768” – this means that on your monitor windows is drawing the desktop at 1024 pixels wide by 768 pixels high. That’s 786432 pixels, each with a colour value of billions.
Images of the web fall into thee main types – PNG, GIF, and JPG. JPG and GIF are both lossy formats, in that they discard unseen data (such as subtle shades) in order to drop the required size. PNG is lossless and uses standard comrpession techniques to shrink the file.
Use JPG for photos. Use PNG for graphics. Use GIF only as a last resort.