No products in the cart.
Brand Strategy
Understanding File Types & Formats
Are you confused by the different logo and image file types out there? Perhaps you’ve had a logo designed by a graphic designer and they’ve handed over a zipfile with your logo in a 3 or 4 different file formats and you’re not sure what file to use or where.
To help you understand the file types and formats, I will explain the different logo file types which includes .png, .jpg, .gif, .eps, .svg, etc., as well as explain how best to use them. Below, I’ve put together a quick run down to help you out.
Raster Images vs. Vector Graphics
Computer graphics can be created as either raster or vector images. Raster images are bitmaps which are basically a grid of individual pixels (little squares) that collectively compose an image. Raster images are best used on websites and NOT for printing. If you want to enlarge a raster image it will become blurry and you’ll start to see the image is made up of squares which become jagged on the edges the larger the file becomes. Common raster formats include TIFF, JPEG, GIF, PCX and BMP files.
Unlike pixel-based raster images, vector graphics are based on mathematical formulas that are made up of lines, curves, circles and are not resolution-dependent so no matter how much you enlarge the file it remains crisp and sharp.
Vector files are best used to represent more structured images, like line art graphics with flat, uniform colors. Most created images (as opposed to natural photographic images) meet these specifications, including logos, icon graphics, and fonts.
Overall, vector graphics are more efficient and versatile. Common vector formats include AI, EPS, SVG, and sometimes PDF.
PNG {Portable Networks Graphics}
PNG files are raster based and best used for graphics / images on websites and NOT for printing.
The PNG file is a raster file format which means you cannot enlarge the file beyond it’s current pixel dimensions without it becoming blurry. The PNG format supports a transparent background which is ideal for a logo, icons and graphics because you can overlay these on top of an image or coloured background.
Where to use it
Social Media (Facebook, Twitter, Instagram, Pinterest, LinkedIn, etc)
Websites
JPEG {Joint Photographics Experts Group}
JPEG files are raster based and best used for graphics / images on websites and NOT for printing.
JPEG files don’t support transparent backgrounds and are generally used for high quality photo images and low resolution (72 dpi) online use.
Photographers use this file when editing and exporting images in Photoshop. JPEGs are raster files which means when it is resized (big or small), it can lose its crisp quality, so this file format is not recommended for print use unless it is a high resolution (300 dpi).
Where to use it
Websites (Low resolution 72 dpi)
- Social Media (Facebook, Twitter, Instagram, Pinterest, LinkedIn, etc)
Print (High resolution 300 dpi)
SVG {Scalable Vector Graphics }
SVG files are vector based and best used for logos, icons and simple graphics, but NOT for printing.
SVG files look sharper than a png file and they’re significantly smaller, so they won’t slow down your website at all. You can scale an SVG image up and down as needed without losing any quality, making it a great choice for responsive web design.
You can open online SVG files without having to download them first with a modern web browser like Chrome, Firefox, Edge, or Internet Explorer—nearly all of them should provide some sort of rendering support for the SVG format. You will need a program such as Adobe Illustrator to open an SVG file on your computer.
Where to use it
Websites
- Logos
GIF {Graphic Interchange Format}
GIF files are raster based and best used for graphics / images on websites and NOT for printing.
GIF files are similar to PNG files but are a much lower quality. Designed for online use only and can be used for animation. GIF files also supports a transparent background so you can see behind it.
Where to use it
Websites
EPS {Encapsulated Postscript File}
EPS files are vector based files and can be opened in illustrator. Vector means that the size of the logo or graphic can be resized multiple times (big or small) without losing its sharp appearance.
Where to use it
Printed Material
Merchandise (clothing, stickers, hats)
Printers usually ask for this type of file because of its usability
PDF {Portable Document Format}
PDF Files are a great way to send files or documents. I usually send contracts and invoices via PDF but I also send my clients PDF logo files. This file can be opened and edited in illustrator. PDF’s are super easy to share almost anyone can open this file on any of their devices.
Where to use it
- Printed Material
- Merchandise (clothing, stickers, hats)
- Printers usually ask for this type of file because of its usability
I hope you found this blog post useful. If you’d like a printable reference sheet to refer to join my free Resource Library which is full of lots of video tutorials and downloadable goodies.
As always, let me know in the comments below if you have any questions!
