Optimizing Web Graphics | WebReference

Optimizing Web Graphics

Optimizing Web Graphics

The Great Bandwidth Shortage

By Andrew B. King

"The Web seems slow today."

If this lament sounds all too familiar, you are not alone. The network's backbone isn't the problem, it's what happens at each end that frustrates users. The increasing size of digital media and lack of server bandwidth are the main culprits. More bandwidth won't necessarily solve this problem. What will help is minimizing the amount of data that travels through this bandwidth. This article will show you how to minimize file size and dithering for Web graphics.

See also Extreme HTML Optimization and Optimizing Animated GIFs for more tips on optimizing your HTML and animated GIFs.

Bandwidth can be its own enemy, concludes Dr. Sunil Gupta (Gu96). Just as adding more lanes to a highway invites more traffic, increasing bandwidth invites more users. ISDN, cable modems, and ADSL (AD96) will only temporarily ease the congestion. More people will be enticed to sign on, all competing for packets.



ProJPEG 5.1
BoxTop's released a new version of their JPEG cruncher that creates smaller files with higher resolution. 010123
JPEG Cruncher
Another spinoff from Spinwave that uses their fine HVS technology.
JPEG Wizard
Article updated with latest GIF and JPEG optimization tools, including Imageready 2 and JPEG Wizard from Pegasus Software. 000217
JPEG Wizard Service
The JPEG Wizard Online Optimizer is a free service featuring the only true JPEG compression optimization available. The JPEG Wizard will also rotate/mirror your JPEG file with optimization, or completely without loss.
Photoshop 5.5 Review!
Adobe bundles ImageReady 2 and adds many Web features including the innovative Lossy GIF feature. 8-9-99
A new GIF cruncher from Spinwave that utilizes sophisticated color reduction techniques to create low-color, low-banded, static and animated optimized GIFs.
GIF Wizard
This on-line GIF reduction program can reduce GIFs (animated or otherwise) and now JPEG! beyond conventional methods. Combined with the techniques you'll learn here (and in Optimizing Animated GIFs) you can create highly optimized GIFs with less work. GIF Wizard actually automates many of the techniques you'll learn here, and is especially effective for reducing animated GIFs.
Color Blenders - Tools
Color blenders create non-dithering equivalents to any RGB color. DitherBox and ColorSafe both automatically create a 2x2 pixel patters that simulate any RGB color you choose. These blends do not dither as they are made of 2 of the 216 "non-dithering" colors, and from normal viewing distances appear to be one solid color. Useful for backgrounds and larger flat color areas. Designers are no longer limited to 216 colors! 8-2-97
GIF Wizard
Don't miss this on-line GIF reducer. Give it the URL of any GIF or web page and GIF Wizard performs a detailed analysis of your GIF, and outputs optimized versions of it.
Welcome Web Techniques Readers!
This is the expanded version of "Optimizing Web Graphics," which appeared in the Dec. 1996 issue of Web Techniques, pp.55-61.
Both 216-Color Mac or PC non-dithering CLUTs are now available.
To use them download, unstuff/zip, and load as a Photoshop swatch or color table. For more details, read the palette page.

This is an expanded version of an article that originally appeared in the December 1996 issue of Web Techniques Magazine.

Comments are welcome


Created: June 10, 1996
Revised: May 1, 2002

URL: http://webreference.com/dev/graphics/