Graphic Control Web Group Planning
Solutions
Innovation
Experience
Testimonials
TechSupport
 
 

 

 

Design Notes:
The gray and black background is a large background image (two-color GIF, 1100 pixels wide, 925 pixels high). Even at those expansive dimensions it compresses to 5.5 kilobytes.

The background text was set as aliased text to eliminate any extra colors created by anti-aliasing, which resulted in a smaller file size.

To accomplish the desired overlapping alignment of the background image (the large, dark gray type) and the main elements of the page (the headline and the navigation images/text), we set the margin values to zero in the BODY tag (You can add the following code manually, or, if you use Dreamweaver, go to the “Modify” menu and select“ Page Properties...”) :

leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"

Our page looked correct in Internet Explorer, but the alignment was not correct in Netscape. We changed the margin values to:

leftmargin="0" topmargin="40" marginwidth="0" marginheight="40"

This change made the page look correct in both browsers.

The dominant vertical strokes of the type design minimized the curved areas that render as jaggy shapes. The low contrast (dark gray against black) also minimizes the jaggy effect.

The anti-aliased headline was saved as a transparent GIF with a black matte color around its edges.

The nav photos and nav text were saved as transparent GIFs. Since the nav text was aliased (jaggy) it wasn’t necessary to apply a matte color to the edge.

Limited color palettes can be as dramatic as unlimited color.

Contrast (two dark colors for a background/bright blue, yellow-gold, and white for foreground elements) adds visual interest and aids legibility.

Fonts
Headline: Impact