Tips for using graphics

Building a Web Site
of Your Own

Using Additional Graphics in Web Pages

Several kinds of graphic elements may be added to enhance a web page. Subtle backgrounds, decorative horizontal lines, colorful icons and buttons, as well as pictures are among the kinds of graphics that may be added to a page. Placing graphic alongside text (or integrated within text) is not a natural process for HTML documents, though. Thus, there is a companion topic to the study of graphics on web pages - tables. Tables are used to allow text and graphics to be precisely placed in conjunction with text. So, check out the "tables" portion of session #3 to maximize your control and flexibility of page layout and design. As for graphics, the topics are:

   How to make a background
   How to use different types of lines and bullets
   What are the safe colors
   Where is there support for learning about graphics

[Session 1] [Session 2] [Session 3] [Session 4] [Session 5] [HomePage Overview] [Top]
This site copyrighted (2005) by Dr. Blake West - Please credit when linking to the site!
Kansas NEA - 715 SW 10th Ave. Topeka, KS 66612.

Backgrounds: In FrontPage or FrontPage Express, "Page Properties" are located under the File menu. In either case, it is possible to choose from a list of background colors or to select a background file to be used as a wallpaper background. In HTML, a command to use a background file is incorporated in the opening <body> tag as follows: <body background="filename.gif"> and the command to use a background color (using its assigned hexadecimal code number is as follows: <body bgcolor=#xxxxxx>. The "xxxxxx" in this statement would be replaced with the hexadecimal code.

Lines and bullets: There isn't a quick way to use those cute bullets like the blue squares above. Insert a graphic at the beginning of the line. The same is true with those attractive separator lines. Each is inserted as an individual item - a graphic file rather than being some special HTML code to access a graphic file when the <hr> command is executed by a browser. For lines, don't forget to center the line - or use left justification intentionally, if desired.

Safe colors: Not all browsers or monitors have the same capabilities for displaying colors. As a result, only the 256 colors supported in GIF are considered reliable within a web page. When selecting colors in FrontPage 2000, a palette as shown at right is displayed when the "more colors" button is clicked. By clicking a color & clicking OK, a color may be selected for text color, backgrounds, etc. The hexadecimal code numbers for those colors are displayed on the color palette dialog box when a color is selected.

Samples of the colors with code numbers are also contained in The Design Studio by Molly Holzschlag (recommended before). The list is at her web site at http://www.designstudio.net/.



Support for learning about graphics: Several web sites provide additional information about use of graphics tools. It should also make sense to read any documentation with utilities you might download and then check out some of the reference sites listed below: