October 12, 2020
File Format header

Your printer says, “I need that in vector.”

Your web designer says, “Can you get me a low-res jpeg of that image?”

Your social media marketer says, “Do have your logo in a transparent PNG?”

And you’re like…

via GIPHY

In a world of JPEG, PDF, PNG, EPS and GIF (wait… is it GIF or JIF?), things can be super confusing! Let me try to explain them all and hopefully next time someone is asking you for a certain file format, you’ll be able to respond with “No problem - Here you go!”

 

Raster vs. Vector

Raster images are made up of a grid of pixels, or blocks of color that all come together make an image.  Think Minecraft. Each pixel has certain proportions, so the image looks great - crystal clear. But if you stretch or shrink that image from its original size, you often end up with a pixelated look - blurry or blocky looking.  Raster files are typically photographs, animation, video, and web graphics.

All raster images can be saved in one of two primary color models: CMYK and RGB.  CMYK is a four-color printing process that stands for cyan, magenta, yellow and key (black). These colors represent the four inks that are used during the printing process. Files saved in this format are meant primarily for printing. RGB is a light-based color model that stands for red, green and blue. These are the three primary colors of light that combine to produce other colors. Files saved in this format are ideal for anything that will be viewed on a screen - computers, mobile phones, video games, television, etc.

Vector files, on the other hand, are made up of points, lines, curves in a specific proportion that is calculated by the computer - instead of using blocky pixels like in raster images. In the more sophisticated vector format, all of the equations that make up a graphic can be adjusted in size infinitely without losing resolution.  You can make create billboard-sized graphics or make them tiny enough to be printed on a pen and the image would look equally clear on both.

So let’s jump into the different file formats!

File Type Description USE FOR DO NOT USE FOR
JPEG/JPG (Joint Photographic Experts Group)

  • Most common image file
  • Go-to, cover-your-bases kind of file

  • Proofing and sharing work-in-progress
  • Web
  • Web banners/ads
  • Social Media
  • Email
  • Print (ensure you have high resolution files!)

  • Transparent backgrounds
  • Versatile pieces where resizing is needed
PNG (Portable Network Graphics)

  • Common image file
  • Smaller file size without a loss in quality
  • Less blur than JPGs when resized
  • Supports transparent backgrounds

  • Web
  • Email

  • Print
GIF (Graphics Interchange Format)

  • Supports transparent backgrounds (but not as well as PNG)
  • Widely used for animated graphics like for social media or texting
  • Smaller file size

  • Web
  • Social Media
  • Animation
  • Print
TIFF/TIF (Tagged Image File Format)
  • Highest-quality image files
  • Scanned documents
  • Professional digital camera
  • Print
  • Photography
  • Large format
  • Web
  • Email
RAW
  • Unprocessed data from a digital camera or scanner’s sensor
  • High-quality image containing both processed and non-processed data
  • Use program, like Photoshop, to adjust color, tints, brightness, etc.
  • Then it is saved as a JPEG or TIFF because it has been processed.
PSD (Photoshop Document)
  • Fully editable design file
  • Can be exported (saved) as a JPEG, PNG, PDF, GIF, TIFF, etc.
  • Creating and editing raster file types
  • Logo design
  • Illustrations
PDF (Portable Document Format)
  • Designed to be easily shared between computers, programs, people
  • Contains text and raster & vector images
  • Retains look (font, images, etc.)
  • Can be editable
  • Digital
  • Print
  • Multiple pages
  • Photography
EPS (Encapsulated PostScript)
  • One of the most preferred formats by digital designers
  • Resolution-independent and infinitely scalable (looks good at any size)
  • Supports transparent background
  • Fully editable
  • Can be exported/saved to various formats (jpg, png, etc.)
  • Print
  • Illustration
  • Logo Design
  • Web
  • Email
SVG (Scalable Vector Graphics)
  • Resolution-independent and infinitely scalable, (looks good at any size)
  • Web
  • Email
  • Print
  • Sharing files (not well known)
AI (Adobe Illustrator)
  • Fully editable design file
  • Can include embedded or linked raster images
  • Can be exported/saved to any format (EPS, PDF, JPEG, PNG, GIF, TIFF, etc.)
  • Logo design
  • Large format design
  • Photography
InfographicBlog-01

Did you ever realize there were so many different file formats for images?  Hopefully, this helps you understand the various image files, and in turn, what formats you can ask for to help your next project!