What's the Difference Between PNG, JPEG, GIF, and TIFF?

The range of different file types for visual content can make it hard to know which one to use, especially if you’re not a graphic designer. But having a basic understanding of common file types — and when to use them — is a good skill for any marketer to have.

Let’s start by taking a look at four common file types.

Image

The quality of your images on social media, websites, blogs, and presentations influences the perception of your brand — as well as load time and site performance. Knowing which file format to use when will keep your images looking their best and optimize the performance of your digital content

A few definitions to keep in mind

Before we get started, let’s define a few terms that will come up for each file format. 

Lossy vs. lossless

These terms describe the information that is retained in a file once it’s compressed. A lossless compression means that all of the data associated with the original file remains intact and can be accessed. 

A lossy compression reduces the file data permanently, eliminating certain — typically redundant — information to save on file size. Once compressed, the reduced information cannot be recovered, but this information loss is usually not detected by most users. 

Raster images

A raster file is composed of pixels, or tiny dots, that come together to form an image. The more pixels, the better the quality of the image in its original size or larger versions. However, the more pixels, the larger the file size and the more space it will require to store. Conversely, a high-resolution image printed at a smaller size can “squish” the pixels together causing a loss in clarity as well. 

Vector graphics

Vector graphics, also known as scalable vector graphics (SVGs), are graphics consisting of anchored dots connected by lines and curves. Unlike images made of pixels, vector graphics are not resolution independent and can be scaled up and down without a loss in quality or details. 

While PNG, GIF, TIFF, and JPEG files are all raster formats, understanding the difference between raster and vector graphics will likely influence what file format to choose for your projects. 

Knowing that the available file formats are plentiful, let’s take a look at these four common formats and what they can do. 

What is a PNG file?

When to use a PNG file

Choose a PNG format when you need a smaller file that maintains its original quality. PNG files support millions of colors and varying degrees of transparency, and offer better readability than a JPEG or GIF. They are commonly used for websites and are supported by all major browsers and operating systems. 

Common PNG use cases

• Static images
• Infographics
• Logos
• Charts
• Screenshots
• Banners
• Blog graphics
• Other visuals that include text

When to avoid PNG files

Since PNGs are generally larger than JPEGs or GIFs, you’ll need to take this into consideration when choosing which file type to use. If you don’t need transparency, you might be better off using a JPEG. If you do land on using a PNG, consider looking for an online tool like tinypng.com to help compress and optimize your images before placing them into the final design. 

Avoid PNG files for

• High-resolution photos
• Professional-quality print graphics 

What if a GIF file?

When to use a GIF file

The smallest of the four image formats, GIF is a great file type to use if you’re working with small graphics, like banners, charts, and buttons. With compression techniques that limit GIFs to 256 colors, their file size makes for fast-loading visuals. Additionally, a GIF can have transparency (but may leave a white outline on colored backgrounds). And because GIF images keep animation frames and timing information in a single file, they’re ideal for creating short animation, though the dimensions and looping setup need to be taken into consideration in order to keep page load times fast. 

Common GIF use cases

• Simple icons and web graphics
• Web animation

When to avoid GIF files

One downside to GIF files is that they use the 256-indexed color palette, which limits color choice and can leave photos looking flat and lackluster. GIF files are also saved in a single-layer format, meaning all edits are saved into one image layer and cannot be reverted. While a small file size is ideal for presentation and web page load times, GIF limitations should be taken into consideration before selecting this file format.

Avoid GIF files for

• Photos
• Printed images
• Fully editable layered images

What is a TIFF file?

When to use a TIFF file

A TIFF file is a great choice when high-quality is your goal, especially when it comes to printing photos or even billboards. TIFF is also an adaptable format that can support both lossy and lossless compression. This allows each page in a TIFF file to be compressed differently if desired. 

