One of the biggest issues I see is a client who doesn’t have their vector logo. When asked for their logo they give a jpg or png that has over time become so pixelated it is going to look horrible and is practically useless.
Logo should always be created in a vector format and all those other “types” of logos created from your original vector logo.
WHAT ARE ALL THESE TYPES OF LOGO FILES and WHY DO I NEED THEM
You may never use some of these files BUT you must keep all of them safe and sound as part of your marketing materials.
NEVER EVER trash your .ai file. It is the most important file your designer will give you, treat it like gold because. It is the DNA of your logo.
Adobe Illustrator (AI)
The .ai file type is the rawest of raw.
It’s the file containing the original lines in a controllable and modifiable format in various layers. From this center point, all of the other file types are exported. A vector file is file made up of lines. Those lines never get pixelated and are able to be scaled to any size no matter how big or small.
Uses:
Designing and printing
Exporting to high-quality file types
This is the file format most often requested by print shops. The PDF reigns king as a vector file format.
Note: the PDF has to be saved from a vector program to be a true vector PDF. If you save a PDF from Photoshop (and they aren’t vector shapes), it will still get pixelated when it hits the print shop.
Uses:
Logos
Marketing materials
High-quality document printing
EPS
The EPS was the PDFs predecessor. Nowadays, this format is dying off and is mostly reserved for old vector graphics using the format.
You’re able to export EPSs from Adobe Illustrator, but I don’t recommend using it as a viable file type unless you hear differently from a printer.
Uses:
Back ups (use a PDF as your first choice) some printers may ask for it.
SVG
SVGs are amazing file types for website design.
You should use SVG for your graphic/iconic elements on your website. Being a vector format, these will scale infinitely without pixelation, which comes in handy for cross-device quality control. And also, they’re extremely lightweight in file size, which will make them load faster. I’m talking the low kilobyte range. You can also leverage SVGs for advanced functionality.
Uses:
Website graphic or iconic elements
Advanced graphics modified by CSS in website design
(You most likely won’t utilize this file type unless you’re working with websites. For printing purposes, stick with PDF.)
USE PIXEL FILES ONLY FOR WEBSITES AND SOCIAL PLATFORMS
You’ll utilize these file types most prominently on websites and platforms (social media, profiles, etc.)
JPG
Of all the pixel file types, JPGs carry the smallest file sizes.
When it comes to website design, file size matters. Anything over 800kb is too big to be placed on a website page and will slow down page load. Slow page load equals less search-engine optimization (SEO) power, as well as a higher bounce rate (people getting impatient and leaving). The image bannering this blog post is a light-weight JPG. A JPG is easily able to losslessly compress large files with a high-quality output. This means the file size is small and lean, but the final product is gorgeous.
Other website graphics (logos, designed items) are up in the air. If you export the graphic with the highest-quality possible, you’ll most likely be OK. Just make sure the file size isn’t to big.
Note: JPGs don’t support transparent backgrounds. Some graphics might require this capability which is best served by PNGs.
Also, if using these, make sure the file size is correct and the resolution is at least 300 dpi.
Uses:
Photo files
Photo-related assets on a website (like this blog post’s banner/hero image)
Some graphics
Nevers:
Never ever send a JPG file to be printed for any marketing material (business cards, brochures, etc.)
Never ever rely on JPGs as your “raw” file standard. Every single time a JPG is saved, it loses quality and compresses itself. Somewhere down the road, you might end up with an incredibly pixelated file and there’s no way back.
PNG
Portable Network Graphics (PNGs) are high-quality file formats. The biggest advantage that they offer for online usage is their transparent backgrounds. This makes them ideal for usage on websites where a transparent background is required (as long as they aren’t too large). Another key advantage of the PNG is that it’s a lossless quality file. This means that it won’t get grainy or blurred when uploaded or utilized (like pixelated file types).
Note: to properly export a PNG, make sure the file dimensions are large enough and that the resolution is set to at least 300 dpi.
Uses:
Website graphics requiring a transparent background
Pro Tip:
Use this file type for social media profile graphics (because they won’t lose their quality upon upload like JPGs so often do)
GIF
GIFs are similar to PNGs. They support transparent backgrounds and don’t lose their quality.
The main difference is that GIFs support basic animations.
Uses:
Animated images/graphics
Comments