Graphics Optimization

Written by Richard Lowe

Graphics images onrepparttar internet come in three major formats: GIF, JPEG and PNG (and PNG's close relation MNG). Each of these formats has it's associated advantages and disadvantages. It is important that you understand all three formats to makerepparttar 134640 correct decision as to which to use under what circumstances.

One ofrepparttar 134641 major factors to consider when choosing or using a graphics format isrepparttar 134642 size ofrepparttar 134643 resultant image file. In addition, you will need to understand how to optimize images in each format to be cognizant ofrepparttar 134644 results that you can gain.

What is image optimization? It is simply defined as findingrepparttar 134645 correct compression settings to makerepparttar 134646 image as small as possible with as little loss of resolution as you can get away with. Why is this necessary? Because it take time for images to be loaded (most people are accessingrepparttar 134647 internet over dialup connections, after all) and optimization reduces that time.

The first and most primitive graphics format is known as BMP, which means bit mapped. These kinds of images may not be compressed as they are simply an exact description of what is to be shown onrepparttar 134648 screen. Each pixel is represented by 3 bytes (red, blue and green), and each byte containsrepparttar 134649 color intensity of it's base color. This BMP images can be made up of 16 million colors. BMP files tend to be very large, and you don't see them directly on web pages very often. Where you will find them is in collections of wallpapers (wallpapers inrepparttar 134650 system directory must be in BMP format), desktop themes and similar things.Because BMP files were much too large for normal web browsing (especially several years ago when virtually every user was not only on a dialup connection, but was lucky to get 4800 or 9600 baud) other formats were invented. Two of these formats became dominant and are now found just about everywhere. These arerepparttar 134651 GIF and JPEG images types. The formats are extremely different and have widely separate applications. Your average web site will generally include a mixture of both formats, as each has their use.

GIF was created by CompuServe in 1987 for their online service. GIF images consist of no more than 256 colors, because each pixel is represented by a single 8-bit byte. This means that in order to convert a BMP image to a GIF image you have to discard all but 256 colors atrepparttar 134652 most!

Each GIF image has a description (known as a header) that definesrepparttar 134653 colors that will be used inrepparttar 134654 image. This allowsrepparttar 134655 colors to be assigned to a code which is what actually appears inrepparttar 134656 image. Thus,repparttar 134657 header might say "red is color #47, bluegreen is color #48" and so on. Later inrepparttar 134658 image,repparttar 134659 colors can be represented as "color #47 is used forrepparttar 134660 next 546 pixels".

Thusrepparttar 134661 optimization of GIF images is fairly straightforward and is handled by virtually every graphics program onrepparttar 134662 market. For example, Paint Shop Pro allows you to export an optimized GIF image with a very cool wizard to help you choose exactlyrepparttar 134663 best options. Usingrepparttar 134664 optimizer it is possible to reduce an image file size by 95% or more! This means a 100k image can be reduced to 5k or less by this method of optimization.

Graphics for the web: JPG and PNG Files

Written by Richard Lowe

JPEG (Joint Photographic Experts Group) is a very efficient, true-color, compressed image format. It uses lossy compression, which means that bits are removed fromrepparttar image in order to save space. JPEG files support millions of colors (compared withrepparttar 134639 256 for GIF).

The JPG format is best for images with gradients, blends, and inconsistent color variations such as photographs or paintings. Images which have well separated tones should be saved inrepparttar 134640 GIF or PNG format. For example, if you include text in your image, you will notice a definite fuzzing ofrepparttar 134641 characters when you view it.

You have several options when optimizing JPG images. JPG is a lossy format (which means it throws away bits), so with each generation ofrepparttar 134642 image you save you will loose information, and that will degraderepparttar 134643 quality ofrepparttar 134644 image.

Any good image editor (Photoshop, Paint Shop Pro and others) will allow you to specify a compression percentage when you saverepparttar 134645 file. Before you purchase a graphics editor make sure it has a preview pane onrepparttar 134646 save so you can see whatrepparttar 134647 compressed image looks like when you save it. This is a lot easier than saving a copy, examining it, resaving it and so on.

JPEG supports a concept similar to interlacing in GIF which is called progressive JPEG. This simply means that a rough image is displayed initially, followed by more and more detail as additional bits ofrepparttar 134648 image are received. This is good for displaying large images. Unfortunately, progressive JPEG is a relatively new standard and is not supported by all browsers.


There is a new format which is threateningrepparttar 134649 supremacy of GIF and JPEG. That format is called PNG (Portable Network Graphics).

Cont'd on page 2 ==> © 2005
Terms of Use