The WebXealot  Page 5

Xara X. Create Bitmap Copy (Continued)

Page 1
Page 2
Page 3
Page 4
Page 5
Page 6
Page 7

Click here to download a Zipped copy of

At the bottom of the Create Bitmap Options dialog are a series of icons that apply to images with 256 colors or less. a. Moving the eyedropper tool over any of the colors in the palette, displays the color values in these three boxes. As RGB: Hex is selected, the three values are displayed in Hexadecimal. b. Lock a Color prevents a selected color from being deleted should you decide to reduce the number of colors. c. Make Web Safe converts a selected color to its nearest Web safe equivilant. d. Transparent Background Makes the color of the page transparent or un-selected objects beneath the selection, transparent. If you select a red circle on a white screen, Xara anti-aliases the red circle to the white screen, and makes the white transparent. If the red circle is on top of a green rectangle, and the green rectangle is not selected, Xara anti-aliases to the green rectangle. The green rectangle itself is transparent. e. Transparent This makes a color selected with the eyedropper (Color Picker) transparent. You need to press Preview to see the results. This is different from Transparent Background as this can be any color within the image itself. f. Delete Deletes a selected color from the image palette and forces Xara to replace this color with a similar color. g. Restore Is grayed out unless a color has been deleted. Pressing Restore un-deletes the deleted color. h. Add System Colors adds 28 colors to the palette. These colors are the regular Windows system colors and a number of primary colors. This ensures the palette includes a spread of colors and may improve the quality of the image, particularly if it contains a wide range of colors. You may need to experiment with this option to get the best results.

Xara uses a small square on certain colors, in the 256 and less color palettes, to identify the properties listed on the left.

On the bottom right side of the color palette are the three Sort By: options, Number of Uses (the default), Luminance, and Hue.

None of these display options affects the final bitmap. They just help visualize the distribution of colors.

As you can see, the rainbow strip at the top of the illustration is heavily weighted to the green colors. You can see this reflected in the three Sort By views.

Number of Uses sorts the colors by the number of times each color is used.

Luminance sorts the colors from lightest to darkest.

Hue sorts the colors based upon their location on the color wheel.

The last area of the Bitmap Options dialog we need to look at is the Dithering:, Palette:, and Color Depth: options.

When TrueColor or TrueColor + Alpha are selected, Color Depth:, Dithering: and Palette: are grayed out.

Dithering, as you may remember from Page 2, is a processes of creating patterns of colored dots, that when placed next to other colors can simulate intermediate colors. For the most part, dithering an image with 256 colors, makes little difference in image quality, but it does increase the file size. Sometimes considerably.

Why? Well, if you remember my comparison of bitmaps and vector images, I described the method a bitmap uses to describe the color of each pixel. GIF images, use a compression scheme in which rather than give the same pixel color description for each pixel in a solid area of the same color, the GIF image says pixels x-y are color such and such. In some cases, this can result in a much smaller file size. When dithering is used, the tiny color patterns of pixels break up the large blocks of the same colored pixels and so more descriptions of individual pixel colors is required.

The image shown here (the red thing is a chili ristra) is a TrueColor 24-bit JPEG color image. With about 20% compression the file size is 10K and the image is very smooth. For a photographic image, this is definitely the way to go.

But what if you are placing text on top of the image. Some of our examples of text and solid areas of color in JPEG images that we saw on Page 3 produced blotchy areas of color. In this case a 256 color PNG image might be better.

Now we get to limited color palettes and dithering. The three pairs of images shown below were produced from the TrueColor image above. All use the minimal 16 Color option and all are just about the same file size, 19K which oddly is almost twice the size of the TrueColor JPEG image.

The three palette options that are available when the image to be created uses 256 colors or less are: Browser, Optimized, and Web Snap Optimized.

The Browser option uses the most appropriate Web Safe colors (a very limited palette of 216 colors). The reds in the ristra look OK but the snow has turned a ghastly shade of green. The dubious benefit of the Browser palette is anybody with a monitor capable of displaying no more than 256 colors at one time (and I cannot think there are many of these around any more) will see the same ghastly green snow).

The Optimized palette selects the best colors to display the image. The reds in the ristra look better in the dithered version and the clouds are smoother. Optimized is my choice for creating 256 color images.

Web Snap Optimized tries to split the difference. Whenever possible, a Web Safe color is used to assure consistency across the board. Again the dithered version is smoother but the reds in the chili ristra are not quite as red as in the optimized version.

Here are the three sets of palette colors. I increased the colors to 256 so you can see each one.

The Optimized and Web Snap Optimized palettes use colors that occur most frequently in the image, while the Browser palette is limited to the 216 colors in the Web Safe palette. It has only found 46 colors that it considers worthy of the image, while the two Optimized palettes use a wide range of more appropriate colors and produce a far better and more faithful image.

So why do we even worry about Web Safe or Browser colors? Well, unless you are designing images to be displayed on dinosaur monitors that can only display 256 colors at one time, and as I said before, I doubt there are very many of these in existence, I would not worry about it. Use the Optimized color palette and you will get the best 8-bit image (256 colors or less).