Have you ever gone to save an image and been completely overwhelmed by the seemingly endless options for file types? Welcome to my first two years of design school. I would trade a hefty amount of money if it meant we could have one universal format that worked perfectly for all uses. Unfortunately, it’s not quite so simple.
All image formats are equal, but some image formats are more equal than others — that’s how the George Orwell quote goes, right? Or something like that. Here’s a quick outline to help you understand five common file types and when to use each one.
1. JPEG — A Digital Photograph’s Best Friend
JPEGs are probably the most common file type, and with good reason: they’re supported by virtually all devices, operating systems, and applications. Because JPEGs are fairly small files, they won’t slow down load times on web pages and are easy to transfer. They’re the go-to format for photography to be displayed on the web since they’re great for color preservation.
The downside of JPEGs, however, is that this file format uses lossy compression, meaning the file size directly correlates with the quality of the image. The image discards data in the compression of the file, so in order to keep a file small, you’ll have to sacrifice quite a bit of quality. Each time the image is edited, the JPEG discards more data, so this format is not ideal for files that will need continual editing.
We don’t recommend saving logos as JPEGs unless absolutely necessary, because this format does not preserve line art or text well.
2. TIFF — Your Printing Majesty
Production Designers are held responsible for making sure that all print collateral comes out looking its best, and CMYK TIFFs are vital to making print work shine. TIFFs are known as “print-ready” images, because of their use for high quality printing. Unlike JPEGs, TIFFs are lossless — that is, no data is lost when files are saved and compressed. They have the capacity to support layers (which can later be edited in Photoshop), are able to preserve transparency, and can be saved at an incredibly high quality.
Unfortunately, all of these factors that make TIFFs perfect for print result in very large file sizes. They shouldn’t be used for web images because they slow down load times significantly.
3. GIF — The Ultimate Internet Black Hole
GIFs were initially designed to increase online transfer speed, so they’re extremely compressed files. They can only contain up to 256 colors, which is why they’re not great for preserving photos or any artwork that has a large range of colors. However, they do support transparency, preserve simple line drawings and text well, and maintain pretty small file sizes.
The main advantage that GIFs have over other file types is the ability to be animated. This is typically what they’re used for today. Admit it, you’ve spent countless hours on the internet watching GIFs of uncoordinated puppies falling down and Grumpy Cat being her perfect self. In addition to showcasing adorable animals, GIFs are great for web images that need to load quickly, such as banner ads.
4. PNG — It’s All About Transparency
PNGs were designed based on the GIF file type, which means that they were specifically created for the web. Like GIFs, they only save up to 256 colors. However, PNGs save color information more efficiently. Like TIFFs, they are lossless — they’ll compress your images without loss in quality. They have the capacity to preserve transparency, but at much smaller file sizes than TIFFs.
PNGs are often used on websites due to their transparent capabilities, but since they are generally larger files than JPEGs, they can slow load times when used in excess. They’re most effective when used sparingly on elements that require a higher quality than JPEGs can handle, such as high resolution logos.
5. EPS — Vectors for Versatility
The only file type on this list that isn’t a raster format, EPS is the standard vector file format. These files can be opened and edited with any design program that supports vector graphics — not solely with Adobe products. EPSs provide versatility; they’re print-ready, and ideal for any images that need to be resized (most commonly logos) because the files can be enlarged and shrunken without any loss in quality.
Because they maintain the ability to be manipulated, these file sizes are generally pretty large. Due to their large file size, they are not recommended for web usage. Despite their ability to be edited, EPSs cannot be processed by most programs that aren’t meant for design, such as word processors. They are usually only used by designers and printers.
Summary
The three file types that you should use for web are JPEGs, PNGs, and GIFs. JPEGs are ideal for photography because they’re the best of the three for color preservation. PNGs should be used for art that needs to be saved at a higher quality or requires a transparent background — recommended for logos. GIFs are used for small animations or simple line drawings that can be saved at a lower quality.
TIFFs are perfect for print material because they can be saved at high quality, but shouldn’t be used for web because the files sizes are too large.
EPSs are vector files that are able to be opened and edited with most design programs. Since they can’t be opened by word processors and similar applications, they’re typically only used by designers and printers.
We hope you found this guide helpful in your foray into the wild world of file types. Happy image-saving!
Justie Lim | Junior Production Designer