The ultimate breakdown of file types

Have you ever had a wave of confusion wash over you when a designer asks, “Can you please supply your company logo as a vector file?” Or maybe they need a .PNG file for your website’s header image.

Wait… what on earth is a vector file? And why does Papua New Guinea have a file-type?

As a graphic designer it is extremely important to use the correct file-types for specific applications. Having the incorrect file-type could potentially lessen the desired look you were hoping for.

To help prevent confusion I have put together a go-to list of design file-types that will fill you with confidence and help you understand the difference between a vector and Papua New Guinea file, I mean .PNG file.

What is a raster file?

Icons for .JPG and .PNG files

Raster images are made up of lots of tiny dots (also known as pixels) and are ideal for adding special effects, colour correction and manipulating photos. However, large files can impact loading times and rescaling can produce unwanted blurriness.

.JPG and .PNG are the two most common raster file-types used in the big-wide-world-of-web and here is how they differ from each other:

Joint Photographic Experts Group (JPG)

Used for:

  • File choice for banner ad publishers
  • Medium and low resolution web-use
  • Proofing and sharing work-in-progress design work with clients

Handy to know:

  • Quick load time for web

Constraints:

  • Does not support background transparency
  • Does not retain its quality when rescaled
  • Flat image that is non-editable

Portable Network Graphics (PNG)

Used for:

  • Transferring images on the internet
  • High quality web images

Handy to know:

  • Files can be created with transparent backgrounds (great for company logos and icons)
  • Compressed file sizes allow for quick load times
  • Displays crisp and clean on digital applications

Constraints:

  • Not ideal for printing
  • Cannot be scaled over its pixel width
  • Flat image that is not easily editable

What is a vector file?

Icons pf .AI, .PDF and .EPS files

Vector images are typically used for logos, icons, typesetting and digital illustrations. Adobe Illustrator is the industry-standard image editor that is used to create, design and edit vector images.

Here is a little insight behind the uses and capabilities of an .AI, .PDF and .EPS.

Adobe Illustrator (AI)

Used for:

  • Logo and illustration design
  • Creating multi-layered/multi-paged artwork
  • Prototyping websites

Handy to know:

  • Scalable to any size without losing image quality
  • Supports transparency
  • Full editing capabilities within Adobe Illustrator
  • Vector-based working file for digital artists and web developers

Constraints:

  •  Can only be edited in Adobe Illustrator

Portable Document Format (PDF)

Used for:

  • Digital versions of hard copy documents or publications
  • Sharing previews of work without losing image quality
  • Universally viewable by computers
  • Emailing documents
  • Both print and digital
  • Digital downloads

Handy to know:

  • Can be opened and edited in Adobe Illustrator
  • Illustrator and Photoshop files can be saved as PDF
  • PDFs can contain both raster and vector images

Constraints:

  • Not always suitable for viewing on smaller mobile devices
  • Can only be edited using design software

Encapsulated Postscript (EPS)

Used for:

  • Logos and illustrations
  • Infographics
  • Icon design

Handy to know:

  • One of the most preferred formats by digital designers and other third-party creatives
  • Single page vector-based drawing that can be scaled to any size
  • Supports transparent backgrounds
  • Fully editable artwork
  • Retains image quality
  • Can be exported to various file types

Constraints:

  • Can only be edited using design software such as Adobe Illustrator

Happy file sharing!

& symbol showing the differences between Raster (blurry) and Vector (clean) images

Now that we have covered the ins and outs of common design file types, their uses and the differences between them, you can supply and share with confidence!