Bitmap and Vector Graphics

What are the differences?

GIF

The Graphics Interchange Format (better known by its acronym GIF is a bitmap image format that was introduced by Compuserve in 1987 and has since come into widespread usage on the World Wide Web due to its wide support and portability.


This is an example of a Bitmap


Disadvantages:

Size


The main disadvantage of a GIF file is its size. GIF files are generally a lot larger than JPG or PNG files, which may cause problems for people who wish to upload files onto the Internet.

Number of Colours


GIF files can only save images in 256 (8-bit) colours and are the oldest way of saving pictures. PNG and JPG files can display in 24-bit colours, allowing for much more complex shades to be shown.



Advantages:


Transparency


GIF files support images containing a degree of transparency, something that other file types cannot do. This trait makes them better suited to such images as icons or logos that require transparent backgrounds to be displayed correctly.


Animation

GIF files have the ability to support simple animations within one file. This normally consists of a collection of images being displayed one after the other to give the illusion of movement.




JPEG

In computing, JPEG - named after its creator the Joint Photographic Expert Group - (seen most often with the .jpg extension) is a commonly used method of lossy compression for digital photography (i.e. images). The degree of compression can be adjusted, allowing a selectable tradeoff between storage size and image quality. JPEG typically achieves 10:1 compression with little perceptible loss in image quality, and is the file type most often produced in digital photography.


This is an exampe of a Bitmap


Disadvantages:
When image files are converted to the JPEG format, significant amounts of information about the image are lost. The compression method is actually called the lossy compression technique. The compression method allows users to save images in relatively small files, but at the cost of image quality and detail. In essence, JPEG images are lower quality than other formats. JPEG does not handle line drawings well, nor does it support animation. JPEG is not suited for images that will be radically modified, since detail is lost each time the image is saved. Another limitation of JPEG is that it does not support layers, a problem for those who want to touch up or alter images. JPEG files cannot have transparent backgrounds, though the background of the photo may be light in color. The JPEG format only uses 8-bits for color data, yielding 16.7 million colors. In contrast, many modern digital cameras can capture color using 10 and even 14 bits of data. This makes JPEG best suited to smooth tone images that have limited color variation or large areas of the same color. For those seeking vivid color images or more color data for subsequent editing, images captured in JPEG are lacking. Taking black and white photos in the JPEG format causes all color information to be lost. The lossless JPEG mode attempts to mitigate the information loss during JPEG compression. However, lossless mode does not allow for the same level of compression that made JPEG so popular, hindering adoption of lossless mode.


Advantages:
The JPEG file format is almost universal. This is in part due to the fact that it has been around for a long time. JPEG files can be opened and viewed in almost all image viewing applications. The JPEG format is also compatible with all printers, allowing users to print JPEG files directly from the viewing application without having to change its format. JPEG is also compatible with practically every photo editing software, though the files often need to be saved to another format to save the alterations. JPEG images are stored quickly by cameras and other devices. This allows users to capture fast moving action with a JPEG image that would be blurry in a higher resolution image. JPEG is often set as the default file format for digital cameras to enable them to take pictures quickly. JPEG files are compressed, meaning that a JPEG image will be smaller than pictures taken in another format. This makes JPEG files easier to store and email. This has made JPEG one of the default file formats for images used on the internet, since the images can be compressed to up to 5% of their original size went transmitted along with a web page’s information.


TIFF

TIFF (originally standing for Tagged Image File Format) is a file format for storing images, popular among graphic artists, the publishing industry,and both amateur and professional photographers in general


This is an example of a Bitmap


Disadvanatges:

File Size


Since compression is not used by default on TIFF files, the file size is generally quite big. This is a big disadvantage of TIFF files. Uncompressed TIFF images can take up a lot more space than a JPEG. This means that digital cameras will not be able to save as many photos in the native TIFF format. It also causes a problem for when sending TIFF's via e-mail, in a lot of cases the attachment size is too big.


Comparison to Other Formats


In comparison to other imaging file formats, TIFF's are not as commonly used due to their large file size. In most cases, TIFF's will be used until a final save is required, this is often done as JPEG format to greatly reduce the file size. The image between a JPEG and TIFF is usually negligible in most cases.


Advantages:

Compatibility

One of the major advantages of TIFF files is that they can be edited with most popular image editing software on the market. All popular operating systems have built-in TIFF viewers. For this reason, people can send TIFF's without having to worry about the recipient not being able to view it.


Compression

By default, TIFF files do not use compression. The big advantage to this is that there is no loss of image detail when a save is made. Saves to the image can be made frequently and no information will ever be lost. Compression is available on TIFF files, most commonly with the LZW algorithm. This however is not universally supported and some software suites won't be able to open TIFF files compressed by LZW.




PNG

Portable Network Graphics) is a raster graphics file format that supports lossless data compression. PNG was created as an improved, non-patented replacement for Graphics Interchange Format (GIF), and is the most used lossless image compression format on the Internet.


