Image file types

By viktorTutorials
jpeg vs. gif

A lot of people don’t know what file type to use when saving their digital art. I’ve composed a short list of the 3 most common file types used and when to use them. Keep in mind that the pros and cons are sometimes up to debate. A pro for you can also be a con and vice versa. This is a simplified guide and I don’t really go too much in to technical detail but just enough for you to decide what to use and when.

JPEG

Jpeg is one of the most commonly used file types for images today. It uses one of the best compression algorhythms.

Pros:
  • It uses a 16-bit data format that enables 16.8 million colors.
  • Optimal for web use because it uses compression to reduce file size (60-70% is optimal).
  • The human eye can’t see color detail well enough to notice compression, so it can be sacrificed for file size.
  • Compatible with most platforms and software.
Cons:
  • Opening a jpeg and saving it again compresses the file even more. That means an already compressed file gets compressed again and looses even more data and hence on quality.
  • Not suitable for image editing because of compression.
  • Does not support transparency.
When to use:
  • Still images
  • Photographs
  • Web design
GIF

Gif was one of the first formats to be used in web development because of it’s small file size compared to other formats. It also uses lossless compression so it doesn’t loose on quality. It’s popularity is rising today with websites like 9gag, because it’s also capable of displaying animated content.

Pros:
  • Small file size.
  • Offers single bit transparency. One color can be set to be transparent.
  • Can be animated.
Cons:
  • Is limited to only 256 indexed colors and uses dithering to reduce file size (2 pixels combine to make a single color).
  • Png is better because it has even smaller file size and better quality.
When to use:
  • Web graphics
  • Animation
  • Small icons
  • Simple images (line images)
jpeg vs. gif
PNG

Png was actually created to replace the gif file format on the web. It offers quite a few advantages over gif.

Pros:
  • Png-8 supports 256 colors and single bit transparency like gif but at an even smaller file size.
  • Lossless compression, so no data loss (unlike jpeg).
  • Alpha–channels that allow transparency to be set on scale between opaque and completely transparent. This allows for gradual transitions (unlike gif).
Cons:
  • Png-24 supports over 16 million colors like jpeg but at a slightly bigger file size (no data loss due to lossless compression).
  • Big photos and images generate big file sizes.
When to use:
  • Web logos especially if they use transparency.
  • Icons.
  • Images that are being edited.
jpeg vs. png

I hope this short guide can help you out a bit. I usually save my illustrations in PNG-24 because it’s easier to edit later on if I happen to loose the original psd or ai file. Gifs are never used, because of the color loss and I use jpeg only for photos or if I want to post on the internet.

If you like what I do and appreciate my posts and freebies, please consider supporting my work.