Vector vs Bitmap for dummies

by Kahlil Gibran

... continued from the previous page.

Image resolution

Image resolution relates to the amount of detail or density of information inside a given space. The more resolution, the more quality your image will have. The term is continuously used as an expression to describe only the dimensions of an image, leading many times to general confusion. When referring to resolution, you have to address both the image size and the dpi.

The more information an image has, the bigger the file size. Image size can be expressed in width x height or as almost all current camera manufactures do, by multiplying the width x height and dividing it by a million. I believe that this "Megapixel" notation is quite misleading to the mass consumer because image dimensions alone are not a truthful indicative of image quality. Just to illustrate, the image of the new iphone camera is said to be of 3 Megapixels. The image of the HD camera Sony made for the last two Star Wars films is 2 Megapixels. That by no means is an indicative that your iphone images are going to be better than the ones you saw in Attack of the Clones. Do you get my point?

City72DPI_Bv
450 x 300 72 DPI

City20DPI_Bv
Same image with 20DPI. See any difference?

Now, Generally speaking, Images come in two flavors. We are talking about Bitmaps and vectors. (Bitmaps are sometimes called rasters)

Bitmap images are made up from filling each individual pixel with information. For example, a completely black 4px by 4px image is made from 16 - 4 x 4 - black colored tiny squares. - pixels -

4x4_bv
A complete black square is really comprised by many black pixels

I know I'm not talking in the most technically accurate terms, but I want even my grandma to understand these basics.

Vector images are quite different. In the vector universe, a completely black 10px by 10px image is made up from mathematical calculations in a couple of lines of code that describe the image in values for its location, color and size.

Vector_square_bv

Vector_spiral_bv
Two examples of vector graphics in SVG format. Notice the code is based on XML

Vector_eye_bv
Impressive example of vector graphics by Oleg Rogoznev*

Bitmaps and vectors are two different ballparks with different rules. Each type of image has its own file types and associated software.

Image_formats_bv
Most common image formats and editing software

... continues on the next page!


great deals on vector graphics