What is the difference between GIF and PNG

What is the difference between JPG, PNG and GIF?

As we continue to build on the old image technology, types of file formats increase, each with its own nuances and uses. JPG, PNG and GIF are now the most common, but what makes them different?

These formats have become the most popularbecause of their compatibility with modern browsers, broadband speeds, and the needs of average users. Join us as we take a closer look at each format and explain the strengths and weaknesses of each format.

JPG (Joint Photographic Experts Group)

JPG was a file type developed by the Photographic Experts Group (JPEG) is said to be a standard for professional photographers. Like the method that ZIP files use to find redundancies in files in order to compress data, JPGs compress image data by reducing image sections to blocks of pixels, or "tiles". The file was created to and not store large photographic image files in a surprisingly small space for photo editing.

JPGs have become the de facto standard image of the Internet because they can be compressed so much. A typical JPG can be compressed in a ratio of 2: 1 up to 100: 1, depending on your settings. JPGs were the only viable way of sending image information, especially when people were dialing into the Internet.

However, due to the lossy nature of JPG, it is not an ideal way to save art files. Even the highest JPG quality setting will compress and change the look of your image, if only slightly. JPG is also not an ideal medium for typography, sharp lines, or even photos with sharp edges, as anti-aliasing often blurs or smears them. What is potentially worse is that this loss can accumulate - saving multiple versions of graphics can result in degradation each time you save. Even so, it's common to save these things as JPG, simply because the file type is so ubiquitous.

The Joint Photographic Experts Group developed lossless JPG technology to address this serious degradation problem. However, due to the dial-in speed and the general lack of interest in high-quality, non-impairing files, the JPG-LS standard has never caught on.

It is possible to download plugins that will allow users to open and save the lossless JPG2000 and some programs such as: B. the preview program from Apple, JPG2000 can read and save immediately.

JPGs support 24-bit RGB and CMYK as well as 8-bit grayscale. I personally don't recommend using CMYK color spaces in JPGs. Also note the grayscale JPGs do not compress almost as much as colored ones.

GIF (Graphics Interchange Format)

GIF, like JPG, is an elderly and generally associated with the Internet as opposed to photography. GIF stands for "Graphics Interchange Format" and uses the same lossless LZW compression as TIFF images. This technology was once controversial (in terms of patent enforcement) but has become an accepted format as all patents have expired.

GIF is inherently an 8-bit color file, limited to a palette of 256 colors that can be selected from the RGB color model and stored in a Color Look Up Table (CLUT) or simply in a "color table". However, there are standard color palettes such as the "Web Safe" palette. One important note is that grayscale images are inherently an 8-bit palette. Saving as a GIF is therefore ideal.

Aside from transparency support, GIF also supports animation, which limits each frame to 256 pre-selected colors.

While GIF is not lossy like JPG, conversion to 8-bit colors is used to distort many images by using dither filters to optically mix or "diffuse" colors, similar to halftone dots or pointilism. This can radically degrade an image or, in some cases, create an interesting effect.

Because of this lossless format, GIF can be used to hold tight lines in typography and geometric shapes, although these things are better suited for vector graphics like SVG or the native Adobe Illustrator AI format.

GIF is also not ideal for modern photography image storage. For small sizes with very limited color tables, GIF images can be smaller than JPG files. However, for most normal sizes, JPG compression will result in a smaller image. They are mostly out of date and only useful for creating dancing babies or sometimes creating crude transparencies.

PNG (Portable Network Graphics)

PNG stands for Portable Network Graphics (or, depending on who you ask, the recursive "PNG-Not-GIF"). It was developed as an open alternative to GIF, which used the proprietary LZW compression algorithm discussed earlier. PNG is an excellent file type for Internet graphics because it supports transparency in browsers with an elegance that GIF does not have. Notice how the transparent color changes and blends into the background. Right click on the picture to see it. This is actually an image that is on four different background colors.

PNG supports 8-bit colors like GIF, but also supports 24-bit RGB colors like JPG. They are also lossless files that compress photographic images without sacrificing image quality. PNG is usually the largest of the three file types and is not supported by some (usually older) browsers.

Not only is the lossless format of 24-bit PNG a great format for transparency, it's also ideal for screenshot software that can be used to reproduce pixel by pixel in your desktop environment.

Which one to use?

These files are, from left to right: 24-bit JPG Compressed, 8-bit GIF, 8-bit PNG, 24-bit full quality JPG, and 24-bit PNG. Notice that the file sizes increase in the same direction.

PNG is the largest image type for larger images, and they often contain information that you may or may not find useful depending on your needs. 8-bit PNG is an option, but GIF is smaller. Neither are optimal options for photography, as JPG is much smaller than lossless PNG with only minimal loss of quality. To save files with high resolution, JPG is compressed in tiny proportions, whereby loss of quality is only visible on closer inspection.

In summary:

  • PNG is a good option for transparency and lossless, smaller files. Larger files, not so much unless you request lossless images.
  • Mostly a novelty, GIF is only useful for animation, but it can produce small 8-bit images.
  • JPG is still the king of photos and photo-like images on the internet, but be careful as your file can deteriorate every time you save.

Picture from Keizersgracht, passing in Amsterdam Massimo Catarinella above Wikipedia, published under Creative Commons License. Derived images are available under the same license. I don't care who created the dancing baby.