There are 2 basic categories of file formats for images, and they relate to end-use: print and web. The key differences between print and web images are resolution measurement and color mode. Within the 2 categories are 2 core types of images: raster and vector. Raster images, otherwise known as continuous tone or photographs, are composed of tiny squares (pixels) which lose resolution when scaled up in size. Vector images are composed of connected lines and curves, which are “resolution-independent” and can be scaled up or down without losing quality; these object-oriented, mathematically-defined images are best used for logos, type, and illustrations.
Print images
Characteristics
- high resolution — 300 ppi (pixels per inch) or higher
- CMYK color mode — also called 4-color process. The 4 colors of CMYK (Cyan, Magenta, Yellow, Black) can be mixed to achieve a full range of color. There is some variance in the colors produced with cmyk mixing.
- Spot color — a premixed, standard ink selected from a numbered list provided by the ink vendor, which is most commonly the Pantone Matching System (PMS) in the U.S. and Toyo Ink in Europe. Since the spot color is premixed, it uses only 1 plate (vs. 4 plates for a cmyk mix of a similar color) and does not change from page to page during the print run.
Common file formats (all without compression)
- TIFF — (Tag Interleave File Format) — This is THE best file format for high-quality, continuous-tone photography intended for print. It can be used on both Mac and PC platforms. LZW compression is an option (lossless), but BE SURE TO DE-SELECT the LZW and re-save the file when importing it into a document being prepared for print. TIFFs with LZW compression can corrupt Quark and InDesign files.
- EPS (Encapsulated PostScript) — Can be used for both raster and vector images, and was considered excellent in its heyday. But, not always readable on PCs, EPS is being phased out and replaced by PDF.
- PDF (Portable Document Format) — The excellent, new, open standard format is readable on virtually all platforms. It preserves all of the file information beautifully.
- PSD (Photoshop Document) — The working source file for raster images in Photoshop.
- AI (Adobe Illustrator) — The working source file for vector images in Illustrator.
Web images
Characteristics
- low resolution — 72 ppi (pixels per inch)
- RGB color mode — (Red, Green, Blue) also called “additive” primary colors because when added together they produce white light. In HTML coding, hexadecimal notations (HEX) are used to define combinations of Red, Green, and Blue color values (RGB). More than 16 million colors can be achieved by mixing RGB.
Common file formats (all with built-in compression)
- JPEG (Joint Photographics Expert Group) — Offers different levels of lossy compression, which means you lose and cannot retrieve data when compressing. Best used for continuous tone images.
- GIF (Graphics Interchange Format) — Supports transparency and animation. Best used for graphics.
- PNG (Portable Network Graphic) — Supports transparency and has much better color quality than GIF.
- SVG (Scalable Vector Graphic) — A vector format for high-quality web graphics.
There are lots of great resources for information on the web, and sometimes it’s hard to sort through all of it. Hopefully, this article clarified the basics of image formats. If you have any questions, please leave a comment and I’ll be happy to help.
Related Posts
How to Create and Edit WordPress Galleries
How to Resize an Image in WordPress
How to Resize an Image in Photoshop
I like this post very much, thank you very much.
Wonderful article, I learned a lot of new things, thanks for sharing this information.