Before using these formats, it is helpful to know:

  1. WHAT they are
  2. WHEN to use them
  3. WHERE to use them
  4. WHY that are used for specific images

Before we can start working with graphics formats, we need to define what they are:

What is a Bitmap?

A BITMAP (somtimes called raster) uses a set of PIXELS on a FIXED grid (map) to define an image. Hence, the term bitmap.

NOTE: Pixels is a blended word from picture and elements)

Because a bitmap uses pixels in which each pixel's color, location has to be registered in memory at fix locations on the screen, it has two inherit characteristics:

What is a Vector?

A VECTOR uses a set of POINTS based on a FORMULA that is used to define an image (its strokes and fill colors).

Because a vector uses a formula and not a set of pixels, it also has two inherit characteristics just the opposite of a bitmap:

NOTE: Both format is ultimately RENDERED to the screen as PIXELS.

Bitmap and Vector Formats

It is important to know when and where to use one format over the others and why. Below are definitions that will define both graphic formats and when to use which one.

NOTE: It is helpful to think of when working with bitmaps that you are PUSHING on PIXELS and when working with vectors that you are DRAWING VECTORS (Paths).

Converting from one format to another

Sometimes it is necessary to convert from one format to another (e.g., If you are creating a logo, it may be helpful to convert it to a vector format):

Lossless vs Lossy compression

The gif and png formats support lossless compression. In losseless compression the image data is not lost or "throw out" only encoded. Hence, the image quality doesn't degrade as the amount of file compression increases.

In order to get the file size down smaller, it can be compressed using various compression algorithm. One type of compression is called Run Lenght Encoding (RLE).

See Demo below of an example of RLE.

TO ENCODE the image use the formula: 10b, (1b, 8r, 1b)8, 10b

To DECODE the image, the formula is read back to draw (render) the image to the screen in the form of pixels.

The jpg format support the lossy compression which does "throw out" image data.  That why it is not good to recompress an image that has already been compressed.  Image quality DOES degrade as the amount of file compression increases.