- Saved and imported your image, but it is blurry or pixelated.
- Vendor is asking for vector file.
- You say to yourself – I just want a clear image to post on social media or a crisp looking logo, business card or marketing material. What is should I do?
Don’t worry – you’re not alone. As a designer and working in various file types on a daily basis, it can get overwhelming.
I get it. And I want to help. Below is a quick breakdown of common terms and file extensions.
Raster vs. vector images
To understand the difference between the image file types, you first have to know the difference between vector file formats and raster file formats.
Raster images are made up of multiple color pixels (color blocks) and compiled together to create images like photographs.
Because raster images are made from a fixed set of pixels, when stretched or resized to fit a space they weren’t designed to fill, their pixels become visibly blurry and the image distorts. Therefore, it is important that you save raster files at precisely the dimensions (and resolution) needed to eliminate possible complications. JPEGs, GIFs and PNGs are common raster image types.
Vector files are constructed using mathematical formulas rather than individual colored blocks. Because of this, vector images are excellent for creating graphics that frequently require resizing – rendering a new illustration at the desired size without any loss in quality. Common vector file types are EPS and AI.
Vectors are typically used to create illustrations, text and logos. Vectors are typically used as working files (which are later converted to raster images for the web), but they can also be used as print-ready artwork.
There are many different image types and image file extensions that can be used when creating and saving images or graphics. Below is a list of the most common image file extensions.
.JPG
PRO – .JPGs are most common because the small file size, easy to attach and share. Plus the easiest to save in various programs and don’t require a special program to open them. You can view them on your phone, a tablet and any computer will come with default software for view.
CON – They do not scale well. What this means is whenever you crop or make the .JPG bigger, the quality of the image decreases. Creating a blurry or pixelated images. Also to note, every time you save the .JPG, you lose more quality.
CON – .JPGs do not allow for a transparent background. So keep this in mind if you’re planning to place your logo on top of another image – there will be a white box around the logo.
.PNG
PRO – This is your idea file type for the web.
PRO – Unlike .JPGs, these do allow for transparent backgrounds. But on the bright side, you won’t lose quality every time you save it.
CON – These don’t scale well – you won’t be able to enlarge it much if it’s a small file. Make sure to size file at 100% or larger when importing. Start with original high-res and size as needed.
.GIF
PRO – Transparent backgrounds and primarily used for animation and moving photos. Reserve these file types for your website and emails.
CON – .GIFs have very low resolution.
.TIFF
PRO – These are higher quality and higher resolution images and are generally used for photos. .TIFFs are mostly used when high-quality is needed and reproduced for sale. (professional photographs and scanned art prints )
CON – They don’t allow for a transparent background. Plus are typically larger files and not suggested for posting and sharing online.
.PSD
PRO – Photoshop is primarily a program used to edit photos. Transparent backgrounds for outlined images and layered capabilities for editing.
CON – Files created in Photoshop are made of pixels, hence where the term “pixelated” comes from. These don’t scale well and when resized past final file size, they become blurry or fuzzy. You should not be creating logos or illustrations in this program. .PSD files can only be opened in Photoshop.
.EPS
PRO – An .EPS is a vector file type. Scales up and down without every losing any quality. Plus they allow for transparent backgrounds. Usually the type of file a printer will want to use when printing high-res, -quality material.
CON – They can only be opened with programs like Adobe Illustrator or Photoshop. Program versions may be an issue when doing cross platform. So ask you designer of vendor what they are using of prefer.
.AI
PRO – .AI file type is very similar to an .EPS (vector file type), allowing great scalability and transparent background. Most common used if need to have access to edit (raw, working file format). Creating things like your logo or banner images.
CON – They can only be opened with programs like Adobe Illustrator or Photoshop. Program versions may be an issue when doing cross platform. So ask you designer of vendor what they are using of prefer.
PRO – Versatile and ability to save them in both high and low resolutions – making it easy to save for professional printing or for sending in email.
PRO – Great for communicating through editable forms, contracts and can be set up to meet accessibility standards.
CON – Keeping up with all the features.
I hope these quick explanation will help you understand what file type you should use. Like I mentioned earlier, there are so many formats and variables. Make a plan, figure out your size and get formatting. Be patient and play around to find what works or what just looks like – you know.
Please leave a comment and let me know if this was helpful. Also feel free to SHARE and CONTACT me if you need any help with your next project.