The world of design and branding can be extremely fun and exploratory, but every now and then, we need to cover boring topics that will make you life easier later on. Today we are going to cover the world of file types, and what you need when working with your logo, because nothing’s worse than having a great look ad, but you slap your logo over it in that jarring white box.
When working with your logo, it’s not as simple as erasing the white background. You’ll come away with rough pixel edges which leave you looking unprofessional. If you’re not willing to invest in polish for your business, how will a client know that you’re willing to invest in providing the best service for them?
How can you know what file type your logo should be? What’s the difference, and why does one file type work as your Facebook Profile image, while another does not? If you’re anything like me, you can barely remember what you had for lunch yesterday, so trying to remember what the difference between “jpg” and “png” might make your head explode. Plus, no one even knows if you pronounce “gif” as “jiff” or “giff”.
For the small businesses out there, here is a simplified guide to Image File Types and their characteristics.
Pixels vs. Vectors
All files are built through one of two methods: Pixels or Vectors.
Pixels are the tiny, beanie individual squares that sit side-by-side to make up an image. The more pixels you pack into an image, the better the quality and the more you can increase the size of an image. If a file was built using too few pixels, the image will loose quality when stretched to a larger size and starts to create those jagged edges instead of those smooth transitions.
Vectors on the other hand are built using algebra. Before you get scared and click off the screen telling me that advanced math wasn’t your gig, hear me out. The design application that you use does all of the algebra equations for you, and builds your files using vectors. These vectors recalculate themselves as you enlarge or shrink the image creating perfectly smooth lines every time. Illustrations are usually made up of vectors, but photographs are made of pixels.
JPEGs
This is the most common file type which is made of pixels. It’s stands for Joint Photographic Experts Group. It’s one of the most widely accepted file types which means you should have no problems using Jpegs for your social media profiles and banners. However, the trade-off of using jpegs is that they continue to loose quality the more that you save and re-save. Jpegs also can not handle transparency, so when you put your logo on a design and it appears in a white box, a jpeg might be the reason why.
PNGs
Call file type that allows you to use transparency with your logo. It is become more a more accepted file type by platforms in recent years. However, platforms don’t always except this file type and you may need to resort to using a JPEG instead. This file type is also made up of pixels, but doesn’t loose as much quality as a JPEG when being re-saved. The thing to keep in mind about a PNG is that you first must create your logo file with transparency in your an application. If you logo is not created with a transparent background, you may need a professional to trace and rebuild your logo in a clean file with transparency.
GIFs
Another pixel-based file type, and not one I’d recommend for your logo. You can use it, but most platforms are just beginning to allow the use of GIFs. The unique thing about GIFs is that it has the ability to perform small animations. The problem is that GIFs produce very poor image quality and you have to go through many steps for your image to look good. Not only that, but no one really knows how to say “GIF”!
AI
If you ever need to hand off your logo file to a graphic designer or a virtual assistant this is the file you want to have. Since a logo is basically an illustration it will be built by vectors in adobe illustrator and you will be able to scale it to any size. From an Adobe illustrator file you can produce any of the above file types. Even if you do not have Adobe Illustrator on your computer, it’s a file that you’ll want to hang on to so that you can send it to a vendor if they request it.
PSD
I don’t recommend Adobe Photoshop as your place to build your logo. While it does handle smart objects which make use of vector characteristics, it generally builds pixel-based images which will loose quality after you stretch them so far. The thing that can be fun about bringing your logo into Photoshop are the fun effects that you can sometimes apply to your logo. Photoshop can save your logo with a transparent background as well, so if you applied a drop shadow to your logo, you’d be able to create a image for your Facebook profile.
PDF’s can handle both pixels and vectors. This means it can hold a photo that can not be stretched, and at the same time hold a vector logo that CAN be stretched. This is going to be greatly dictated by the application it was originally created from. As a designer, this is a logo file that I recommended holding on to from my clients. It usually opened in Adobe programs without an issue, and maintains a transparent background. Not only that, but anyone with a computer or smart phone can view what’s contained in the image.
EPS
This is another strange file type that can handle both pixels and vectors, and can be a strange type of file to work with. Unless you have Adobe applications, you may get an error trying to open it on your computer. If a small business owner has an AI or PDF of his or her logo, they may not need to hold onto an EPS. It’s not accepted by social media platforms, and it currently seems to be a file type most people are moving away from.
SVG
This has become the new standard for using vector graphics online so that your image can stretch and shrink without the loss of quality. It is not quite accepted everywhere, but more and more plugins are being created to do so. The SVG is a vector-only type of file, which means it’s a great choice for saving your logo, and is recognized by most design applications.
Â
Need a quick guide to keep all of this information with you? I’ll hook you up! Fill out the form below and I’ll email the Image File Characteristics Chart to you.
Subscribe for help and advice for websites and design tools to help your business get up and running quickly, starting with this free guide. Unsubscribe with one click at any time.
SPAM is annoying and I promise to keep your email address safe.
Here’s my privacy policy.
