top of page

What's the Difference Between a JPG and a PNG?

Design Tip: What's the difference between a PNG and a JPG?

I was just saving a file as a PNG and thought I'd share this tip with you. A JPG file degrades each time it is re-saved. This means that the image loses pixels each time it's re-saved, re-uploaded, re-used. Over time, the JPG becomes very pixelated and blurry/grainy.

A PNG file does not degrade over time. You can save it, re-use it, upload it, download it. The file quality stays the same. PNG is the best to use for your graphics files - advertising and images (if/when you have the option available).

Here is a PNG of a beautiful landscape photo that I downloaded from Unsplash (they have BEAUTIFUL rights free for commercial use photos). As you can see, the colors, textures, and details are super crisp and beautiful. You can almost feel the depth between the foreground of the tree and the background of the valley and sky.

Here is a JPG of the same photo that has been re–saved just four times. As you can see the quality gets grainier. The clouds are no longer "soft and flowing" across the sky. Details in the leaves have become pixelated and boxy like images from Minecraft. The depth of the photo has also flattened out quite a bit leaving very little distinction between foreground and background.

Using first-off JPG's are fine for blogs and online use but if you want to have a quality photo and you have the ability to use a PNG instead, I highly recommend it.

What do you think? Can you tell the difference between the two?

You Might Also Like: