A raster image file is a rectangular array of regularly sampled values, known as pixels. Each pixel (picture element) has one or more numbers associated with it, specifying a color which the pixel should be displayed in.
The simplest representation of an image has each pixel specified by three 8 bit (24 bits total) color values (ranging from 0-255) defining the amount of red, green, and blue respectively in each pixel. In the right proportions, red, green, and blue can be combined to form black, white, 254 shades of grey, and a vast array of colors (16,777,216 colors total). The following is a super-simple image definition (3×3 image in ascii PPM format- from upper left, black, medium red, full red, medium grey, medium green, full green, white, medium blue, full blue). It is also shown as an enlarged image (in the GIF format since the PPM format shown can not be displayed by most web browsers) where each pixel is replicated as a 50×50 solid colored square.
P3 3 3 255 0 0 0 128 0 0 255 0 0 128 128 128 0 128 0 0 255 0 255 255 255 0 0 128 0 0 255
This, however, is a very simple way of representing an image and takes a very large amount of disk space. Most image formats, therefore, are compressed to shrink the size of the image. Additionally, some image formats allow for a much smaller range of colors (example: GIF is an 8 bit format and allows for only 256 different colors to be present in any image). Image formats such as GIF also, generally, do not directly specify colors in the manner shown above. Instead, each pixel is represented by a single number (for 8 bit images, a value from 0-255) which is an index into a color lookup table. Thus, each pixel only requires 8 bits (1/3 of the space) to represent it. The color lookup table then specifies colors in the full 24 bit true-color representation but it is so small relative to a normal sized image that the space it takes up is negligible. For a comparison of 24 bit vs 8 bit color, view the following page (in 24 bit PNG and 8 bit GIF formats respectively)
The following list indicates the image file formats and sizes of a single image in a variety of different formats for comparison purposes – all of these images are at 800×600 resolution. To view the first three of these examples, you will probably need to use an outside image viewing application – web browsers can only display a limited number of formats, generally including JPEG, GIF and PNG. The example image was generated by Erik Brisson of the Scientific Computing and Visualization group at Boston University for Dr. Bruce Boghosian of Boston University for the project Particle-in-Cell Simulation of Two-Dimensional Drift Turbulence in a Pure Electron Plasma Column.
FILE NAME # OF BYTES # OF BITS PER PIXEL COMPRESSION RASTER OR VECTOR sample.ppm 6336015 24 NONE RASTER sample.ps 2926048 SPECIAL/24 SPECIAL VECTOR sample.rgb 1440512 24 LOSSLESS RASTER sample.png 140557 24 LOSSLESS RASTER sample.gif 61346 8 LOSSLESS RASTER sample.jpg 59575 24 LOSSY RASTER
All of the above files basically represent the same image but there are significant differences. The GIF file has only 8 bit color and is therefore basically of lesser quality than the other images (of course it is also smaller and on an 8 bit color monitor would be just as good as a 24 bit color image). The PPM file is uncompressed and therefore very large and is of absolutely equivalent quality to the PNG image which is less than a fortieth of its size. The PostScript (.ps) file is unusual because it is not a raster image at all but rather a vector image (see the discussion on PostScript files). Finally, the JPEG image (.jpg) is the smallest image and is a full 24 bit color image but it is compressed using a lossy compression scheme. This means that, unlike the PPM, RGB and PNG files which are totally equivalent, the JPEG file is not. If you convert an image from RGB to JPEG and back to RGB, you will lose some level of quality in the transition to JPEG and can never get it back. How much loss there is depends on your choice of image compression level and on the nature of the image you are compressing.
There are many other differences between file formats but most of them are not important for the average user to know about.
Why are there so many different image file formats?
There are many reasons for this but the primary ones are money and practicality. Some file format developers (such as CompuServe with GIF) try to maintain some level of control over their formats. Other users and developers, of course, do not wish to submit to this and so they develop their own formats. In addition, there are real differences among the formats (see the chart above) and some formats really are better for certain applications. For example, if the file needs to be high quality but very small, JPEG is good. For maximum quality, TIFF is a good choice. For maximum compatibility, GIF and TIFF are good choices because they are very broadly used. For the web, the only options are generally JPEG, GIF, and PNG. For printing, PostScript is the clear standard and often you must convert your file to PostScript before printing it (or the printing software will do it for you). The list of formats and specific advantages goes on and on so use that format which is best for your individual appliation.
Image Resolution – DPI
Raster images are of a certain size, such as 800×600 for the sample image above, indicating the image is 800 pixels wide and 600 pixels high. This size affects both the size of the image file and how the image looks on screen or when printed out. In terms of file size, remember that generally doubling the size of an image (for example taking a 100×100 image and making it a 200×200 image) actually increases the area of the screen covered and the file size by four times.
What resolution you should use greatly depends upon your application. If you are displaying the image on the web, many web browswer windows will only be 1000 pixels wide or less so displaying images larger than this will mostly not be advantageous to you. Similar numbers are true of applications such as PowerPoint although it can use the whole screen so, depending on the monitor resolution you have, up to around 2000 pixels wide may be useful if you want the very best quality image. On the other hand if you are printing out the image to fill a 8″ x 6″ area using a 600 DPI (dots per inch) printer (which is a common printer resolution), the image will look better if it is 4800×3600 – if it is smaller it will need to be scaled up.
So which format should you use?
JPEG – The JPEG format was developed as a highly (and lossy) compressed format, optimized for photographs. The format supports 24 bit images and although data is discarded, it is done in such a way that it will not be visible to most people. This format is extremely popular on the Web and in any situation where the file size is of significant importance (such as storing large numbers of pictures on a digital camera’s memory card). Should be avoided however for any situation where you want the very best quality image, such as in printed publication graphics. Also, if you are working with an image to manipulate it in some way (such as with Photoshop), you should work with it in a non-lossy format (such as TIFF or, with Photoshop, PSD) and then, only when you are done, save the file as a JPEG.
PNG – This format is the third most commonly viewable format on the Web and is supported by most modern web browsers. It supports full lossless compression 24-bit color and is the format of choice for web images that must be of the highest quality. The compression quality of PNG files is also excellent, as it uses a generally more efficient algorithm than other formats such as GIF or TIFF.
GIF – The GIF format is also very popular for graphics on the web but only supports 8-bit color and so should be avoided for most applications. There are generally only two situations where we would recommend using the GIF format. The first is if your image has 256 or less colors and you want the maximum web compatibility. The second is for animated sequences of images on the Web, where the Animated GIF format is the standard for users not willing or able to use such applications as Adobe Flash.
TIFF, RGB, PPM – All of these are 24-bit color high quality formats and commonly seen. Most web browsers will not be able to view these images except through an external applciation but for non-web based applications, all of these formats are quite useful.
PSD – This format is the internal format used by the popular image editing program Adobe Photoshop. It stores more than just the image, such as layers information, text, etc… Use this format while working in Photoshop but when done, if you wish to share the image with people who you do not know have Photoshop, save it in another format, such as TIFF, PNG, or JPEG.
RAW – This is actually not a single format, but rather a set of internal (and each different) formats used by some digital cameras. Although some applications will read some RAW formats, storing your images in this format once you get them off of your camera is not recommended. Convert them to a more general format such as PNG or JPEG for saving for the long term.