Core_Computer Studies: What are Vector and Raster images and which is better?

There are two kinds of computer image files both quite different. They are known as Vector and Bitmap or Raster image files:

Vector

Rather than a grid of pixels, a vector graphic consists of shapes, curves, lines, and text which together make the image. These shapes, curves, lines, and text are constructed using mathematical formulas to describe them. They are called Bézier curves. A Raster image contains information about the color of each pixel, a vector graphic contains instructions about where to place each of the components. For these reasons a vector image is known as "object-oriented".

When we look at a vector image we can see that it is made up of a series of points which we call vectors. Hence the name vector image. These vector points are connected to form a path. When we look at a vector image we see that points are connected with straight or curved lines. The shapes created by these points can then can be filled with a color, a gradient, a pattern or nothing at all.

This path defines what we call an object. Now this is where some visual arts students get muddled because in our daily life we are constructing objects in a physical sense. In the digital world we are working with mathematically constructed object (via PostScript code). This means we can do different things to them mainly we can edit them easily.

We can for instance move them around with ease, stack them, colour them with a fill or apply a gradient to them. We can stroke them which simply means the path becomes a line around the object. Vector drawings can be edited easily by moving the anchor points in a vector-drawing program.

Their greatest strength however is that because Vector artwork is based on PostScript code they are not resolution dependent. A vector image can be reduced or enlarged without any loss in quality. Because a vector image is a mathematical construct the image scales perfectly.

In the case of line art or illustrations, a designer would create it as a vector image whenever possible. They will make life a lot easier if art needs to be resized.

The other side of this is that because of the dependency on Postscript, vector images will not print well on printers that are not PostScript enabled.

Bitmap or Raster image

When we look at a scaled up bitmap image we can see that it is made up of rows of different colored pixels, on a fixed grid that together form an image.

A raster image enlarged so that you can see the pixels

Bitmap images are resolution dependent. The higher the resolution, the more tiny pixels exist on the image's grid and the more detail an image can display. If a bitmap image is enlarged too much in a printed project, you can clearly see the rows of pixels that make up the image. Rather than small little pixels, that fool the eye into seeing one continuous tone you see pixel squares that look jagged. If someone gives a designer a Photoshop file, it's bitmap (or raster) image. Some examples of bitmap graphic formats include GIF, JPEG, TIFF, as well as bitmap (i.e., screen) fonts.

In their simplest form, (1-bit) bitmaps have only two colors, with each pixel being either black or white. With greater bit depth an image can include more colors.

When an image is scanned into a computer, it is automatically a bitmap-image file. Bitmap artwork can also be created in an image program such as Photoshop.

You need to be aware of the resolution and size of bitmap images. An image of 72 dots-per-inch (dpi) may look just fine on-screen but 72 dpi is not a sufficient resolution for printing. Be sure to take into consideration what the final artwork is to be used for. If the project you are working on is for print you must think about a high resolution image. If it is for web once again you must think about resolution for screen.

Notice how each pixel contains colour. This means that information for each pixel that is stored is not only its place on the grid but also its colour. Bitmap images, depending on their color mode, have larger file sizes.

These notes are written for students who undertake the Core Computer course at School of Art, Australian National University. Students of the course should feel free to contact any member of staff with comments questions and general suggestions..

< Home Index > < Staff Contact > < Class groups > < Assessment >

< Basics Module > < Photoshop 1 Module> < Photoshop 2 Module> < Illustrator Module > <3D Module > < Web Design Module >

< Terms and Jargon > < Online Resources >