- Image file formats can be roughly divided into three types: raster, print and vector.
- The various formats lend themselves to different uses: print versus web, as well as the size at which they need to be displayed
- Always check with your printer, developer, vendors and other team members to see which file type they prefer or need.
If you’ve worked with a graphic designer, you’ve probably been asked what image format you’d like your project to be delivered in. Perhaps you weren’t sure of the answer because you actually have no idea what the difference between JPG and TIFF is.
Feeling confused about all the different file types? This article will help you talk to your designer with confidence.
What is an Image Format?
On some level, you’ve probably encountered different types of image files. You see the file name extension on your vacation photos, you’ve noticed that your web team requests certain file types, and we all know what a GIF is.
The various formats reflect the various uses for the file, as well as how the image is rendered on a computer. In a nutshell, it’s how a computer translates the image data into something that you can actually see.
Each format lends itself to different uses. Before we get into the details, it’s important to know where the image will be used (web versus print). Image formats can also be divided into two main types, based on how the image is rendered: raster versus vector. To know which image format you require, you need to know where you’ll be using the image and which type you need.
Raster Files
A raster is what most people think of when they hear the words “image file.” Also called a bitmap, a raster renders the image via a collection of pixels. The sharpness of the image and the size at which it can be rendered are determined by the raster’s resolution. This is described as “pixels per inch” or “dots per inch.” If you’ve ever seen a blurry, pixelated image on the web, that’s because (a) the image was compressed (i.e. pixels were removed) and (b) the image is being displayed at too large a size for its resolution.
Common Raster Image Formats Include:
JPEG/JPG
Probably the most common image file type, JPGs are produced by many cameras and smartphones. They work with most applications, and because they have a relatively small file size, they can be easily emailed, uploaded to the web, or posted on the web. Plus, they can be printed at high-quality if the files are not compressed.
However, if you reduce the file size, JPGs undergo “lossy compression,” in which pixels are removed. This is why if you email a photo or download it from social media, it’s usually not suitable for printing at a large size.
PNG
If you’ve worked with web developers, you’ve probably heard the term PNG. This image format is specifically meant for screens, so if you need photos for print publications, steer clear of PNGs. For digital use, the PNG format has several special features: (a) they can be shrunk via “lossless compression,” which helps prevent the dreaded pixelation, (b) they allow transparent backgrounds, which is great for overlaying images on websites, and (c) they support a wide range of colors. They do tend to have larger file sizes than JPGs, so check with your web developer on which format would be better for your website.
TIFF (Print File)
In the world of print media, TIFF is a popular image format because it preserves a lot of information in the image. For example, an illustration meant to be published in a magazine will likely be delivered as a TIFF. This ensures that all layers, colors, and other details of the image will render properly in print. As you might expect, these files are massive.
Vector Files
Unlike a raster, a vector image does not use pixels. Instead, the image is generated via mathematical formulas that tell the application how to display it. The primary advantage of this delivery method is that the image can be scaled — from a tiny corner of your website to a massive billboard. This benefit means that logos, wordmarks, and other key branding elements are often delivered in vector formats, so that they can clearly rendered at any size, anywhere.
Common Vector Image Formats Include:
EPS
This format is declining in popularity, but in case it makes an appearance, it’s good to know. An EPS file can contain vectors alongside rasters and text, and it’s easy to convert the vectors into rasters, e.g. for sharing on social.
Many people use EPS files to deliver logos to other parties, especially if they aren’t sure whether the image will be used in print or web. The nice thing about EPS files is that they ensure the image retains its proportions and resolution.
SVG
The most commonly used vector for web development, SVG files are essentially text files that appear as images. That means that developers can code them into a site and even style them with CSS.
They’re relatively small in file size, but can be scaled up to whatever proportions are needed. This benefit makes SVGs an excellent way to display logos and wordmarks in responsive web design.
AI
This format’s a little tricky, because it’s actually a file format for the Adobe Illustrator application source file, which vector graphic designs are created in and its the source file that a designer uses to save all the other formats listed above, from.
Its industry standard for creating vector logo files, and other graphics (it can contain non-vector image elements, such as rasters and text that don’t need to be blown up for projects like flyers and posters, etc..) and it’s a popular means of transmitting vector files because designers and developers can edit and extract the assets they need without fear of losing information.
Wrapping Up
There are other image file formats as well, including the ever-popular GIF, but the six described above are the ones you’ll encounter most often when working with designers. As you can see, it’s important to know how and where your image will be used.
Designs that need to be placed everywhere, such as your logo, are usually delivered as vectors (although many designers will also provide you with web-ready PNGs or JPGs). So, next time you’re asked how you’d like your project delivered, you can answer with an informed perspective.