.PNG vs .JPG: What’s the Difference?

What’s the difference between a .jpg and a .png? Loss, mostly. Picture this: it’s 2005, you’re online, and you go to save a funny image to your family computer so you can send it to a family member later. The image saves, but when you go to open it again, you notice the image is a little grainier than it had appeared on the website. You shrug and brush it off since the image is still clearly legible, but then that family member does the same thing: they save the image from your email to send it to a friend they have across the state. That friend opens it, and it’s a little grainier than before. Repeat. Add grain. Repeat. Add grain. Eventually, the picture is a mess: seemingly random squares of color and gray splotches are everywhere, and the colors in spots that aren’t all glitchy are different. So what happened?

Under Compression

Data needs to be compressed before it can be taken to or from places on the computer. Compressing the file means it takes up less storage space, which improves response time. However, there are different methods of compression depending on what kind of content you’re dealing with. Lossless compression replaces long bits of data with shorter bits, while lossy compression deletes bits and pieces outright. If you open a losslessly compressed file, it is put back together exactly as it was; lossy files are still missing pieces.

The Curse of the JPG

Certain image formats are more focused on storage space than on the quality of the image. Generally, most people don’t have a problem with this, since saving an image once to send it somewhere (or hang on to for reference) doesn’t cause too much loss. Loss in photo terms means that some of the information in the photo was, well – lost. Jpgs can normally get away with this at first; lossy compression, after all, looks for unimportant parts to delete first during compression. At worst some of the shadows might get a touch harsher and some of the lines a little blurrier. If it’s saved again as a .jpg, it’s compressed again and more data is lost from the image, blurring it a little more every time, which leads to that unique “.jpg rainbow” sometimes seen around text that was black but slowly turned red, blue, and green.

The PNG Files

Fun fact, .png files were actually made to replace .gif files, which were patented by UNIX at the time. Copyright gave us a better photo format, as .gif files aren’t fantastic at recreating colors accurately. A .png is better suited for basically everything else except for storage space, which is a small trade-off if you’re trying to make graphics for things that you sell. Company logos, professional headshots, images that may need to be resized larger – all of these are better saved as a .png.  .png files also have the benefit of transparency, meaning that there’s no white square hiding behind the image if that’s how you saved it, like there would be for .jpg files no matter what you do. Long story short: .png is better for graphics that have to look a certain way, and .jpg is better for casual photos that are allowed to get a little blurry. Sources: https://shuttermuse.com/glossary/lossy/ https://www.techwalla.com/articles/why-is-file-compression-important https://www.techsmith.com/blog/jpg-vs-png/