A Designers guide to Raster Graphics vs Vector Graphics

We use many graphics while Web Designing and also for many Printing purposes. We Design Logos, Banners, Advertisements, Greetings, Gradients, Textures and many more which we use here and there. But we should know first that which are suitable for which platform. Whatever Graphics we use are of two types, Vector and Raster or Bitmap. There are many differences of these two types of graphics and we should know where to use which one.

Raster Graphics

Whatever we see on Computers are Raster graphics. Whatever images we see and use are Raster graphics. Raster graphics are made of pixels, the smallest unit of digital display. Pixels are very very small squares of display which when combined together in large amount gives the total display on the Monitor. Whenever we design a Raster graphics, the informations describing the graphics are saved in pixels as their shape and bit information the color of the pixel. Thus whenever we see it, we see it as a collection of pixels, which generates the total picture. Raster graphics are also known as Bitmap Graphics.
This technique of image representation has some merits and some demerits. Raster graphics always display high quality of images and colors with good depth. When seen in original size, they are the best quality of electronic pictures. Complex shades, fills and gradients can only be rendered in raster graphics. But Raster graphics files are much heavier and larger. They are sometimes not easy to be transferred through the Internet. Whenever a Raster graphic is resized, it gets very much degraded in quality. A raster graphic cannot be used by changing its size. This is because of the fact that they are composed of some definite number of pixels. whenever you try to increase its size, computer have to add some more pixels in between those pixels. This is something like putting a small glass of water into a big vessel and asking it to take the whole empty place. So definitely it have to be adjusted with extra elements. Thats why Raster graphics don't perform well where image sized vary.

Vector Graphics

Vector graphics on the other hand consists on some vector points only. Whenever we save a Vector Graphic, the graphic is saved as some vector points with some information as how to join those points, which determine how to redraw the graphic. Every time you see a vector graphic, it is redrawn and represented to you right at that moment.
This technique of graphic representation also has some merits and some demerits. Vector graphics don't get distorted while resizing, making it suitable for places where sized vary. Vector graphics are very much light and file sizes are small, making them easy to transfer around the web. But heavy graphics can't be represented in this manner. Thats why Vector graphics are not suitable for high quality images with gradients, shades and high fills. Vector graphics can't redraw high graphics which we see around the internet or in our computer. Thats why Vector graphics is suitable only for texts.

Where to use which ?

This is the main target you have to accomplish with this knowledge. Now you can easily understand where to use which graphics cause you know what are their advantages and disadvantages. Whenever you are working on high graphics with rich gradients and deep fills, you have to go for Raster graphics to get the quality. When you are working something that is going to be displayed on the Computer, you can use Raster graphics. but avoid using Raster graphics for Logos, since logos are highly targeted to resizing according to needs. But when you are using only texts and some normal color fills, you should use Vector graphics as this will give you high level of resizing capacity. Whenever you are working on something that is going to be Printed out on paper, Then always use Vector graphics (except for high end graphics), otherwise you will have very low quality of output.

Which applications support which graphics types ?

Now you should know while using any application that what type of graphics it is supporting. Adobe Photoshop, Corel PhotoPaint and Macromedia Fireworks and Paint Shop Pro are some of the Raster graphics or Bitmap graphics editors.
While Adobe Illustrator, Corel DRAW, Macromedia Freehand and Macromedia Flash are some of the Vector graphics editors.

What are the file formats for the two types of graphics ?

Common file formats for Raster graphics are .jpg, .jpeg, .png, .gif, .bmp, .tff.
Common universal file formats for Vector graphics include .eps, .wmf and .svg. While common file formats for Vector graphics are not so well stated as that of raster graphics. The formats are dependent on the application you are using. Like .fla, .swf for Flash, .ai for Adobe Illustrator, .cdr for Corel DRAW.

So, now you came to know why your printouts are not so accurate to what you make on your computer and may be why your logos look so untidy while they are used as icons ?