Difference between JPEG, GIF, PNG and BMP? Part 1 of 2

You must be familiar with various image file formats. But are you clear on when you should use which image format? In today's post I will discuss why you need to worry about image file formats. In the next post, I will take you through a complete understanding of each file format.

Why bother about file formats?
You are not a designer. You do not create images in Adobe Photoshop or Corel Draw. Every time a designer creates a project in Adobe Photoshop he has to decide whether to save the image as a JPEG, GIF or BMP or PNG or some other format. But not you. Even then you need to know about these file formats. Here are some situations which you face regularly where knowledge of file formats will be of immense help.

Situation #1 Taking a Screen Shot

If you take a screen shot and copy on to MS Paint and save it, by default it will save in .BMP / .DIB. But that might not be the right choice. Your file size and image quality depends on which file format you choose. Hence, you need to know which format gives the best quality with a low file size.
Situation #2 Reducing the file size of your presentation
If you have a bulky presentation, chances are your images have caused this problem. In which case you need to go and manually reduce the size of each image without causing loss of quality. How would you do that?

After inserting the image onto the slide, copy it, then 'paste special as' and choose a different file format. You now delete the old bulky image and use this new lean image. It is possible that your original image was a .BMP (it is a bulky file format) and you will now save it in some other file format. But which file format will give you good quality at a reduced file size? JPG, GIF or PNG?
Situation #3 Saving an Object as a Picture

MS PowerPoint gives you a very useful option. You have created a chart, table, shape (boxes, circles) or smartart. You can save these as a picture (right click on the object and save as picture). When you click save, it will give you options. Saving in .PNG is very different from saving in .JPG. Hence, you need to know about these formats.

In the above situations having proper knowledge of file formats will save you from making mistakes. Mistakes which can spoil the entire look of your slide. It can even make the image unreadable. To know what happens if you don't understand file formats see the example below.

Example
While writing my series, 14 Tips to Make Awesome Charts, I used to make a lot of charts in MS PowerPoint. Then I used to save them on my hard disk as a picture and then upload it on blogger. Take the example of one such pie chart.

After I created this chart on MS PowerPoint, I right clicked on it and saved it. I could have saved it as .JPG, .PNG, .GIF or .BMP (these are the popular formats). Let us see the difference between the image quality in various file formats.

Here is the .BMP image

This is .GIF

This is .JPG

Lastly, here is the .PNG version

Observations from the above four images:

There seems to be no problem with .BMP and .PNG. In .JPG the text has gone bad (see image on the left) but the pie looks fine.



The colours of the pie have got distorted in .GIF. Even the thick chart title has lost some quality. This image on the left is a zoomed portion of the pie which shows image degradation in .GIF

This was about file quality but what about file size? The following table shares the file size of the pictures along with comments on their overall quality.
As you can see, the file size has gone for a toss with the good looking .BMP. In all the other cases, the file size is less but the quality varies. In this case .PNG looks like the best option. But what about other cases? Will you save the image in all four formats and do this comparison all the time?

How does one solve this problem?

In the next post I will share with you how to handle each file format. You will understand which format to use in which circumstance so that you get the best quality and a decent file size.