Subject: Inline Images FAQ v0.9b
From: (Brian Patrick Lee)

Version 0.9b, updated 11 December, 1994.

Maintained by Brian Patrick Lee (

This document addresses color mapping problems that can arise when WWW browsers that display multiple inline images.


  1. Introduction
    1. General
    2. Inline Images vs. External Viewers
  2. Color Mapping
    1. True Color
    2. Indexed Color
  3. GIFs
    1. Transparency
    2. Interlacing
  4. JPEGs
  5. XBMs
  6. WWW Browsers
    1. XMosaic
    2. MacMosaic
    3. Netscape
    4. Other Browsers With Inline Images
    5. Imageless Browsers
    6. Downloading Inline Images
  7. Image Manipulation Tools
    1. Photoshop
    2. DeBabilizer
    3. Freely Distributable Tools
      1. DOS and Windows
      2. Macintosh
      3. OS/2
      4. Unix and XWindows
      5. Other
  8. Inline Image Tips and Tricks
  9. About This Document
  10. Feedback and Help Requested
  11. Credits
    1. Citing
    2. Copyright



A WWW browser running on a computer with a true-color display could hypothetically display any number of GIFs as inline images with no problems. However, many computers are equipped with 8-bit graphics hardware, which can show severe color mapping problems with multiple inlined images, and many browsers limit and distort inline image palettes, even with true-color displays. The information here is based on problems encountered while developing a WWW server on a Personal DECstation 5000/25 with 8-bit graphics, running Ultrix v4.2 and OSF/Motif v1.2. The WWW browsers used were XMosaic v2.1 on the DECstation and MacMosaic v1.0.3 on an variety of Macs, including an LCIII and a IIvx with 8-bit color graphics. GIFs were manipulated with Adobe Photoshop 2.5 (commercial software) for the Macintosh. All of the examples below are based on the above configurations. Additional contributions were submitted by the people listed in the credits.


Most WWW browsers will display GIFs and XBMs as inlined images, and will launch external viewers to display JPEGs and other formats. With 8-bit graphics, a maximum of 256 colors can be displayed per window; less if the window doesn't have it's own custom palette.

On a true color system, all images could potentially be displayed inline without problems, but many systems don't have true color graphics. With external images, the viewer has the responsibility of rendering the image, and many can be set to use a custom palette and dither true color images. For inline images, however, the browser must do the palette mapping, and browsers vary widely in their ability to display multiple images on page. Browsers also vary widely in their ability to dither images well, even with only one image on a page.

This document can help you create pages with images that will look good on most systems. Hopefully, all browsers will support beautiful, fast dithering and image rendering for 8-bit graphics one day, so this document will become obsolete. Even inline JPEGs must be dithered by a client, so JPEGs are not the final answer, unless browsers do as good a job as external viewers do.

Color Mapping


True color images are stored in a 24-bit RGB format where each pixel in a file can be any one of approximately 16.7 million colors. For example, a 3 x 3 pixel image with the colors red, green, and blue could be represented as:
P        R   G   B       R   G   B       R   G   B
i  1    255-000-000     000-255-000     000-000-255
x  2    000-255-000     000-000-255     255-000-000
e  3    255-000-000     000-255-000     000-255-000
l       (True Color)
Each pixel can have a value of 0 to 256 for each of the three colors, so 256 * 256 * 256 = 1577216 possible colors. Each color, therefore, has it's own RGB values as it is stored.


GIF is the acronym for Graphic Interchange Format. It was developed by Compuserve as a standard to facilitate the display of downloaded images on different computer platforms. GIF images handle simple images with limited palettes best. A line drawing, for example will be very sharp and compress well as a GIF.

The GIF format uses a color table with up to 256 colors. A color table can be global, to be used by all of the GIFs in a data stream, or local, to be used by the GIF immediately following the color table. A local color table supersedes a global table, and if no color table is present, a GIF viewer can use a previously used color table, a system color table, or a color table of its own.


There are two GIF formats: 87a and 89a. Most viewers only support 87a, and Photoshop only produces 87a. 89a has some graphic control extensions, including a Transparency Index, which causes the background color of the display to remain unchanged for the color indexed as transparent. This can create an image that does not show a rectangular border, like a normal GIF or JPEG would.

Transparent GIFs can be used as spacers, to position images evenly, or wherever you want on a page. The best way to do that is to make transparent GIFs that are only 1 pixel high by however many pixels you need in width, so they will download quickly. Using transparent spacers can be very useful to separate images, but when pages are resized or font sizes are changed, the page will be reformatted, so they are not very useful if you want to position an image in an exact, particular way.

Many browsers do not support the transparency function. In order to fake transparency, you can make your background color the same as the default background color of your browser of choice, and index that color as transparent also. Many browsers use a neutral gray of 192-192-192 for their background color. If your image is displayed on a browser with that color as a background, it will apprear transparent whether the browser supports transparency or not.

Make sure that the color you pick as transparent doesn't occur anywhere in the image besides the background, or your image will have ``holes'' in it!


Interlaced GIFs contain the same information as non-interlaced GIFs, but the rows are arranged differently.

Group 1: Every 8th row, starting with row 0. (Pass 1)
Group 2: Every 8th row, starting with row 4. (Pass 2)
Group 3: Every 8th row, starting with row 2. (Pass 3)
Group 4: Every 8th row, starting with row 1. (Pass 4)

When an interlaced GIF is decoded by a viewer, either the viewer de-interlaces the image before display, or the interlaced picture is gradually displayed in the order the rows are stored.

Row                                     Interlace Pass
0  ------------------------------------  1
1  ------------------------------------           4
2  ------------------------------------        3
3  ------------------------------------           4
4  ------------------------------------     2
5  ------------------------------------           4
6  ------------------------------------        3
7  ------------------------------------           4
8  ------------------------------------  1
9  ------------------------------------           4
10 ------------------------------------        3
11 ------------------------------------           4
12 ------------------------------------     2
13 ------------------------------------           4
14 ------------------------------------        3
15 ------------------------------------           4
The format was intended to allow users to view an image with a slow viewer, and get a sense of the overall image quickly. Now, interlaced GIFs are very popular because the Netscape WWW browser displays images as they are downloading, so interlaced GIFs are displayed with gradually increasing resolution. Interlacing is not a feature of Netscape, Netscape just displays them differently than the other browsers.

Both 87a and 89a GIFs can be interlaced, and the files are about the same size as non-interlaced GIFs.

To get more information about the GIF format, see the CompuServe GIF Programming Reference. From a CompuServe account, follow these menus: Graphic Forums, Intro to Go Graphics, Appendices, Download the GIF Specification.


JPEG is a very efficient, true-color, compressed image format. It was designed by The Joint Photographic Experts Group to compress true-color images. JPEG compression works best with photograph-like images, i.e. images that are complex, and have a wide range of colors. An image of a person, for example, usually looks much better, and compresses to a much smaller file size, in the JPEG format, rather than the GIF format. On the other hand, a simple logo or line drawing will usually compress better and come out more detailed as a GIF.

Even with JPEGs, an 8-bit graphics system can only display so many colors, so if many images are on the same page with widely different palettes, the images may get trashed. If an external viewer shows images, most can use a custom palette, so although you'll get some colormap flashing when you go from window to window, the images will each get a custom palette temporarily. If they are inline, it's up to the browser to handle dithering your 256 or less colors to best represent the potential thousands or millions in the multiple JPEGs. Most browsers just limit the number of colors per image as displayed, because colors are allocated in the order the images are downloaded. Although this delays the inevitable, it still leads to the trashing of images once all of the available colors are allocated, and even trashes images if there are still colors left, through palette reduction.


X Bit Maps are two color images, usually rendered with the foreground color as the text color, and the background color as transparent, or the text background color. They are much larger than 2 color GIFs, and are not compressed. XBMs are stored as ASCII. They are 3-10 times larger than GIFs because they are not compressed. They are always the text color and transparent.

WWW Browsers


XMosaic allocates colors in the order the inlined images are displayed. If the first image has 256 colors, and the second image has 256 different colors, the second image will have to use the colors already allocated, and will be messed up. In order to deal with this problem, XMosaic limits inlined images to 50 colors by default. If you load 5 256 color images, each will be reduced to 50 colors, and you will have 5 x 50, or 250 colors. Aside from the 16 colors in the window, and whatever else you have on the screen ``stealing'' colors, it will look pretty okay. XWindows Mosaic does this to reduce the chances of running out of colors with more than one image on a page. This works okay if many images on the same page use different palettes, but looks bad if there are more than 50, but less than 256 colors on a single page.

You can change the default 50 color limit by putting:

Mosaic*colorPerInlinedImage: #

in your .Xdefaults file, where # is a number between 50 and 256 that would suit your needs.

Some colors will still be ``near misses'', but it will look a lot better than the default 50 per image. Also, XMosaic will not have to spend CPU time reducing the palette of an image to 50 colors. If you run out of colors with multi-image pages, though, it will look pretty awful.


MacMosaic seems to do a much better job with color allocation and dithering than XMosaic does, and has no default 50 color per image limit on 8 bit graphic systems. MacMosaic v1.0.3 doesn't support transparent GIFs, but the background color, which cannot be changed, is white. So, you can just make the color you want to be transparent white, and you'll get the same effect.


Netscape does a number of things with inline images that make it a very nice browser to use. In my opinion, Netscape has shaken things up in a very good way, by showing how fast and slick a browser can be. I hope other browsers soon follow suit.


I need more information on the following browsers that support inline images, as well as all of the other browsers available. How well do they render images in terms of quality? What types of inline images do they support (JPEGs, interlaced GIFs, transparent GIFs, etc.). How fast are they? What platforms do they run on? Comparisons would be nice.
Browser        Transparency  Interlace  JPEG   Alt Tag

Air Mosaic              yes     ?       ?       yes
Amiga Mosaic            yes     no      yes     ?
Chimera                 ?       ?       ?       ?
Emacs W3                ?       ?       yes     ?
IBM WebExplorer         ?       ?       ?       ?
NCSA MacMosaic 2.0a3    yes     no      no      no
NCSA WinMosaic 2.0a6    no      no      no      no
NCSA XMosaic 2.1        yes     no      no      no
Netscape                yes     yes     yes     no
Spyglass Mosaic         ?       ?       ?       yes
The Alt Tag column refers to a browsers ability to display the alt text when autoloading of inline images is turned off.


More people have access to Lynx and the CERN WWW line mode (text based) browsers than the browsers that support inline images. So it's nice not to forget about them when you are creating pages. Seeing [IMAGE] all over the place can get pretty annoying, and can easily be replaced.

Instead, use the alt tag:

<img src="big-slow-loading-graphic.gif" alt="Text that describes the image, or illuminates the following passage in such a way that the image isn't sorely missed.">


<img src="big-slow-loading-graphic.gif" alt=" ">

(so imageless browsers won't see [IMAGE] and feel that they are missing something, especially if it's just decorative.)

Some browsers that support inline images, including Spyglass and AIR Mosaic will display the alt text when auto image loading is turned off. This is another feature that will hopefully be implemented by other browsers.

Downloading Inline Images

Many inline images are GIF previews (thumbnails) of images, and have links to JPEGs, so they can be downloaded. If the image is displayed by an external viewer, you can save it from the viewer. However, some images are only viewable as inline images. There are a number of ways to do this.
Copy it from the temp directory.
Figure out where your temp directory is, and copy the image from there. On Unix systems, it's usually /tmp.
Use a screen capture.
Although it's easy to do a screen capture, you will get a rendered version of the image. In other words, your display system may not display the image with it's full resolution, or there may be colormapping problems, etc. If it's a JPEG, you won't get the high-quality compressed version, and if it's a GIF, you won't preserve it's attributes, such as interlacing and transparency. You'll also have to crop the image after the caure.
Download it with a URL.
If you are using an imageless client, you can download images if they have a link, but how do you see the inline images? If you view the HTML source for the page, you can find the tag for displaying the image.

For example, if you see this in the html:

<img alt=" " src="directory/path/image-you-want.gif">

You can use the following URL to dowload the image directly:

If you are grabbing someone else's images, be courteous about it, because you don't want to violate copyrights. Don't just steal them to put on your page; get permission or design your own images.

Image Manipulation Tools


One Palette Per Page

To create the best GIF images for display on systems with 8 bit graphics, using Adobe Photoshop on a Macintosh for image manipulation: This will look great on any color Mac. A default XWindows Mosaic client will reduce each image to 50 colors, but as long as you don't have more than 256 colors on a page, it should look okay.

For display with XWindows Mosaic with the 50 color per image default:

Since colors are allocated in the order displayed, you can reserve colors by simply making sure that they are displayed first. For example, if you have buttons at the bottom of a page that show palette mapping problems, a ``quick and dirty'' solution is to put an insignia or bullet with the same colors at the top of the page. This may not work correctly, however, if someone uses the back button or a link to get to the middle of the page, in which case the top of the page might not be displayed before the buttons.


DeBabilizer is an image manipulation tool that can create a super-palette for a set of images, alter the bit depth, and convert each individual image to use that palette. It also supports scripting to automate the process. It's available from MacConnection for $295.00 for the Macintosh.


DOS and Windows

GIFtrans for Windows
does tranparency and is available at
Graphic Workshop for Windows and DOS
is available at
LView Pro for Windows
does 87a, 89a, and reads JPEGs and is available at
Paint Shop Pro 2.0 for Windows
does 89a, interlacing, reads many formats and is available at
does interlacing and some manipulation of GIFs
TransGIF for DOS
is available at
does interlacing


will interlace GIFs.
is available at


converts BMPs, GIFs, JPEGs, and more, and is available at

Unix and XWindows

is available at
is available at
TransGIF for Unix
is available at
is a set of graphic manipulation and conversion programs available at and
use arguments -ownmcap and -perfect to display images with a custom palette on 8-bit graphic systems. Available at For extensions to write interlaced and transparent GIF files, write to
Other XMosaic
palette mapping problems and solutions, including Unix image manipulation tools, are available at or


is a graphics library that you compile for your platform, and can be found at
DOS, Windows, Mac, Unix, and XWindows
graphic tools can be found at

Inline Image Tricks and Tips


Dan Lottero and I are working on a project called The Online Art Gallery in The Computer Clubhouse @ The Computer Museum in Boston. (It's not online yet.) The Clubhouse is an informal educational environment for 10 to 16 year-olds from underserved communities, where they learn to use computer technology creatively. The gallery features art created by Clubhouse members with Adobe Photoshop. Many of the images use thousands of colors, and have to be reduced to 256 color GIFs to be displayed as inlined images. We decided to go with inlined images for speed and simplicity, and to use the Mosaic window as a ``frame'' for the work. We noticed that the Macintoshes on our network were displaying the images very nicely, even the Macs with 8 bit displays, but they looked horrible on XWindows mosaic. This document is the result of our looking into this problem.


Please send comments, corrections, and additional information to: Maintained by Brian Patrick Lee ( ) This FAQ brings up more questions than answers, so I need some help in the following areas:

All Browsers

I also welcome any comments, criticism, suggestions, etc.


I'd like to thank Dan Lottero for his indispensible help with this document, The Online Art Gallery, and Unix; Dan Ellis for help with XWindows and Unix; and Stina Cooke, Sam Christy, Noah Southall, and the Clubhouse Members for making my job fun and rewarding.

I'd also like to thank the following individuals who contributed via email:

Dwight Hare (
Kee Hinckley (
Frerk Meyer (
Kyle Shannon (
Jim Seidman (
Eric W. Sink ( and
Bjoern Stabell (


Copyright (c) 1994 by Brian Patrick Lee. All rights reserved. This FAQ may be freely redistributed, as long as it is posted in its entirety and includes this copyright notice. This FAQ may not be distributed for financial gain, or incorporated into commercial documents or compilations without the express permission of the author. This FAQ is provided as is, without any express or implied warranty.


If you want to cite this FAQ for some reason, please use the following format: Brian Patrick Lee, ``Inline Images FAQ'', version number 0.9b, December 11, 1994. It would be nice if you let me know about it, also.
HTML version by Kevin Fink.
Last Revision: 4 January 1995.

Kevin Fink's Home Page (