I’m sure you’re thinking, “File types? How glamorous!” That sarcastic thought is why so many people are lost when it comes to this topic, because no one thinks it’s glamorous or exciting. But if you’ve spent any time in the world of business, you know that there are many unexciting things you need to know to find success. I’ll attempt to make file types as enthralling as possible, but I can’t guarantee it will happen. What I can promise is that by the end of this article, you’ll have a good understanding of file types and how to use them correctly in your business.
Pixels, Points, and Vectors, oh my!
Before fully understanding file types, we need to know the building blocks of images. There’s a few things that factor in to this. For starters, there are two options for how an image is comprised in a file. It will either be built using pixels or vectors.
Pixels are easy to understand, because everyone has struggled with having pixelated pictures. Pixels are little squares of colors that make up an image. When saving a pixel-based image, for each pixel in the image, the computer records its color and location. This means that the image is restricted to the number of pixels. So if you have an image that is 100 pixels by 100 pixels, then it only has 10,000 pixels in it. That might sound like a lot, but remember pixels are tiny squares. So if you take that image and magnify it to fit a space that is 500 x 500, there will be 240,000 spots where there is no recorded info of what color those pixels should be. This leads to the image being pixelated, because the computer will try to fill those spots to the best of its ability. Since all the info it has to go off of is the 10,000 pixels it has, it really just fills the surrounding empty spaces with the same colors it has, so it will look blurry and pixelated.
When an image is built using pixels, it’s called a raster-based image. While it seems confusing to suddenly switch the name, all you need to remember is that raster is another word for pixel. And by understanding how raster images work, you can probably see why there’s a problem with only using pixels to build images. Since raster images can’t be resized, it poses a real dilemma when you want an image that can be used in a variety of sizes.
The Rundown of Vectors
Enter vector images. Instead of remembering where each and every pixel is in an image, vector images remember formulas instead. I’m no mathematician, so I can’t give a thorough breakdown of how vectors work, but the application is easy to understand. Since vectors use proportional formulas to build an image, it becomes what is called “scalable.” This means an image can be 2 inches small or 20 feet big, and the quality will remain the same.
What Does This All Mean For You?
If you’ve yawned by now, I don’t blame you. But let’s apply this to your life. Why is it important for you to know the difference between raster and vector? The most important application of this will be your logo. Since logos are used in a variety of spaces and sizes, they need to be built using vectors, otherwise you’ll end up with a lot of pixelated logos and accompanying tears.
So how is a logo made using vectors instead of pixels? This launches us into one of my unironically favorite topics: design software.
The King and Queen of Software
You might be thinking, “I’m not a designer, I don’t need to know about software!” You might not need to know the nuts and bolts of the software, but having a basic knowledge of what they do will be very helpful for you when dealing with images or your designer.
There are two primary softwares used for design. Even if you’re not a designer, you’ve probably heard of them: Photoshop and Illustrator. You might’ve been curious why there has to be two, and understanding raster and vector will satisfy that curiosity.
Photoshop builds images using raster, or pixels. This is why it’s always used for photo editing, since photos are built using pixels as well. If you have an image that you want to edit, you can’t do it in Illustrator, it has to be Photoshop. Now, you can build a logo in Photoshop, but remember it’s restricted to the amount of pixels you originally use to build it. So since Photoshop can’t build scalable images, Illustrator is required.
Illustrator remembers everything as vectors, so whatever you build in it will be scalable. This makes it ideal for logos. There are many other pros and cons for selecting which software to use for different projects, but let your designer worry about that. The overview is Photoshop is for photos, Illustrator is for logos.
Now we get into the way a file is exported. We’re going to hit the most relevant types, what those wild acronyms stand for, and when they should be used.
JPEG – Joint Photographic Experts Group
JPEGs are the most commonly known file type. As the name suggests, it works well for photos, which is why photos are nearly always found in JPEG format. This file format compresses the image, which reduces the size of the file and is ideal for images uploaded on the web. Smaller file size equals quicker load time.
The thing to remember with JPEGs is because it’s compressed, the smaller the file size, the smaller the dimensions will be. Since it’s a raster-based file type, this means as the dimensions are shrunk, then you lose pixels and it can’t be re-enlarged without encountering pixelation. You want JPEGs that are the dimension of the final place you’ll put them.
PNG – Portable Network Graphic
This file type is ideal for web, because the way it stores colors works very well on the web. Color indexes could be another whole article, but for the purpose of this overview, remember PNG files as perfect for the web. If you have print files, you won’t want them to be in PNG, because like JPEG, it stores memory by compressing it, which means losing some quality.
A quick note about web and print.
The biggest difference one should know is resolution. You might’ve heard the term DPI in regards to printing. That stands for “dot per inch.” This is how images are created in print. Just like raster images are comprised of many pixels, (also known as “pixels per inch,” or PPI) , printed images are comprised of many different color dots all close together. The most important fact is that for print images, 300 DPI is the standard for quality, and on web or digital output, 72 PPI is the standard. So when an image gets compressed, it can affect the DPI and if you try to print it, you’ll lose quality.
Another reason PNGs are powerful is because they can preserve a transparent background. JPEGs can’t do that. So if you have icons, they should be in PNG format. If you have something that will overlay another picture, it should be in PNG format so the transparency is kept.
GIF – Graphics Interchange Format
GIFs are usually used for animations on the web. The reason this is common is because when a software outputs a file in GIF format, it’s limited to 256 colors, which results in a much smaller file size. That makes it load faster on webpages. For animations that need to be in highest quality, then GIF isn’t the file type to choose. For many applications however, it’s the best option.
PDF – Portable Document Format
Everyone has encountered PDFs. This format is used to save documents that can be opened on a variety of platforms. If you save a document in Microsoft Word, then whoever else opens it has to have Word as well. But if you save it as a PDF, you don’t need a certain software to open it. Beyond being opened anywhere, PDFs can be edited using Adobe Acrobat. If it was saved a certain way, it can also be edited in Adobe Illustrator.
PSD – Adobe Photoshop File
A file with the extension .psd means you need Photoshop to open it. As covered before, Photoshop is a raster-based software.
AI – Adobe Illustrator File
An .ai file means you need Illustrator to open it. Illustrator is the primary software for creating and editing vector graphics.
INDD – Adobe InDesign File
You might not recognize the .indd extension, but this means the file needs InDesign to open. InDesign is the third software of the trifecta of design programs. This is used when creating multi-page documents. Elements can be created in Photoshop and Illustrator, then compiled in InDesign. As the best software for typography and layout, a designer should use InDesign for things like catalogs, magazines, newspapers, etc.
Hopefully this has provided you with a brief overview of the file types you might run into in your business. Of course, when hiring a designer, you should be bringing on somebody who is even better acquainted with file types than you! But it’s important to have a rudimentary knowledge of file types, since they are so prevalent in all areas of business.