.

Lesson 2 - Color
This week you are going to experiment with colors.

If you don't do anything at all, your browser will probably choose gray for your background and black for your text. These are called the default settings.

You can control the background color of your web page by designating a color code for the background in the BODY tag. You can choose your text color and link colors the same way. In addition, the FONT tag can be used to change colors of specific text on your page.

2nd Assignment:
Choose hexadecimal color codes for background and text. And remember! Legibility is everything. Try not to create purple text on a black background, for example.

To change the background and text colors of your program, do this. Open the file that you made last week using Notepad. Find the line that says <BODY>. Change it to this:

<BODY TEXT="#ff0000" BGCOLOR="#ffffff">

Be very careful that spaces, quotes, and everything else are exactly the same!

Save your change in Notepad and open your program in your browser (you don't have to close Notepad).
What do you see?

Now the background should be white and the text red. The six digit number (including letters) that you typed in above is a hexadecimal code for color.
#ffffff is for white, and #000000 is black.
Some of the common colors can be recognized by HTML by their names only. For example the BODY tag above could have been written

<BODY TEXT="red" BGCOLOR="white">

However, there are thousands of possible color combinations and only a few work with names. Many internet sites give color codes. For now, use one of these to choose your colors. In Lesson 10, we will learn more about colors. For the next week, try to get on the Internet and check out one of these sites:

http://www.lynda.com/hex.html
(Go to either the "hue" or the "value" page.)

Or http://hotwired.lycos.com/webmonkey/reference/color_codes/

You can save these color palettes by clicking your right mouse button, then when the browser asks you where to save it, put it on your disc. You will be able to see the graphic later by opening it with your browser. Just be sure that you set the browser to look for "all files" or "gif" files, and not just HTML files.

Here is an example of Trina's first program after she added color codes:

<HTML>
<HEAD>
<META NAME="author" CONTENT="Trina A-11">
<TITLE>Trina's First Web Page</TITLE>
</HEAD>
<BODY TEXT="#ff0033" BGCOLOR="#66ccff">
<blockquote><p><font face="comic sans ms">Hello, this is my first web page.</p>
<p>Hi, this is my second typing on the web page!</font><img src="cuesdclipart/a-ghosty.gif" WIDTH="86" HEIGHT="66"><font face="comic sans ms"></p>
<p>By Trina, A-11</font></p>

<p><font Size="2"><a Href="index.htm">Back to Webmaster Club Main Page</a></font></p></blockquote>

</BODY>
</HTML>

Check it out.

Lesson Index | Webmaster Club Main Page

Copyright ©2000, Marilyn Huffman. All rights reserved.