LOADING

File Formats and When to Use Them

by karen June 11, 2020
Layout of the file formats

It can feel like another language when tech-savvy people start talking about file formats: Vector files… Raster files… jpg… png… gif…. what does it all MEAN?

We have pulled together some definitions and information to help you better understand file formats and when to use them. Consider it “File Formats 101.” Because depending on the project, the file format can make or break the outcome!

First, you need to understand the difference between a vector and raster file:

 

What is a VECTOR file?

A vector file is a computer graphic that uses mathematical formulas to render its image, instead of using pixels like a raster file. No matter how big or small you make a vector, it will always look as sharp as the original. Meaning you can make it as small as a stamp, or big enough to put on a billboard, and it will not distort.  

Another great advantage is that vector files let you to manipulate its colors, shapes, sizes, layout and more. The only downside of vector files is their compatibility; you must open them in a vector-based design program such as Adobe Illustrator.

Common vector file extensions are AI, EPS, SVG, and PDF.

What is a RASTER file?

A raster file is a computer graphic made up of pixels. They are resolution dependent, meaning the image displays properly at a certain dimension, but anything bigger will stretch the pixels and make it blurry. In order to retain pixel quality, you cannot resize raster images without compromising their resolution. As a result, it is important to remember to save raster files at the exact dimensions needed for its use.

Raster files are best used for highly detailed photography or digital applications.  Pay attention to the resolution of the file to determine what you can use it for. 

Common raster file extensions are JPG, PNG, GIF and PSD.

 

Now that you have an understanding of vector and raster files, let’s move into the file formats that are associated with those type of files and when to use them.

Common File Formats

 

JPEG (or JPG) – Joint Photographic Experts Group

JPEG images have a sliding scale of compression that decreases file size tremendously, but increases artifacts or pixelation the more the image is compressed. They are commonly used across the web and in print when at a high resolution, like in photography. Keep in mind that these files don’t have a transparent background and are not suitable when needing to be placed on a color background or image. 

FYI… JPEG and JPG are the same thing. JPG was used in the old days of Windows as it was limited to 3 letters for the extension.

WHEN TO USE: Web graphics/images, Internal Office Documents

PNG – Portable Network Graphics

PNGs were created as an alternative of Graphics Interchange Format (GIF) and use lossless compression which means when compressed it is restored back to its original form without any loss. PNGs have some great features like containing 24bit RGB color palettes, greyscale images. And unlike JPEG files, PNGs can be saved with transparent backgrounds. Keep in mind, due to the lossless compression, PNG files can be bigger in size so don’t use unless necessary.

WHEN TO USE: high-quality images, need for transparent background

PSD – Photoshop Document

PSDs are files that are created and saved in Adobe Photoshop. This type of file contains “layers” that make modifying the image much easier to handle. The largest disadvantage to PSDs is that Photoshop works with raster images as opposed to vector images. So keep in mind to work in the biggest size that is needed as you can always scale down. Enlarging will lead to distorting.

WHEN TO USE: Image editing and professional design & web projects

GIF – Graphics Interchange Format

GIFs are a very widely used web image format, typically for animated graphics like the ones your social media friends keep posting. Due to their limited number of colors, the files can be reduced greatly. 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.

WHEN TO USE: creating web animation, need a small file for the web or a transparent background

PDF – Portable Document Format

A PDF is a universal standard file format that can display both vector and raster graphics, on any computer, with anyone, anywhere. If a designer saves your vector logo in PDF format, you can view it without any design editing software. Use this file format for preparing a design for print or for displaying your vector graphics on the web.

WHEN TO USE: Document viewing and sharing, print-ready files

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. This file format is a standard way of exporting vector designs because it can easily be transmitted between design programs and users without data loss.

WHEN TO USE: Sharing with other designers, professional printing, promotional products, screen printing, embroidery and signage

AI – Adobe Illustrator Artwork

AI is a vector file which is the most reliable type of file format for using images in all types of projects from web to print, etc. Adobe Illustrator is commonly used to produce this type of file. These files are also version-dependent, meaning the same file will be viewed differently across distinct versions of Illustrator.

WHEN TO USE: When working with designers

So don’t forget to ask your vendors what type of file they need to create your project. You want the finished project to look good, and providing the proper files for them to work with is the first step in reaching that goal!

Social Shares

Related Articles