A PNG is an example of Bitmap


Disadvantages:

Browser support

Although the PNG images support alpha channels but the unfortunate thing with alpha in PNG’s is that browser support is way behind the times, although slowly catching up. IE6 doesn’t support alpha-channels. Once a new version of IE comes out with this vital support, you should see the effect springing up on trendy designers’ sites across the web.


No Animation

The PNG images also do not support animation. PNG can be made into multi-image files through the MNGextension of the format, but browser support is patchy for this format. Therefore the web designer has to stick with GIFs for creating animations.


Advantages:

Lossless compression

As we have studied in the previous article that JPEG images use the lossy compression and the GIF images use the LZW compression technique. However in contrast to both of them the PNG format uses ZIP compression which is lossless, and slightly more effective than LZW (slightly smaller files).

The JPEG images have lossy compression that means the loss in the quality of images during the compression process. Lossless compression of PNG images means that no image data is lost when saving or viewing the image. This results that there is no loss in the quality of the image when image is saved again and again in PNG image format. On the other side the Gif images use LZW compression technique that does not have any loss in image quality but their file sizes are slightly larger. The lossless compression of PNG images however has lighter weight than the GIF images. Therefore the most important advantage of PNG images is their compression technique in which no quality damage is compromised while compression.

48-bit, true-color depth

PNGs are palette-based, with file size related to bit depth, or the number of colors contained in the palette. In general we can say that in case of PNG images you can use the lowest bit depth that creates an acceptable image. The quality of images and their colors are retained in PNG images.

Varying levels of transparency

In other formats of images there is partial transparency (where a pixel is either transparent or opaque). However in PNG images an alpha channel is supported. An alpha channel can specify the opacity of any pixel from 0–255, where 0 is fully transparent and 255 is fully opaque. This allows you to create a graphic that has no background. Such an image can be placed on top of any other background and will retain a translucent effect, with the background showing through the pixels that are not opaque.

Gamma correction

Another very effective feature of PNG images is the ability to adjust gamma based on monitor settings. Gamma correction means adjusting the color of images on both Macintosh and Windows PC. Normally, the same image viewed on a Macintosh will look much lighter then when viewed on a Windows PC. However by storing gamma information in an image, it can always be viewed the way it was originally intended to be viewed, as long as the application reading the PNG takes note of the gamma.



Best Suited Image

JPG: Digital cameras and web pages normally use JPG files.

TIF: Lossless (including LZW compression option), which is considered the highest quality format for commercial work.

GIF: was designed by CompuServe in the early days of computer 8-bit video, before JPG, for video display at dial up modem speeds. GIF always uses lossless LZW compression.

PNG: Can replace GIF today (web browsers show both), and PNG also offers many options of TIF too (indexed or RGB, 1 to 48-bits, etc). PNG was invented more recently than the others, designed to bypass possible LZW compression patent issues with GIF, and since it was more modern, it offers other options too (RGB color modes, 16 bits, etc).