A tutorial by Art Director and founder of Pure Works Studio, Victoria Jordan
Stock images are great for any range of projects, but certain projects require specific file formats. In this tutorial, we’ll go through the best formats for print and web, as well as some of the advantages and disadvantages of those formats using this illustrated silhouette by contributor
Robert Hillman, aka “Tawng”

Photos…
Photos are made up of pixels (A.)
Because photos are made of pixels, a photo can only be as big as it’s original size.
Photo formats can be used in print, web and animation.

GIF
• One of the standard formats for online use
• Can have a transparent background, meaning it can float over any color without having a white box around it. Let’s say the boy with birds image was a background for my website and I wanted to add my logo, I’d use a gif (or png) so as not to get a white background around the bird. (B.)

• Animation option. (C.) Animated GIFs are like flipbooks; they use a sequence of images to create the illusion of movement. Often used as Twitter icons or as email signatures.

• Visible online, in emails

JPEG
• One of the standard formats for online use
• Compressed file
• Cannot have a transparent background
• Visible online, in emails

PNG
• One of the standard formats for online use.
• Compressed file
• Very similar to a GIF, though it lacks the option for animation
• Can have a transparent background
• Visible online, in emails

TIFF
• Standard print format
• Sometimes compressed, but much less than the GIF, JPEG or PNG)
• Can have layers – so it can be easy to edit
• Can have a transparent background
• Visible in print
• Significantly larger in file size than JPEG and other formats

PSD
• Photoshop native file
• No compression
• Can have layers – so it’s easy to edit
• Can have a transparent background
• Visible in print

Illustrations/Vector Images
Illustrations are made up of points (D.)

Because illustrations are made of points, a vector image can be any size, thus, it’s the recommended format for branding marks and logos.
Vector formats can be used in print and animation.

AI
• Illustrator native file
* No compression
* Fully editable
* Visible in print

EPS
• EPSs can be created in photo and vector programs and can only be edited in the type of program they were created in.
• Visible in print

PDF
• PDFs can be created in multiple programs and editability depends on where it was created.
– If a file is created in a vector program, then it will only be editable in a vector program.
– If a file is created in a layout program it may not be easily editable in a vector program and it won’t be editable in a photo program.
– If a file is created in a photo program, then it will only be editable in a photo program.
• The PDF format was created so that everyone can open them, thus it’s the perfect format to send out to people when you’re not sure what platform (Mac or PC) or email client (Entourage, Outlook, etc.) they use.

Here’s a chart to use when you’re deciding what type of images to use/create…

Was this helpful? See Victoria Jordan’s first tutorial: “Preparing an Image for Web vs. Print”

Posted by: