File Types Explained

There are so many different file types. PNG, PDF, SVG, JPG, EPS. These can be really confusing. If you have no idea what those mean, don’t fear. We’ll be going over each type below. Each of these has a different suggested use.

First, let’s talk about vectors and raster graphics.

Illustrator creates graphics in vector and Photoshop create graphics in raster. Vectors are mathematical calculations, or in other words, they can be scaled to any size and still retain their resolution. Raster graphics are pixel based and cannot be endlessly scaled or they will lose quality.

JGP is a term used interchangeably with JPEG and stands for ‘joint photographic experts group’. What does that mean? Eh, doesn’t really matter. Just know that it’s a type of raster file that can be used for both web and print. For instance, I can send a JPG to print and use a JPG on my website (though these should be saved out at different resolutions). However, though I provide this file to my clients I rarely ever use JPG’s. It’s important to note that JPG files save out with a white background. If you’re looking for a transparent background for web + digital, then PNG is your friend.

A PNG stands for portable network graphic and it’s also a type of raster graphic. Like I mentioned above, PNG’s have a transparent background and can be used for web + digital. This file saves down small and is great for areas of your site where your logo may lay over the top of another asset or graphic. We’ve all see sites with a white box around their logo (jpg). Using a PNG is how you can avoid that design debacle!

Next up – PDF.

Now, this one is a bit in between. Whether a PDF is a raster or vector depends on what it was saved from. I save out my PDF files from Illustrator, so they’re vector. I’m going to talk specifically with my own process in mind. PDF is not a good format for web. In fact, most platforms won’t allow it. I typically use PDF to send collateral items to print.

Now, we’re on to vector graphics.

The first vector graphic we’ll discuss is SVG. SVG stands for scaleable vector graphic and is a bit more complicated in its usage. For this one, I’m actually going to point you to another resource that can explain it far better than I can. Site Point has a wonderful article on what an SVG is. The layperson is definitely not using SVG’s, but I include them anyway. I would rather over provide than under provide.

Next up is my favorite type of file – EPS. EPS stands for Encapsulated PostScript. It’s by far the best choice for printing. Whenever possible I use EPS over JPG or PDF. It’s important to note that EPS cannot be used for web + digital, only print.

In conclusion, file types do actually matter! This is all information I include in my Brand Guide when I hand off final files. The last thing I want is a client to use a file incorrectly, so it’s up to me to educate them. I hope this has been helpful to you! To learn more about my process and all the things I provide in my branding process, take a look here.