Should You Use PNG, JPEG, or GIF? Here’s How to Choose

Published on January 16, 2015

When it comes to creating and saving images, most average users face some confusion when it comes to choosing the right file type.

Really, what is the difference between a PNG, JPEG, or GIF file anyway?

Most of the time, users just pick one and hope for the best. Sometimes this option works out, but during other times, it can prove a disastrously wrong decision - both in terms of aesthetics and file size.

How should you avoid making those mistakes? Here is some great information that provided which can help you figure out which file type works best for your situation.

1. JPEG (.jpg or .jpeg)

It stands for: "Joint Photographic Experts Group", coined in 1986

Best uses:

  • Still images
  • Real-world images (like photos)
  • Mediums which require complex colors, and the ability to have an extensive ability to shade light and dark

JPEGS are known for:

  • Reducing file size
  • Creating 60-75% image compression
  • Creating a small file size
  • Platform compatibility (PC and Mac, Web Browsers, image editors, etc.)
  • Ability to display millions of colors

2. GIF (.gif)

It stands for: "Graphics Interchange Format", coined by CompuServe in 1987

You may have hear GIFs pronounced "jif" of "giff" (like gift).  The correct pronunciation is the one chosen by choosey moms everywhere - "JIF".

Best uses:

  • Animations
  • Web graphics with a limited color palate
  • Small icons
  • Simple images (i.e. line drawing, single-color borders, cartoons)

GIFs are known for:

  • "Dithering" - a process of combining two pixel colors into one to reduce number of colors needed
  • Lossless compression
  • Single-bit transparency (one color can be chosen to be transparent)
  • The ability to be animated
  • Can be interlaced via "progressive loading", first showing a low-quality version and then a better-quality version when detail is able to be added

3. PNG (.png)

In stands for: "Portable Network Graphics", designed in the mid 1990s as a blend between GIF and JPEG formats.

Best uses:

  • Web images (like logos) that involve transparency and fading
  • Images in the middle of the editing process
  • Complex images, like photographs
  • When file size is NOT an issue (aka not the best file for all of your online images)

PNGs are known for:

  • Lossless compression (no data lost when saved)
  • Two different saving abilities:
    • PNG-8: Similar to GIF (but smaller); 256 colors and 1-bit transparency
    • PNG-24: Similar to JPEG (but larger); 16 million colors
  • Alpha-channels, allowing transparency to be set on a scale between opaque and completely transparent, retain original appearance despite color backgrounds
  • These images have some trouble with older browsers (due to alpha-channels)

Be sure and take a look at the original infographic from here!