Digital images and graphics can be broadly classified into two categories, CMYK and RGB depending on their color information.

Images and graphics can also be classified into two categories - Vector and Raster - depending on how information is stored.

CMYK, which stands for Cyan, Magenta, Yellow and Black (K), images are used in the print media such as magazines, newspapers etc. Printing machines use inks of these four colors. Other colors are derived by mixing these four fundamental colors in appropriate proportions.

RGB takes its name from Red, Green and Blue colors. RGB images are meant for display on display screens such as computer monitors, TVs, LCDs, etc. These devices use 3 basic colors and all other colors are made by mixing red, green and blue. For web based graphics RGB images are used.

A bit refers to the smallest amount of information that a computer can process. It might be considered as an electronic pulse that contains either a 1 or a 0 and can either signal on or off. Bit depth refers to the number of bits found in a graphics file or that can be displayed on a monitor.

Pixels are made up of bits. The more bits that are contained in the pixel, the greater the bit depth. The greater the bit depth, the more colors can be displayed at one time. This is also true of a graphics file. Bit depth of a graphics file indicates the amount of color in that file. Greater bit depth brings greater file size. A 4" x 5" RGB photo (24-bit depth) will have a bigger file size than a grayscale image (8-bit depth) of the same size and resolution.

Below is a chart that shows how many colors and bits are contained in each of the modes. The number of channels refers to the number of "plates" of color that a file contains.

RGB images can be stored in various file formats. Common RGB image formats are the TIFF (Tagged Image File Format) and BMP (Bitmap). Most image editing and manipulation tools have their proprietary formats, such as .PSD (Adobe PhotoShop), .PSP or .PSPIMAGE (PaintShop Pro) etc. The JPEG or JPG file format derives from the Joint Photographic Experts Group, the organization that created the format. GIF stands for Graphics Interchange Format.

Common web RGB file formats are .GIF, JPG and .PNG. These formats employ compression algorithms that decrease the file size of the image. Web images are compressed for faster downloading. GIF format uses the LZW compression algorithm (Lempel, Ziv and Welch.) The algorithm builds a color table for an image where each color value is matched to a pixel. Images with large areas of one color will be compressed far better than those that those that do not have such color blocks. Simple images and graphics like line art and logos are well suited to the GIF format.

The JPG compression algorithm works best for images that contain smooth gradients and subtle color variations.
Sharp edges are not resolved well by JPG compression leading to higher file sizes. Text, block color or line art, contain lots of sharp edges and are more suited for the GIF compression algorithm. Highly compressed JPGs exhibit a pixelation resulting from a compression algorithm that samples the image in 8X8 pixels squares.
This compression algorithm makes block images with sharp edges and color changes more complex so the algorithm can better compress it.

Progressive JPEG are displayed in a browser window in a series of passes. First a 'blurred' image is shown, then as more information flows in, the clarity increases. Most image editing and manipulating programs let you indicate the number of passes you want to have in the progressive JPG image. The only disadvantage in using progressive JPGs is that they require more processing power by the client machine and the browser. Interlacing is a method of more quickly diplaying GIF images on a monitor. Interlacing reduces flickering. Using this method,the GIF image is brought onto the screen in a series of passes. Line numbers 0, 8, 16, ... are sent first followed by 4, 12, 18..., 2, 6, 10, 14, ..., and then 1, 3, 5, 7, 9, ...

Anti-aliasing adds color complexity and detail to smooth pixelated edges. Non anti-aliased images can be simple two color GIFs while anti-aliased versions have several added colors. The extra colors are needed to create smooth edges. The additional colored pixels are placed at the edges and carry varying hues of the same color as the object so that they tend to merge with the background giving a smooth look to the edges. Anti-aliasing always increases the file size.

Dithering is a process by which pixels of two colors are used in close proximity to each other so that the human eye is not able to distinguish the colors individually but, rather, sees a new color that is the combination of the two.

Major factors that affect file size of GIF images:

The physical dimensions (width and height) of the image. To optimize GIFs, optimize the dimensions removing all extra parts of the image and size it accordingly.

The number of colors in the image. GIF images can contain only 256 colors. The greater the number of colors in the image the larger the file size. Whenever possible decrease the number of colors in a GIF. The GIF format stores all image colors in a color table. A greater number of colors results in a larger and more complex table and file size.

The complexity of the image. Complexity of GIG images depends not only on the number of colors it contains but also on how these colors are distributed in the image.

Vector graphics refers to the use of geometrical primitives such as points, lines, curves, and polygons, based upon mathematical equations, to represent images in computer graphics. Raster graphics (aka bitmap graphics) refers to the representation of images as an array of pixels. Under certain circumstances vector tools and formats would be the best choice and in other instances raster tools and formats is best practice.