When you hire a designer to create your logo you'll receive a few file formats to ensure you have the highest quality version for any visual communication needs in the future.
I'll cover all the file formats you should receive when your logo design is complete, they all have different purposes to achieve a high quality finish no matter what's being produced. Depending on whether it's required for print or web, file size needing to be low for fast uploading or to appear on clothing, there are a variety of file formats that are more suitable for reproduction. Let's break it down:
Print file formats
Printing needs a CMYK format, this is the ink breakdown (Cyan, Magenta, Yellow & Key, or Black) and the colours are mixed, much like paint is
.ai (Adobe Illustrator raw file format)
.eps (Encapsulated PostScript)
.pdf (Portable Document Format)
.svg (Scalable Vector Graphic)
These are all vector files, meaning they are scalable without any loss in quality. They are created using a mathematical format utilising points on a grid. These are the highest quality file formats and because of that, they're too large for the web. .ai Cannot be opened unless you have Adobe Illustrator but some programmes are able to open .eps files. .pdf Files are a good way to send logo files to printers, allows printers to open the file if they don't have the latest version of Adobe Illustrator.
Web/digital file formats
Website and screen (digital) formats need RGB, low res but high quality files. RGB (Red, Green & Blue) are made up of light, this can sometimes cause a surprise when you see a logo on a screen compared to a printed piece of literature – you're comparing light to paint and there's a lot that can change the look of ink even down to the paper used and the finish (glossy, matt, etc.). You can achieve a high level of vibrancy when using light so unless you're wiling to pay extra for a guaranteed finish (by assigning a Pantone Colour) then there's an acceptable amount of compromise between screen and the page
.jpg / .jpeg (created by the Joint Photographic Experts Group but has been shortened by removing 'experts' in the extension)
.png (Portable Network Graphics)
.gif (Graphics Interchange Format)
Apart from the .gif, which is a bitmap raster format, these are all raster files, this mainly means that because they're made up of coloured squares, pixels, there is a loss in quality when resizing. These are normally used for web design, except for .jpg which is great for keeping file sizes low by converting a layered Photoshop file into a flattened .jpg. So let's look at the variety between the uses of the files:
Differences
.ai
CMYK | Single Colour | Reversed for a dark background
Single colour - white - black
Transparent background
Useful for print
can be scaled to any size without any loss in quality, from stamp size all the way up to on the side of a bus
I recommend that the designer keeps a version with any text being saved as a font but supply a version where the text has been 'outlined' for the client or printer. This will avoid the text shifting and moving if the font file is slightly different from one computer to the next
Highest quality
Can only be opened if you have Adobe Illustrator and it's the same version as the one saved
.eps
CMYK | Single Colour | Reversed for a dark background
The original high quality file format, now that the raw Adobe Illustrator has been developed either file is widely accepted by printers and other service providers. The only notable difference is that a .eps is an open-source file format which means you can open in in more programmes other than just Adobe Illustrator, for this reason you should get both formats
Again, this is a vector format which makes it scalable with zero loss in quality
.pdf
CMYK | Single Colour | Reversed for a dark background
This is optional and useful in sending to suppliers so it can be opened and editable but only when saving a .pdf from an Adobe Illustrator file
.pdf Is normally a final file prepared for print, a completed piece of artwork that has the logo embedded but it can be a logo saved if helpful for a printer or other service provider
.svg
CMYK | RGB | Single Colour
Transparent background
Like a .gif this format can have animation applied
You may need HTML5 skills when it comes to editing and adding animation features
The file is based on XML, which means all the info regarding the image’s color, shape, lines, curves, and text is stored in the readable text files, useful for web developers
The image can be modified any way and it won’t lose the initial quality
Can be opened in many programmes, even in a web browser
You can edit the file, add animation and other effects using the CSS or Javascript
Improves your website’s Google (and other search engines) image search results due to embedded text (code)
Low file size (quick to upload on a web page), very high quality
.jpg
CMYK | RGB | Single Colour (not a white logo because it will be flattened)
Used as a flattened logo, unless you have a coloured background, the background will be white
Great for keeping a file size small but if you save the same file over and over there will be a loss in quality. It's barely noticeable but worth bearing in mind when you resize to a specific set of pixel dimensions
.png
RGB | Single Colour
Transparent background
Good for logos utilising gradients, shadows and detail but the file size is usually higher because of this, may take longer to upload on a web page
.gif
RGB | Single colour
Flattened file format, white background
Should only be used for very simple, graphic logos
You logo can also be animated with this format - animated gifs are a unique way to show your logo with very simple animation
If you want to read up further on file formats, click on the following links:
If you would like to discuss having a logo designed, feel free to email me at caroline@mysteryhare.com or call me on 07525246734
Comments