The Difference Between Vector Graphics and Raster Graphics
March 15th, 2017 | Natasha Englehardt
If you’re new to the study of design you may still be fuzzy on the difference between vector graphics and raster graphics. In fact, sometimes the explanation of the difference can feel more complicated than the question! However, today we’ll banish confusion forever as we explain the difference between vector graphics and raster graphics in a way that’s easy to understand. Read on and you’ll always choose the right tool for the job.
A raster image is like a mosaic made up of pixels. Each pixel is actually a tiny square assigned a specific color, and like tiles in a mosaic, they are arranged to create an image. More pixels within a unit area means higher resolution and quality.
You typically don’t see the individual pixels unless the resolution is poor, or unless you zoom in on a raster image. Zooming in to isolate individual pixels gives you the ability to edit images with a high level of precision using a tool like Adobe Photoshop. Simply erase or change the color of individual pixels until you achieve the effect you’re looking for.
Raster graphics are best used when it’s important to show the smooth transition of shades and colors—for example, in photos. Raster graphics are also excellent for catalogs, flyers, postcards, stationery, and other everyday projects.
Raster images take more hard disk space than vector format images, even when they appear to look the same. That is because raster files include information about each pixel in the graphic. Compression techniques can mitigate this issue, although if space is a major concern these graphics may present you with a challenge. Typical raster graphic file formats include .bmp, .gif, .jpeg, .jpg, .png, .psd, and .tif.
Some advantages of raster graphics include the following: they are easy to use; they provide subtle gradations of color; and they are simple to edit using common programs like Photoshop and Microsoft Paint. The primary disadvantage of raster graphics is that they are not always usable for creating high-quality printed projects, especially when the desired end product is large-format.
A vector graphic is not made up of pixels; instead, it is made up of paths, each with a vector or mathematical formula that controls its shape and color. If you look closely at a vector image you will see control points with curves between them, almost like a child’s connect the dots game. These are the vectors.
Because the vectors are mathematically defined, vector graphics are scalable and can be blown up to any size without losing any quality or getting any of the fuzzy, pixelated qualities that you see when you zoom in on raster images. For this reason vector graphics are ideal for logos and other projects that need to remain sharp at multiple sizes.
Adobe Illustrator and CorelDraw are the most popular vector graphics editors. Common vector file types include .ai, .cdr, and .eps. Vector graphics are used most commonly in printing brochures, business cards, large signage, logos, window graphics, and any other projects that feature designs, logos, symbols, and/or text—anything other than photos or complex, multi-hued designs that demand subtle gradations of color.
The principal advantage of vector graphics is that they produce the most precise, clearest designs at any scale. The main disadvantages are that vector graphics demand professional design software and the ability to use it.
Pros and cons of rasters and vectors
Raster graphics can reveal a multitude of colors in a single image and allow for more precise color editing. They showcase finer nuances in shading and light at higher resolutions. However, raster files, especially high resolution files, are very large. They also have a limit to their scalability.
Vector images are scalable, so one version of a design will always work for every iteration of a project. Vector files are also smaller. However, vector images cannot display photographs in a natural looking way, and vector formats are not as well supported online as are raster formats.
When should I choose raster or vector graphics?
For photos you need raster images and Adobe Photoshop; for letterhead, text, logos, and other simple graphic elements, you need vector images and Adobe Illustrator. If you’re not totally sure which kind of graphic to use, follow these guidelines. If you’re editing photos with multiple colors, choose raster images. If you’re drawing something with a limited number of colors, choose vector images. You can also create a project that uses both photos and logos, or both kinds of graphics.
Finally, remember that you can always turn a vector graphic into a raster file with ease. However, it doesn’t work both ways. A raster file cannot typically be made into a vector file.
What if I’m not sure whether my file is vector or raster?
This may seem like a silly question, but it’s actually not. Even if your file extension suggests that the piece is a vector graphic, it may not be; it could have been a raster graphic that was opened in Illustrator and saved, for example. The only way to know for sure is to open the file and get a close up look at part of the design. If you see the vector editing nodes, you’ve confirmed that it’s a vector graphic.
For clear images like photos that convey subtle gradations of color, shade, and light, raster images are perfect despite their loss of quality at larger scales and occasionally unwieldy file sizes. For scalable designs with fewer colors, vector graphics are ideal, despite their inability to render totally smooth color transitions. To cover all of your bases, have your design in both formats, or in vector form to be converted later.
Cover Art: Sea Turtle by Natasha Englehardt | Magical Forest by Becca Viola