There are hundreds of file types, but here are several that designers and printers work with most often, as well as some helpful terms. Select a button to learn about that file type.
WEBPJPGPDFEPSZIPTIFGIFPNGAIINDDPSDSVGHTMLCSSJS
Helpful Terms
Vector Art
A graphic based on a mathematical formula which allows scaling at any size without loss of quality, such as a logo. Common file types used for vector art: eps, .ai, or vector-based art saved as a .pdf
Raster Art
A graphic based on pixels, such as a photograph. When enlarged beyond its actual size, loss of quality will be visible in the form of pixelation/blurriness when the pixels become more apparent. Common file types used for raster art: .jpg, .png, .gif and .tif
Pixels
Dots (squares) of various illuminated colors that compose an image on display screens.
DPI or PPI
Dots—or pixels—per-inch determine the resolution of an image by how many pixels are in a square inch. “Dots” refer to specks of ink that printers produce. Pixels are digital measurements for on-screen viewing.
Resolution
Essentially, resolution refers to the clarity of an image. 300dpi is considered print-quality resolution, needed for printing images that require a higher quality, such as an advertisement or professional photo. 72ppi is considered screen-quality resolution, which is used primarily for images on the Web. 72dpi is not recommended for printing.
Some File Types Designers Use
WEBP
Means: Web Picture Format
Description: Excellent choice for both images and animated images. WebP offers much better compression than PNG or JPEG with support for higher color depths, animated frames, transparency, etc.
Primary Users: Web Designers
JPG or JPEG
Means: Joint Photographic Experts Group
Description: Standard image format that works well for either print or Web, though, not ideal for saving high-quality image files and cannot maintain transparency. Background must either be colored or defaults to white.
Primary Users: Everyone
Means: Portable Document Format
Description: Used for saving and sending files in a cross-platform format that can be viewed on multiple computers. Great for sending high-quality print files and vector art, such as logos. Can also maintain a transparency.
Primary Users: Everyone
EPS
Means: Encapsulated PostScript File
Description: Used for sending and editing vector art between multiple programs. Can also maintain a transparency.
Primary Users: Graphic Designers Printers
ZIP
Means: Zipped File
Description: Used to compress large files and folders for easier sending. To open, file must be “unzipped” by right-clicking on the file.
Primary Users: Everyone
TIF or TIFF
Means: Tagged Image File / Tagged Image File Format
Description: Used for saving and printing high-quality image files. Allows layering of different content and can also maintain a transparency.
Primary Users: Graphic Designers Photographers Printers
GIF / Animated GIF
Means: Graphical Interchange Format
Description: Used for saving smaller image files with a limited amount of colors for faster loading on the Web. Can also maintain a limited transparency. Animated GIFs contain many layers. The file loops through each layer creating a motioned effect that appears like a video, but much smaller in size.
Primary Users: Web Designers
PNG
Means: Portable Network Graphic
Description: Similar to a GIF, it’s used for saving image files, but allows for higher color output, like a JPG. Can also maintain a transparency. Intended for small or large images on the Web.
Primary Users: Web Designers
AI
Means: Adobe Illustrator File
Description: Used for creating and editing vector art in Adobe Illustrator. Also allows exporting graphics to EPS, PDF and SVG file formats.
Primary Users: Graphic Designers Web Designers Printers
INDD
Means: Adobe InDesign Document
Description: Used for creating and editing page layouts in Adobe InDesign. Contains formatting, content, styles, and linked files. Used for desktop publishing to create books, magazines, newspapers, flyers, etc.
Primary Users: Graphic Designers Printers
PSD
Means: Adobe Photoshop Document
Description: Used for creating and editing images in Adobe Photoshop. Allows layering of different content and can export graphics to raster images such as JPG, TIF and PNG file formats.
Primary Users: Graphic Designers Web Designers Photographers Printers
SVG
Means: Scalable Vector Graphics
Description: Used for graphics needing to be scaled at any size on the Web. Particularly ideal for icons as they maintain perfect quality at rather small file sizes. Any vector-editing program, such as Adobe Illustrator can open and create these files. They can also be manipulated to produce certain graphic animations.
Primary Users: Web Designers
HTML
Means: HyperText Markup Language
Description: This file is the basis of a web page. Web browsers read the “language” contained in these files and output the information on a screen. Any browser program can open these files.
Primary Users: Web Designers Everyone
CSS
Means: Cascading Style Sheet
Description: Web designers use these files to create the visual appearance of a web page and ensure that information is displayed correctly. This file language helps define font, size, color, spacing, border and location of HTML information on a web page and is responsible for the “style” of a website.
Primary Users: Web Designers
