Best Practices

Vector vs. Raster Images

There are two main types of images when working in graphic design – vector and raster. Knowing the difference between the two can save you some headaches when working with a graphic designer and switching between web and print assets.

Vector images use paths to describe the shapes they represent. In the example of the Dijon Marketing logo, there are a few circles, a few lines, and a solid color where they intersect. It doesn’t matter if this logo is tiny (like the favicon in the address bar of your browser) or printed on a billboard the size of a building. The image can scale and redraw the circles, lines, and fill colors crisply at any size.

Some examples of vector image file types are PDF, AI, EPS, or SVG.

On the other hand, raster images use grids of colors, or bitmaps, to describe an image. You can generally get away with sizing a raster image down, but things get tricky when trying to size up. The pixels that describe the image are fixed, and sizing them up will end up with a “pixelated” result. That is not to say that there aren’t perfect applications for raster images. Most web applications or certainly any photography will be presented by raster images.

Some examples of raster image file types are JPG, PNG, GIF, BMP.

The best thing to do when working with a graphic designer is to discuss which kinds of files you expect to receive. You can always create raster images from a vector file, but it’s much more difficult to go the other way. So ask for vector source files and you will always have the best of both worlds.