WebDevelopersNotes logo

home-icon Home / Graphics / When do I use JPGs?

When do I use JPGs?

When do I use JPGs?

JPGs are suited for photographs or other high color images because of the following reasons:

  • Photographs are high color images and this is what is needed to compress the images using the JPG algorithm.
  • Gradients and subtle colors changes are a common feature of photographs. Also, color gradients contain pixels of several colors and this is what is required by the JPG compression algorithm. (refer above point)
  • JPG allows various levels of compression. This helps you choose the correct one for the image in question.
  • Even high JPG compression on photographs is not very perceptible.

Sponsored Links

Original JPGOriginal JPG (3838 bytes). Consider this 100%

Compressed Jpg: 82% of the original82% quality of the original (3184 bytes)

Compressed Jpg: 60% of the original60% quality of the original (2310 bytes)

Compressed Jpg: 51% of the original51% quality of the original (1981 bytes)
Note that pixelation starts to appear and is perceptible near the ‘crown’ because this area has some sharp color changes.

Compressed Jpg: 40% of the original40% quality of the original (1569 bytes)

Compressed Jpg: 20% of the original20% quality of the original (783 bytes)

For details on why GIF format should not be used for photographs, refer the section on When to use gifs.

When to avoid JPGs

The JPG algorithm does not do justice to images with sharp edges such as text, cartoons, line-art etc. You should choose the GIF file format for such images. Refer When to use gifs for details.

I also suggest reading When to use Gifs and JPGs and Using JPG and Gif in a single image.

Another point: JPG does not support color transparency and animation. You might have to use the GIF format if you want these features.

Having said that, I have a interesting tip on how to make animated JPGs using a little JavaScript. It’s more like displaying a series of JPG images quickly at a particular place than actual animated JPG creation!

Sponsored Links

Your comments
Star icon IMPORTANT Have a question / problem? Click here to ask an expert.

Sponsored Links


How do I view a deleted web page?
Is there a way to view a deleted web page - one that is no longer available? Yes there is and the solution is quite simple. [more...]


The first calculator app on the iPhone was strikingly similar to the Braun ET44 calculator. [more...]

We use cookies to give you the best possible website experience. By using WebDevelopersNotes.com, you agree to our Privacy Policy