GIF Backgrounds 2

1 ( 242 bytes )


Diagonal Stripes?

Diagonal stripes can be produces with this GIF BG (background) patterning technique, but a little care must be used in creating the pattern. Look at example 1, diagonal stripes are used in the BG tile, but since there is no way to offset the tile in alternating rows, the resultant BG has no diagonal stripes. Instead it looks like that in example 2. (frizz!)

Care must be taken in designing a continuous background that contains anything other than horizontal of vertical elements. All of the background GIF images A, B, C, and D are taken from the same general diagonally striped pattern.

The ratio of height to width is 1:1 in A, 1:2 in B, 2:1 in C, and 2:2 in D. At first glance one can almost visualize the type of pattern that would be created, and with no additional thought each might be thought to produce the same background.

The actual patterns produced (although reduced in size) are shown just below, and each of the GIF tiles produces a unique background, with only the D pattern producing diagonal stripes. The horizontal offset of the pattern in D exactly matches the vertical offset, and thus all lines meet and fit properly with their associated tiles.

In the other cases, B and C, there is a proper meet on the horizontal and vertical sides respectively, but not in their opposite planes. A - produces a unique pattern with no meets on the horizontal of vertical sides.

Pattern A GIF - 294 bytes
Pattern B GIF - 347 bytes
Pattern C GIF - 447 bytes
Pattern D GIF - 494 bytes

The file size is inconsequential for any of the background tiles shown. The colors were selected here to emphasize the pattern, and are too dark for actual background use in a document.

General Rule:
To be successful, a background pattern must be designed with sufficient contrast to make the foreground text standout as clear, distinct and readable. It should not compete for the center of attention.

The WEB palette , containing only 216 colors, does not have many pale colors suitable for background work. A few of the limited combinations are shown in E, these are the lightest hues available (other than white). Two of the resultant backgrounds are shown (full size) in F and G with black text. The selection of light colors for use in busy backgrounds is limited in the WEB palette.

Figure H show the WEB palette organized by luminance, the lightest colors are shown horizontally across the bottom. Only a few of the colors on the bottom, horizontal line, would be useful in producing light patterned backgrounds.

The palette has a wider range of dark colors that be used to produce dark backgrounds with light colored text (examples I & J). Colors in the middle tones of the palette are poor choices for background patterns as they would compete too strongly with both light, and dark colored text.







Menu Bar