No of visitors who read this post: 732
Category: Web Graphics
Type: Question
Author: Gerry F
Your rating: None Average: 5 (15 votes)

I am bemused on what is the best file format to use for images when using graphics.

I see a lot of sites now using PNG over JPG. When I check the file sizes, the PNG is slightly larger in size than a JPG.

What does the added value that gives over JPG for website images?

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

# Comment Id: 5192

JPG is the oldest and most widely used technology to compress images. JPG or JPEG stands for Joint Photographic Experts Group.  The compression technology used here is sometimes referred to "lossy" image saving technique.

You might have noticed that, when you save a raw image as a JPG, grainy edges are formed around sharp edges.  This is because JPG uses aliasing techniques to give the impression of a curved edges while compressing the image. Further more you will also notice a reduction in the color palette and might have seen "patches" of colors if you have a smooth pattern.

When you take PNG (Portable Network Graphics) , it tries to maintain the sharp edges while compressing. The PNG format does not introduce "grains" in the image. This is termed as a "loss less" image saving technique.

 Therefore for web based graphics it is better to use PNG rather than JPG if you require sharp images.

------------------
iRandom
 

# Comment Id: 5226

I still don not buy that PNG is better. Don't you think that size is the key thing here?

In order to make a page load fast, is it not important to keep the size of images smaller?

I agree that JPG introduces grain to the image, but it is not that apparent. Why then do digital cameras store the files in JPG format ?

# Comment Id: 5236

Another fact that i missed to explain is that PNG supports transparency effects. i.e. you can have a transparent backdrop in a PNG. Therefore it is actually a very good replacement over GIF.

The GIF format (Graphics Interchange Format) produces the smallest file possible while retaining a transparent layer. The drawback of GIF is that it down samples the images to a 8 bit color map. This means GIF can hold only Up to 256 colors. Therefore there is a drastic reduction in color in the final image. GIF is also uses a loss less compression technique.

So in reality PNG is a very good replacement over GIF. PNG supports 24 bit color with transparency.

JPG does not support transparency effects. GIF supports transparency effects. PNG combines both and gives the best of both worlds!

Therefore new web graphics uses PNG instead of GIF wherever there is a need for a transparent backdrop. Since it supports more colors and it is a loss less format, web graphics are more akin to use PNG over JPG.

------------------
iRandom
 

# Comment Id: 5246

Thank you for the explanation.

Now I understand that PNG is an actual replacement for GIF.

You still did not answer my question on why the latest digital cameras are not using PNG to store its images.

# Comment Id: 5249

I am really not sure why new digital cameras do not support PNG to save images instead of JPGs!

My honest opinion is that they should, given the development of technology.

I am sorry i cant help you there!

------------------
iRandom
 

# Comment Id: 5250

Well i would say the main reason that digital cameras do not support PNG is that the photographs we take do not require a transparent backdrop.

You see, in order for the PNG to have a transparency effect, you need to tell the PNG engine what color to take as the transparent area. This has to be done by the human as the camera does not have AI technology as yet.

Further it will make photography a burden if you have to keep telling the camera the color to use for transparency at each shot.

Hence for digital cameras, JPG makes sense!

Warm regards,
TechnoHat
"Search - The ultimate Tool"

# Comment Id: 5257

TehcnoHat, that is a close explanation that i can accept. The argument is valid and the reasoning very logical

Thank you both for clarifying my doubts!

# Comment Id: 5259

Now I know why digital cameras opt for JPG instead of PNG. Thank you TechnoHat for your inner-sight!

As they say "Hats off" !

------------------
iRandom