A 'bitmap' image is a picture with the file ending .bmp; these are the pictures you make with Paint. They are not compressed in any way, so their file size is usually very large. Try making a full-screen picture with Paint and saving it. Then right-click on the file and choose 'Properties' ... the size will probably be over 1MB. This is way too big to email to someone. If you insert it into a Word document, it will make that file really big. It can't be used on a webpage, and even if you could, it would take too long for viewers of your page to see it.

Nevertheless, .bmp images are useful. Because they aren't compressed in any way, you can work on them over and over, resaving them repeatedly, and the image will never deteriorate. This is not the case with .jpg images, as we shall see.

When you are editing images, whether they are photographs or webpage clipart, or titles, you should always work with .bmp images until you are completely finished. When you are done, resave them as .jpg images. Here's why.

At the right is an example of a typical .jpg photograph. In terms of file size, it's only about 17k. It's not a very big picture, and as a .jpg on a webpage, only takes a second or so to load. But as a .bmp image, this photo would consume a huge 126k of memory. That's about eight times bigger than this .jpg.

Bitmap images 'map out' every single pixel in the picture. This image is 213 pixels wide by 199 pixels high, comprising a total of about 42,000 pixels on the screen. As a bitmap, each pixel in the photo would have to contain three pieces of information ... the colour, and the location of the pixel (horizontally and vertically). So there would really be about 126,000 bits of information in this picture. That's why the bitmap would be 126k in size.

But notice that we said that the .jpg image here is only 17k. How can it contain the same information and use up so little memory!?
The answer is in how a .jpg picture gets stored. Have a look at the image again, and let's look at a narrow strip near the centre, containing white and red pixels:


Here's the strip magnified:

... and zoomed so you can see the centre row of pixels:
Suppose this row contains 70 pixels. A bitmap image would need to store 210 pieces of information about this strip. A .jpg compression, however, looks at the strip and discovers that there are 50 pixels in a row that are approximately the same shade of white, and another 20 pixels that are approximately the same colour of red. It writes an instruction for the computer to store that says 'make 50 whites and 20 reds, in this location'. This is much quicker ... it only contains 6 pieces of information ... the two colours, the starting positions, and the length of each colour. So 210 pieces of information have been reduced to just 6. Doing this for the whole image will greatly reduce the amount space needed to store the file.

We mentioned that compressing an image this way causes it to deteriorate. If you repeatedly save an image as a .jpg file, compressing it each time, the picture will begin to look fuzzy and the colours will blur. This deterioration has to do with how carefully the computer looks for similar colours, and how similar in colour nearby pixels actually are. Higher compression rates (which you can set using the program you are editing the images with) will cause the computer to be less precise about how it matches up the colours, and a string of eleven different shades of blue, for example, might be replaced by just three strings of three different shades. This will make the colours in the image less precisely matched than they were originally.

The above is just a very cursory (and incomplete) description of how a JPG image stores information. For a much better explanation, visit the excellent site at:
http://cobweb.ecn.purdue.edu/~ace/jpeg-tut/jpegtut1.html


Computer Science | Science | Worsley School

Content, Graphics, & Design by Bill Willis 2001
Wunderland Website Design