What is the difference between an interlaced or progressively rendered image and a normal one?

Interlaced or progressively rendered images differ from normal images in how they are displayed. Normal or baseline images are typically rendered from left to right and top to bottom. This means that when a normal image appears on a web page, for example, you have to wait for it to finish loading before you can tell what the entire image is.

Each image format handles progressive rendering differently, but the intention is for you to get an idea of what the image is before it has completely loaded. With many applications that display progressively rendered images, when an image starts to display, it looks out of focus, but as it continues to load, it will become progressively more clear. This is especially advantageous when viewing images over a slow Internet connection.

The protocol for displaying progressively rendered GIF files, called interlaced GIFs, is simpler and somewhat more crude than that for PNG or JPEG files. However, interlaced GIF files are almost universally viewable by applications capable of displaying GIF images. The GIF doesn't display its scanline linearly from top to bottom, but instead reorders it so the content of the GIF becomes clear even before it finishes loading. For example, the GIF viewer may display lines at the top of the image, then in the middle, then at the end, and will continue to fill in the blanks until the image is completely loaded. Many web browsers will use the lines that have been loaded to fill in the empty lines, making it appear as though the image is coming into focus. Interlaced GIFs are often larger than normal GIFs, though the difference is usually slight.

Progressive JPEGs are similar to interlaced GIFs, but the rendering scheme is usually superior to that used with GIFs. With some applications it is even possible to tweak the order in which the scanlines are displayed. The disadvantage of progressive JPEGs is that some applications that can display baseline JPEGs can't handle them. This includes versions of Netscape Navigator prior to version 2.0 and Microsoft Internet Explorer prior to version 3.0. Unlike interlaced GIFs, progressive JPEGs are often smaller than their baseline counterparts; with slower computers, however, they take longer to display.

PNG files are often progressively rendered two-dimensionally. This is done by changing the order in which pixels, as opposed to scanlines, display. While a progressive JPEG or interlaced GIF progressively renders an image by changing the order in which horizontal lines load, a PNG can change the order both horizontally and vertically. This means that an image becomes recognizable even earlier in the loading process.

Also see:

• What is the GIF graphics file format?
• What is the JPEG graphics file format?
• What is the PNG graphics file format?
• How do I make nonrectangular images for my web page?
• What are the differences between the GIF, JPEG, and PNG image formats?
• Using Microsoft Image Composer, how do I save transparent images?