
|
Raster vs. Vector
Graphics
Achieving Quality Images
Designing a "drawn" (as
opposed to photographic) image in a "vector" format first will
make it cleaner and much more pleasing to the eye. This is most often
done with company logos, but is also done with any image that is not
photographic in nature for best results.
A vector image is mathematically defined—no matter how large or small
the image is, you can enlarge it or shrink it ad infinitum. The mathematics of
it remain the same, guaranteeing the clarity of the image.
The other type of graphic used is a raster image, an image in which increased
or decreased size is determined by the computer, which decides how many small
blocks of each color are now necessary to keep the image looking the same after
the change in sizing. Needless to say, the computer can only look at the information
in the file, it can't look with the eye and notice that the image does not look
nearly as good as it once did (always the case when attempting to enlarge the
average raster image).
The
example to the left, a client's logo that appeared on their
original web page before we redid it, is a good example of
a "raster" graphic. It was not well done to begin
with, and seemed to have become much worse over time. When
we designed their website, we took this in hand and worked
the magic of vector imagery.
Look
at the redone image on the right, designed as a vector image
and then converted for use on the web. The size change was
made in the vector format before converting the image to a
JPG format, but clearly it is far better quality than the original
logo. In addition, despite all the additional detail and greatly
increased eye appeal and clarity, the difference in file size
from the earlier version is only 1K greater. That's the difference
that vector graphics make.
Usually images such as this are saved in GIF format, the other main image format
used for the web. We saved the redone graphic above as a JPG because of the shading
detail--JPG images generally handle this better at a much smaller file size than
GIF images do. Generally, however, JPG format is reserved for photographic imagery
and GIFs are used for "drawn" type images, similar to the one below:
|
|
|
|
© Copyright 1997-
, Toner Design. All rights reserved.
|
|