Creating a Color-Savvy Template

Creating a template with positive, correlating colors can be tricky. It is also one of the most important aspects of Web design. The colors you choose will define the mood of the site to your visitors. If incorrectly defined, the site can alienate visitors.

The first step is to understand the theme and mood you want to convey. This example uses a site for a water park. The imagery I want to portray will include water, waves, oceans, beaches, and sun. I hope to present a cool, calm, and relaxing mood. Given these definitions, my colors will be light blues and tans.

Next, consider the graphic formats you intend to use. I plan to use mainly GIF images, so my colors should be selected from the 216 browser-safe colors in the More Colors dialog box. Visit the dialog box and look at the possible colors; then think of the places in your pages where you will need these colors.

To create a template of site colors, follow these steps:

  1. Open a new Web page by selecting File, New. Choose the appropriate page type from the New task pane.

  2. The first colors to select can be found in the Page Properties dialog box. Open this dialog box by right-clicking your new page and selecting Page Properties from the popup menu; then click the Formatting tab.

  3. Select a color for the background by clicking the arrow to the right of the Background dropdown list. Then, select the More Colors option and select light blue (#CCFFFF), and click OK.

  4. Repeat step 3 for selecting a text color. Make sure that the text color has a good contrast to the background color (#000066).

  5. With the Page Properties dialog box still open, select Hyperlink (#0000FF), Visited Hyperlink (#0000CC), and Active Hyperlink (#000099) colors.

  6. With the Page Properties colors defined, add some text to the page to check the results.

  7. Next, add a table with the Table, Insert, Table menu and open the Table Properties dialog box. Set the Background color to be the same as the page background, and select some colors for the border (#FFCC99), light border (#FFFFCC), and dark border (#FFCC66).

  8. Add a Horizontal Line by selecting Insert, Horizontal Line; open its properties dialog box. Select its color to be the same as the dark border color on the table (#FFFFCC).

  9. Finally, save the page as a template by selecting File, Save As. Select FrontPage Template in the Save As Type dropdown list. In the Save As Template dialog box, include the colors used in the Description box.

Once you've created a color savvy template through this method, you can use the template throughout your Web site and even forward the template for use by others on your team.

You can also use the same approach to develop one of the new Dynamic Web Templates.

For more about the use and design of Dynamic Web Templates, see "Dynamic Web Templates," p. 411.




Special Edition Using Microsoft Office FrontPage 2003
Special Edition Using Microsoft Office FrontPage 2003
ISBN: 0789729547
EAN: 2147483647
Year: 2003
Pages: 443

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net