Video images tend to be rather large (in number of bytes in their file size), and the size is proportional to the size of the image. For example, the following chart shows the size in bytes of different images:
24-bit image size 8-bit palettized ============================================================ Icon size 50x40 6000 bytes 2000 bytes Small image 160x120 57600 bytes 19200 bytes Medium image 320x240 230400 bytes 76800 bytes Large image 640x480 921600 bytes 307200 bytes
There are several things that can be done to cut down the number of bytes needed to show an image. The first is to choose a compressed image format. JPEG and GIF are compressed images formats. Compression ratios are usually 1/5 for GIF and 1/10 for JPEG, which means they will transmit and load faster. Click here to see the WEB page which shows examples of these compressed types.
Another technique is to choose a palettized image, using the correct color palette. Palettized images are created by examining the image pixel by pixel, and making a list of all the colors in the image. There might be 1000 different colors in an image, but some of them are used very often, while others might be used only once in an image. The most used colors are then put in a list which is then attached to the image when its stored on the disk. For example, an 8-bit color palette would have 256 colors in the list. A 6-bit palette would have 64 colors in the list.
The colors that do not make the list are either replaced with the nearest color which is in the list, or by using a technique called dithering the dropped color can be represented by mixing two or more colors from neighboring pixels.
Having the correct palette means that you can display a very high quality image without needing more than a few bits per pixel. This technique is normally used for drawings and other types of images that have few colors. But if you choose the right palette this can used as well for video images.
Choose a great PhotoShop palette. Most image editing packages allow you to choose a palette when an 8-bit per pixel image format is specifies. For example, in Adobe PhotoShop, there is a menu option called "Mode/IndexedColors" where a palette can be specified. The two palette options which can be effective are Adaptive and System. Adaptive will normally give the best results, but the VGA screen may change depending upon what other images are currently being displayed on the screen. The System palette will try to choose the best color matches in the palette that your display is currently running in.
Experiment with the different palettes by saving some images, then simply opening up in your WEB browser by clicking on File/OpenFile. Even though the image is not an HTML document, you will be able to open and see how the WEB browser will show your image. Remember, though, that your system may have a different number of colors which can be displayed then other computers, and it is prudent to run your tests in a 256 color mode.
The highest quality palette is 8-bit Adaptive with Diffusion dithering. But with 8-bits per pixel the image will be larger than necessary. A 6-bit Adaptive palette with Diffusion dithering will give good quality images and are 35% smaller than an 8-bit palette.
Interlaced GIFs are also handy. With interlaced GIFs, the image is transmitted in several passes, so the person viewing your image sees quickly a low quality image which is build up over the next few passes. Interlaced GIFs hold the viewers interest until the entire image can be displayed. JPEG images are also slowly built up, but they are built top down in one pass.
To make interlaced GIFs, you need to be able to save an image in a GIF89a format. LViewPro can be used to import an image an convert it to the interlaced format. When using LView Pro, make sure that you turn off "Save as Transparant GIF" before saving the iamge. Transparent GIFs are good for graphic images, but do not work as well with rich video images. Click here for information on LViewPro.
Questions, comments, or problems regarding this service?