If you're not familiar with design software like Adobe Illustrator, InDesign or Photoshop then things like file types, web and print formatting, resolutions and color systems can all be SUPER intimidating and just all around confusing. You may find that you save a million files and while they may be ok, none of them seem to be exactly what you need. This leaves you trying to Google your way to some sort of solution when all you're really asking for is:  easy ways to get your print and web materials looking professional, something that you're proud of and eager to show off... Is that too much to ask? Absolutely not! 

To help you avoid a mental breakdown I've put together a guide to give you the ultimate insight into the many different file formats, sizes, color systems and software programs and hopefully alleviate current and future design file frustrations.

Raster Vs. Vector: Which Is Which?

RASTER: Raster graphics or bitmap images are composed of tiny squares of color known as pixels. These pixels make up every raster graphic and work best for images or web-based graphics. Because raster files have a set number of pixels, anytime you resize them or stretch them to fit a space they weren't originally sized to fit you'll run into pixelation or fuzziness aka the breakdown of the file's resolution. It's important to have these files sized specifically to fit the exact type of project or piece you're working on.

used for: digitized photographs, scanned artwork, computer/web graphics or designs,

file types: .jpg, .png, gif, .tif, .psd

VECTOR: Vector graphics are made up of lines and curves known as paths and constructed through mathematical equations. Vector graphics are infinitely scalable, usually smaller in file size and do not lose their quality. Your logo and any brand graphics like icons or illustrations should always be created in vector editing software like Adobe Illustrator and directly saved from the program in a vector file format. 

used for: fonts, icons, illustrations, logos, graphics, print designs

file types: .eps, .pdf, .ai


best used for raster...

JPEG: JOINT PHOTOGRAPHIC EXPERTS GROUP - A standard file type. Typically used for high res photographs and low res web-based images. Not recommended for print. If any type of graphic is saved as a jpeg it will always have a white background. 

PNG: PORTABLE NETWORK GRAPHICS - Another standard file type but best used for text, graphics, or logos on the web. High quality and larger file size. Files will save with a transparent background. It's recommended that you do not scale these files larger than they were originally sized for. 

GIF: GRAPHICS INTERCHANGE FORMAT - These are commonly used as animated files used online. GIF's can have transparent backgrounds, but are low in size and lower in quality than a PNG.

TIFF: TAGGED IMAGE FILE FORMAT - A standard print-ready file. TIFF files are very large and can't really be used online. May have layers and the quality won't be compromised if compressed. These files are usually the ones sent to professional printers. 

PSD: Image based file created solely from Adobe Photoshop. These files are working files and used only for photos, image-based graphics and web designs. These files contain layers, masks, filters and text. These files are not for direct web or print used. 

best used for vector...

ESP: ENCAPSULATED POSTSCRIPT FILE - Creates vector files and is used for design elements like illustrations and graphics and also logos. Can be scaled infinitely without losing the file's quality. Considered print-ready but not best for web use.

PDF: PORTABLE DOCUMENT FORMAT - Used to share documents or designs without losing quality. Great way to display logo previews or a digitized version of a print piece. These files can be embedded online and are many times are the preferred file for print professionals. 

.AI: Graphic based file created solely in Adobe Illustrator. These files are working files and used only for graphic and illustrated vector designs. They are scalable in an EPS or PDF format. These files contain layers, effects and text. These are not used for web. Best used for designing logos, illustrations, graphics and icons.

INDD: Print-based file created solely from Adobe InDesign. These files are working files and used to produce print based projects like newspapers, magazines, books, brochures, and newsletters. These files contain things like page content, layers, formatting information, images, and text. These files are not for web.



DPI: DOTS PER INCH - DPI refers to the number of physical dots of ink per inch. 300 DPI is the universal standard for printing. The higher number of dots per inch the smoother the image and blend of colors. 

PPI: PIXELS PER INCH - PPI refers to the number of pixels or physical elements per inch. 72 PPI is the universal standard for digital screens and web. PPI also determines image quality. The more pixels per inch the sharper the image. 


High Res: 300 DPI (Dots Per Inch) - Standard resolution used for paper printing.

Low Res:  72 PPI (Pixels Per Inch) - Standard resolution used for web and screens. 


CMYK: CYAN, MAGENTA, YELLOW AND BLACK - Used during the printing process to create the colors of the document. An additive projected light color format - All colors begin with black. 

RGB: RED, GREEN AND BLUE - Best suited for monitors, and screens.  A subtractive reflected light color format. All colors begin with white.


Illustrator: A vector graphics editor for logos, icons, graphics, drawings, typography and illustrations.

Photoshop: A raster-graphics editor and manipulation software for images and digital art. 

InDesign: A publication software used to create print and digital publications like posters, flyers, brochures, magazines, newspapers, presentations, books, etc. 

What's the most challenging or confusing part about formatting files? Which section did you find most helpful? Tell me in the comments below!


L. Rae Design is a client-centered creative company specializing design, brand development and social.

e: lauren@lraedesign.com

p: 252.515.0521



Follow L. Rae Design on Facebook


These will be short entries that you can read and get a quick dose of positivity. If you feel more motivated, encouraged and can move forward in your day with a better sense of purpose and confidence - all the better! 


L. Rae Design Questions



Name *