TIFF is best for any raster images that you intend to edit and is relied on to preserve quality. It offers options to use tags, layers, and transparency and is compatible with photo manipulation programs like Adobe Photoshop. If you’re looking for a small file or a web-friendly format, TIFF isn’t recommended. But if you plan to edit digital images in a working storage format, consider TIFF your go-to.

Common TIFF use cases

• Artwork
• Professional photography
• Magazines
• Newspapers
• High-quality printed images
• High-quality scanned documents

When to avoid TIFF files

Because of its large size, TIFF files usually aren’t used for everyday marketing content. While a TIFF file might be the original creative file, it will likely be converted to another format to be used in slide decks, websites, and other marketing materials. 

Avoid TIFF files for

• Web graphics

What is a JPEG (JPG) file?

When to use a JPEG file

Possibly the most familiar of the file formats, it’s commonly used for a reason. It’s often the default setting on cameras, so by exposure (no pun intended) alone, this is the most likely image type users will come across. It also supports a full spectrum of colors, and almost all devices and programs can open and save to the JPEG format — making it the most universal of the four. JPEG files are ideal when you want to keep file size down and don’t mind giving up a little quality to create a very small file. 

Common JPEG use cases

• Online photos/artwork
• Product images
• Image previews
• Social media
• Blog article images
• Some printed photos

When to avoid JPEG files

While JPEGs are a great choice because they keep their file size low, the trade-off is in the details. Compressing the image can interfere with readability so using a JPEG for infographics or charts is not recommended. Also, because JPEGs are a flat file they do not offer transparency, making it difficult to layer these images onto colored backgrounds or other graphics. 

Avoid JPEG files 

• When transparency is needed
• If a layered file is needed

Converting PNG, GIF, TIFF, and JPEG files

As you can see, there are many reasons to choose a specific file format. But what you may not know is that some files can be converted to other formats, making some more versatile than others. 

While designers often use design software like Adobe Creative Cloud to convert files into different formats, other team members rarely have access to these tools and simply use whatever file type they’re given. This can lead to larger-than-necessary slide decks, longer page load times, and bogged-down systems — especially if these files are stored on individual computers or local servers. That’s why many teams use digital asset management (DAM) tools.  

Most enterprise DAM platforms have functionality for users to convert file formats on the fly. This includes converting images, videos, and even audio files into other formats based on the needs of the end-user. These tools also include options to crop and resize, making it easier for marketing and sales teams to get the size and format they need for everything from social media to slide decks. 

While creatives might understand which format a file can be converted to, general users are often not as familiar with this information. That’s why DAM software can be configured to only provide the appropriate conversion options for each asset. So the user can be confident in their file format selection. 

Best practices for DAM admins

We often hear from customers that the most frustrating part of their job is fielding constant requests to locate a file or convert it to a new format. This is time-consuming, disrupts workflows, and limits creativity. But using a DAM platform that allows for self-serve file conversions can make that process much easier. 

Determining which file formats to store in a DAM system is often a collaborative decision between the DAM admin and the creative team. The most common approach is to store the highest-resolution file in the system and then allow users to convert it to the format they need. This ensures the original file is a high-quality asset that can be used and repurposed without needing to be entirely recreated, thus saving time and money. 

Knowing that not all users will need the highest-resolution file, DAM admins can also set permissions to limit the file types users have access to or require a file conversion to a more user-friendly format — instead of allowing everyone to download the original asset. This configurable permissioning structure keeps DAM admins in control and file format usage aligned with best practices.

Bringing it all together

PNG, GIF, TIFF, and JPEG files are designed for different graphic needs. Chances are, you’ll use a combination of all of these formats, depending on the task at hand. Partnering your file format needs with a DAM solution can streamline creative workflows and supply users with the file format options best suited for their individual projects. 

If you’re looking to learn more about using and managing different image formats with a digital asset management system, check out the core features of our platform, Acquia DAM (Widen), or request a demo today to see it in action. 

Note: This article was originally published on Widen.com.