Your Guide to Using the Logo Files Your Designer Gave You

A tour of your logo deliverables

Check it out! Do you have these logos in your brand folder?

Firstly, do you have a folder with all your logos in it? It should contain, at the very least, logos in the following file types:

It is my intention to help you understand all the different types of logo files and how to use them so your brand is always looking funky fresh and professional.

If your logo folder consists of only one jpeg or png file please SCHEDULE A CALL TO CHAT with Jess. We need to get your logos vectorized immediately!

You know from reading our free download: The Ultimate Brand Kit Checklist, that Vector Logos are an important piece of your brand kit. If you haven’t read it yet…scroll to the bottom of the article and sign up to get your own copy.

Let’s take a look at each of the file types and how to use them! Using a file type for the wrong application can leave your brand looking unprofessional. Let’s not let that happen to you!

Vector logos are the single most important file you need in your brand kit. These hard-working logo files make sure your brand is always looking its best no matter the size of the application.

According to Adobe,

“Vector files are images that are built by mathematical formulas that establish points on a grid…Because they can infinitely adjust in size without losing resolution, vector files are more versatile…”

https://adobe.com/creativecloud/discover/vector-file.html

The alternative file type is raster, which is made up of pixels. Or little tiny squares that make up an image. Raster images can be created in Photoshop, Canva, Pic Monkey, and the like. They are usually saved as jpegs and pngs. The beauty of a vector image is that it can scale to large sizes such as the side of a building or small applications like a little sticker. This means no matter the size – your logo will always look crisp and clean!

We’ve all seen pixelated, raster logos trying their best to do their job but they just can’t pull it off. See example below.

Do you see how pixelated the raster version is? It looks sad, but the vector side is looking crisp and clean.

So how do I know if I have a vector logo?
Take a look in your logo files and look for these file types: .ai, .eps, .pdf, .svg. These are the vector files.

Go ahead and open one up in a design program like Illustrator or Canva* and try this: stretch your logo to a big size. Does it seem to be elastic? Does it look crisp no matter the size? Then, girl, you’ve got a vector. Send your designer some chocolate for her awesomeness and pat yourself on the back for investing in your business.

*It is possible you can’t open some of these files without Adobe Illustrator because the file type is licensed. That’s is ok… These files are for your design team to make your awesome brand swag! They’ll know what to do with them.

When your company is ready to print your logos on all that cool swag PLEASE for the love of all that is holy, print it with a vector file. Sure the print companies will accept jpg and png files but you’ll get a higher quality with your vector files. They do that for convenience, but not for quality sake.

When NOT to use a Vector File?

+For the web.
These files are made for saving, editing, and generally keeping your designs fresh and clean. They are not lightweight and will bloat your website faster than a bowl of spaghetti bloats a 40 year old!

+For sharing via email.
These super sized files are great for maintaining graphic quality but memes they are not. Save your image as a jpg if you want a quick email share!

PNG Logo Files

Hello digital usage! PNG is short for Portable Network Graphics. Your logos in the PNG format are perfect for online usage. PNGs are non-patented, lossless files. These files use RGB color, generally have a transparent background, and look great when compressed as they support lossless data compression. This simply means that your image will look great when optimized for the internet and then again when used at full size. The fact that they are non-patented means they will be easily opened by all programs, unlike our vector friends.

I love PNG files on the web. They look best when you need to highlight your logo against a dark background or a photo as an overlay. You get to avoid the white box that usually surrounds your logo. Check it out…

Resolution

Let’s take a second to chat about PNG resolutions. I usually send my clients PNG files with 72 dpi. This is the standard resolution for website optimization. When you load images and graphics on your website you want them to be lightweight and fast. That way when your clients are checking your site on the phone while riding the ski lift, it will actually load before they get to the top!

Now, as a designer, I know that there are instances when you might need a larger resolution for your design needs. In these cases I usually open the vector file and create a PNG at 300 dpi. This way a digital graphic can be created and then optimized and compressed to 72 dpi before being used online. Most of the time, this is something I am doing on behalf of my clients, so it isn’t standard in the deliverable files. Just know you can always ask me to whip up some higher res PNGs for you, if you find you need them!

When NOT to use PNG files?

+When you want your site to be super fast.
The losslessness of the PNG makes it a bit hefty when it comes to size. Use PNGs sparingly on the site when you absolutely need the transparent background.

+To Print.
You should not use PNG files to print your logos. They are saved in an RGB color format. RGB is color-coded for your screens. Printers use CMYK color codes. When you use CMYK on the internet it gets translated into RGB and looks terrible…same goes for RGB to print. Your logos will no longer appear in their true brand color. They will be muted, overly bright, or entirely the wrong color.

JPG Logo Files

The alternative web file types are JPGs (Joint Photographic Group). These beauties are saved in RGB, with a white background, and are also non-patented, meaning you can use them with all the software. They are lossless, meaning every time you save them you lose some of the quality, so keep that in mind.

Want to have a super-fast website? Use JPGs saved at low image quality and big size. Your site visitors will be rippin’ through your content at lightning speeds. I like to save photographs and graphics in Photoshop with the goal of 100KB/image, no matter the pixel size required.

Resolution

In the case of JPGs, I usually send my clients copies of their logos as 300 dpi since they can quickly lose their quality with over-saving. I expect that they will optimize the higher resolution files once they’ve created their graphics before sharing them on the web. Let me know if you need help with this!

When NOT to use JPG files?

+ To Print.
JPGs are created and stored as RGB files. Remember RGB is for screens and CMYK is for printing.

+ When you need a transparent background.
Remember when I said using the wrong file in the wrong application could result in an unprofessional product. I was specifically talking about this. Just recently I found a client of mine had used the jpg instead of the transparent png file on their website. It looked terrible, as the background of their header wasn’t white.

Shoot me an email if you need help with your logo files. Happy Branding Friends!