Image
Top
Navigation
June 20, 2015

Image file formats and when to use them

Image file formats
Have you ever wondered when you should use a JPG instead of a PNG? Or why your designer insists that a gif file taken from a website won’t work on a print project?

Unless you are a graphic designer by training, chances are you’ve never needed to understand things like what separates a TIF from a PDF or a PSD. While the large variety of image formats may seem overwhelming, there is a method to the madness. This guide aims to help you understand the difference between each file format, and when they are appropriate to use.

Vector vs. raster

First things first, what is the difference between vector and raster?

Raster images are constructed by a series of pixels, or individual blocks, to form an image. JPEGs, GIFs and PNGs are all raster images. Every photo you find online or in print is a raster image. Pixels have a defined proportion based on their resolution (high or low), and when the pixels are stretched to fill space they were not originally intended to fit, they distort resulting in blurry or unclear images.

Vector images are far more flexible. They are constructed using proportional formulas rather than pixels. EPS, AI and PDF are perfect for creating graphics that require frequent resizing. Your logo and brand graphics should have been created as a vector, and you should always have a master file on hand. The real beauty of vectors lies in their ability to be sized as small as a postage stamp, or large enough to cover the side of a building!

High resolution vs. low resolution

DPI stands for “dots per inch” and PPI translates to “pixels per inch.” These units of measure are essential for determining if the density of pixels in an image is appropriate for the application you are using.

The biggest thing to note when determining what DPI or PPI you require is if you are using an image for print or web. Websites display images at 72dpi, which is low resolution; however images at this resolution look really crisp on the web. This is not the case for print. Best practices for printing an image will require it to be no less than 300dpi.

The different extensions & when to use them

JPEG (or JPG): Joint Photographic Experts Group
JPEGs might be the most common file type you run across on the web, and more than likely the kind of image that is in your company’s MS Word version of its letterhead. JPEGs are known for their “lossy” compression, meaning that the quality of the image decreases as the file size decreases.

You can use JPEGs for projects on the web, in Microsoft Office documents, or for projects that require printing at a high resolution. Paying attention to the resolution and file size with JPEGs is essential in order to produce a good looking project.

PNG: Portable Network Graphics
PNGs are amazing for interactive documents such as web pages, but are not suitable for print. While PNGs are “lossless”, meaning you can edit them and not lose quality, they are still low resolution. The reason PNGs are used in most web projects is that you can save your image with more colors on a transparent background. This makes for a much sharper, web-quality image.

GIF: Graphics Interchange Format
GIFs are most common in their animated form, which are all the rage on Tumblr pages and in banner ads. In their more basic form, GIFs are formed from up to 256 colors in the RGB colorspace. Due to the limited number of colors, the file size is drastically reduced. This is a common file type for web projects where an image needs to load very quickly, as opposed to one that needs to retain a higher level of quality.

TIF: Tagged Image File
A TIF is a large raster file that doesn’t lose quality; it is usually used when saving photographs for print. Don’t use this file on the web; it will take forever to load!

PSD: Photoshop Document
PSDs are files that are created and saved in Adobe Photoshop, the most popular graphics editing software ever! This type of file contains “layers” that make modifying the image much easier to handle. This is also the program that generates the raster file types mentioned above. The largest disadvantage to PSDs is that Photoshop works with raster images as opposed to vector images.

EPS: Encapsulated Postscript
EPS is a file in vector format that has been designed to produce high-resolution graphics for print. Almost any kind of design software can create an EPS. It is more of a universal file type that can be used to open vector-based artwork in any design editor, not just the more common Adobe products.

AI: Adobe Illustrator Document
AI is, by far, the image format most preferred by designers and the most reliable type of file format for using images in all types of projects from web to print, etc. Adobe Illustrator is the industry standard for creating artwork from scratch and therefore more than likely the program in which your logo was originally rendered. Illustrator produces vector artwork, the easiest type of file to manipulate. It can also create all of the aforementioned file types.

Working with images is more complicated than at first glance. Hopefully this guide has provided a better understanding of the standard file types and which are most appropriate for your project.

Maybe this article has you wondering which file types of your logo you have on hand? Take a look and if you don’t have an .EPS or .AI file stashed away, I would recommend contacting your designer!

Submit a Comment

Posted By