<class home>

Raster VS Vector

What is the difference between raster and vector image formats?

 

Basic Definitions

http://hotwired.lycos.com/webmonkey/design

 

Bitmap (or raster) graphics are stored as a series of tiny dots called pixels. Each pixel is assigned a color, and when they are viewed together, they form a picture.

 

Vector graphics are not based on pixel patterns, but instead use mathematical formulas consisting of lines and curves that make shapes. With the exception of Flash (vector graphics program) most browsers do not support vector graphics on the web.

 

In Depth Definition

A computer screen generally displays 72 pixels per inch and most printers¹ work with 600-2400 pixels per inch. The terms ppi, pixels/inch, dpi, dots/inch and spi, samples/inch all are different terms for describing how the grid is laid out which defines an image¹s resolution. The only difference between the terms is the devices being used. Scanners and monitors generally use PPI or spi. Output devices use dpi or lpi. Lpi is lines per inch.

 

Drawing programs like Freehand and Illustrator are vector based programs. They use math to describe the shapes that make up an image. The advantage of using math to describe a shape lies in its flexibility. It doesn't have a set resolution, i.e. it is ³scalable². An image displays and prints at the highest resolution that the output device supports. This is very different from raster images, which have a fixed resolution. Fonts (text) are usually vector based.

 

The way each format handles resolution is very important. In Photoshop to achieve the highest quality you need to work at the correct resolution from the beginning. Each time you resize or alter the resolution the quality suffers.

 

As you can see a raster based image at 72 dpi has fairly jagged edges. When increasing the size to 200% the resolution drops to 36 dpi and it is really jagged. On the other hand a vector based image looks much less jagged since the curves are defined mathematically and resizing the image has no effect on quality.

 

Raster based image at 100%

 

      

 

 

Raster based image at 200%

          

 

 

Vector based image at 100%

 

 

Vector based image at 200%

 

 

Common uses for raster image formats

 

1.  Digital Photographs

 

Common uses for vector image formats

 

1. Logos, which are generally a few solid colors and need to be shown at a variety of sizes

2. Text

 

Vector image formats advantages

 

1. Resolution independent

2. Smooth curves

3. Small file sizes for computer drawn artwork (vector art and type)

 

Raster image formats advantages

 

1.  Photographs usually look more accurate as raster images. The gradients are smoother and it maintains the subtle details within the photograph.

 

2.  Photographs are almost always smaller as raster images than vector images.