Graphics File Formats Demystified

Ever wonder when to use what file format and why a printer will not output from a .gif and a web designer cannot use your .eps?

Here is a listing and explanation of common files and the common uses of each:

First off, to fully understand the differences there are 2 terms that need to be defined; Vector graphics and Raster graphics.

A vector graphic is any graphic that is based off of math which in turn makes vector graphics resolution independent. What all of this printer babble means to you is that if you are using a vector graphic, you can stretch it or enlarge it to any size imaginable and it will still output nice and sharp because the graphic just recalculates the math. Another advantage of a math based graphic is small file sizes.

A raster graphic is a totally different story. Raster graphics are based off of pixels which are basically small chunks of information. For this reason, raster graphics are resolution dependent which means that there is a set amount of information contained in the graphic. If you enlarge the graphic, no real new information is created; which is the reason you see pixels and graininess in printed graphics that do not have enough resolution.

.ai – This is Adobe Illustrator’s native file format. Adobe Illustrator is the most popular vector graphics creation program and .ai files support layers. If your designer is using other Adobe programs for print and/or web design (such as Indesign CS4, Dreamweaver CS4 and/or Flash CS4) .ai files can be imported directly into those programs which makes this a good, high quality file format for your logos for use in print or on the web. Just be sure that that you convert all of your type to curves beforehand. Also, please note that in the final code that is uploaded to your webserver, an ai will be converted to a .jpeg or .gif by Dreamweaver.

.eps – This is also a vector file format and it stands for encapsulated postscript. Postscript is a computer language made to send to output devices such as printers, imagers etc. This is a high quality file format for print and mainly used for logos and similar graphics. Unfortunately, postscript does not display on your computer monitor very accurately so an eps is not a good choice for web graphics. Please note that this is not to be confused with a Photoshop eps which is a raster file format and not vector based.

.tiff – This is the preferred raster file format for printing. A .tiff is preferred for printing because it is considered a lossless file format which means there is not a compression system applied to the graphic that throws away your precious data upon saving and/or opening. Basically, all of the original information captured by the native device is maintained and preserved unless purposely edited. However, because of this, .tiffs will often have large file sizes which makes it a poor choice for use on the web which prefers optimized images with the smallest file sizes possible. Tiffs also support layers.

.jpeg – This is considered a lossy raster file format which means, you guessed it, it applies a compression to graphics that does throw away your data upon saving. Some images are high enough quality that throwing away some original data will not make a visual difference especially with today’s high resolution native capture devices. However, on images that you want or need to preserve all of the data possible and get the best quality out of, this is not a good choice. We can output files with placed jpegs with no issue, however do keep in mind that every time a jpeg is opened in a program, edited and saved it throws away data. This quality makes jpegs file sizes a lot smaller than .tiffs which in turn makes it a preferred file format for use on the web.

.gif – This is considered a lossy raster file format just like the jpeg. A gif can only have a maximum of 256 colors which makes is a low quality image file format that is not acceptable for use in print. Gif files are popular for use on the web due to their ability to display simple images well  with very small file sizes. Gifs can also contain simple animations and transparency.