Blog / Image File Type Cheat Sheet

When you’re putting an image in an email, website, or printed product, it can be hard to figure out which file type to use. Worry no more! You’re about to find out the difference between the most common file types and when to use each.

The infographic above breaks down the basics, so save it somewhere for a handy reference. You can read on for more details on each file type. (Can you figure out which type of file the infographic is?)

Before we get started, let’s go over some image terminology.

• File size: For email and website use, file size is important. Larger files take longer to download, which is a big no-no for a website.
• Compression: Saving an image as a different file type will make the file size smaller. This is called compression.
• Resolution: This refers to how clear an image is. Measured in dots per inch (DPI). Higher resolution means sharper image, but also a larger file size.
• Lossless and lossy: When you compress an image, the quality decreases. This can mean lower resolution or fewer colors. The amount of decrease in quality is called “loss.” Lossless means no quality is lost, and lossy means some quality is lost.
• Bits: Color in images is measured in bits. More bits means more color possibilities. For example, 8-bit color creates 256 possible colors, while 32-bit creates over 16 million possible colors.

You’ll understand why all this technical stuff is important when we look at the different file types. Each file type has different levels of the compression, colors, etc.

Ok, now that the technical stuff is out of the way, let’s get to more technical stuff!

The following are the most common file types you’ll see on the internet and in print.

• JPEG or .jpg: This file type is used on the internet and in email. Photographs taken with a basic camera are usually .jpg. You will experience some loss of resolution and color, depending on how much you compress the image. Since JPEGs can have a relatively small file size, it’s great for the web and can make for some fast-loading images on your website that still look decent.
• PNG or .png: Similar to JPEG, but with fewer color bits (which means fewer possible colors). PNGs can be very small in file size, especially when used for graphics that are entirely made of colors and lines—think clipart or logos. However, with high-resolution photos PNGs sometimes end up making a large file size. You would be better off with a JPEG in that situation. PNGs are the best file type if you want to remove the background from your image.
• GIF or .gif: This is the only file type that can be animated, albeit with a duration of just a few seconds. It’s also the smallest file type. That small file size comes at a cost of image quality and color options. But if you need an image to load super fast on a website or need some cool animation, GIF is the way to go.
• EPS or .eps: While JPEG, PNG, and GIF are great for web use, EPS is better suited for printing. An EPS file can be shrunk or enlarged to any size you can think of, and it will still look sharp and clear. This is because EPS images are built with mathematical formulas that tell a computer how to form the shape. When the image is resized, the computer just recalculates the formula and maintains the full resolution. This file type only works for images made of colors and shapes, not for photographs.
• TIFF or .tiff: You probably won’t see this type of image unless you’re a professional photographer. TIFFs maintain very high resolution and color accuracy, but that also means big file sizes. You wouldn’t want a TIFF on your website, because it would take forever to load. But in a printed product like a brochure, TIFFs are a great option to make photos look realistic.

File type rules of thumb

For the web:

• Photographs – use JPEG
• Logos or clipart-type graphics – use PNG
• Animated images – use GIF

For print:

• Logos or graphics – use EPS
• Photographs – use TIFF

By now you should understand the various image file types and where to use them. If you found this helpful, follow us on Facebook. We share lots of useful information to help you market your business.

PS: I’m sure you’ve been dying to know what file type the infographic is. It’s a PNG! Hope you guessed it right.