★ wanayoo — archive 1999 http://webdeveloper.com/drweb/96Apr29-drwebsite.htmlNouvelle recherche | Portail wanayoo
Internet Advertising Report

How to Add Interlaced JPEGs and Animated GIFs

Dear Dr. Website: I've noticed that a lot of Web sites use interlaced GIFs and transparent GIFs. Can you make a JPEG file interlaced or transparent too?

Interlaced, yes; transparent, no.

There is a variant of the JPEG graphics format called progressive JPEG (or p-JPEG) that produces the same result as an interlaced GIF. These graphics first show up as blurred, low-resolution shapes and then gradually appear in sharper focus. This gradual display is a useful effect on a Web site because it gives visitors a quick sense of the image before the loading process is complete.

There are several conversion programs available that enable you to transform ordinary JPEGs into progressive ones. There are particularly quite a few Macintosh programs for converting ordinary JPEGs to the progressive format and back, including JPEG Transmogrifier (also available as a Photoshop plug-in) and Progressify.

More detailed information about progressive JPEGs can be found online at the JPEG Image Compression FAQ.

As for transparency, JPEG doesn't support it, and it is unlikely to in the future. In transparent GIF files, a certain color is declared as the transparent pass-through color; every pixel that has that color value will be rendered transparent. Because a JPEG's compression format causes some data to be lost, a pixel designated the transparent color might be changed to another color—which would produce highly undesirable results and undermine the purpose of the transparent effect.

Dear Dr. Website: I've been hearing about "animated GIFs" and would like to know more about what they are and how they work. Where can I find a program to create one? Also, what is the HTML coding you would use to incorporate an animated GIF into a Web page?

An animated GIF is a single file with multiple images overlaid within it. It can display like a simple "flip-book" animation, using set controls for looping, timing and backgrounds. Because the animating effect takes place within the file itself, there's no additional HTML coding on your end; you embed the graphic in a Web page with a simple <IMG> tag, the way you'd place an ordinary GIF.

Animated GIFs are a boon to site designers who like the impressive look of simple animations on a Web site but want a simpler solution than developing with Shockwave or Java, or linking to video files. Note, however, that not all browsers can display animated GIFs; sometimes only the first frame of your image will appear, statically.

To create animated GIFs, you'll need to produce the individual GIFs that will serve as frames in your animation and then use a program that can save in GIF89a format to preserve the collection of images into a single file. GIFBuilder is a shareware Macintosh program that can help you create animated GIFs. On the Windows side, GIF Construction Set for Windows from Alchemy Mindworks will help you accomplish this.

One site with a great deal of information and links to software resources for creating animated GIFs on various computer platforms can be found at The Toolbox.


Send your site development questions to Dr. Website at webdoc@iw.com, or visit the Ask Dr. Website page.



Reprinted from Web Week, Volume 2, Issue 5, April 29, 1996 © internet.com Corporation All rights reserved. Keywords: graphics design Date: 19960429

http://www.internet.com