Registered User Lessons
Contact Us
Home
Understanding HTML is critical to SEO
Submitting your site to Search Engines
How Search Engines Rank a Website
SEO Website Philosophy
How Seo Works
Domain Names and Hosting
Table of Contents
Why this Book?
Lesson Sample:
SEO-HTML Lesson 1
SEO-HTML Lesson 2
SEO-HTML Lesson 3
|
Lesson 3 - Colors
We have learned so far that we can change the face of font using the <FONT> tag and we can change the size of the font.
We can also change the color of the text using the <FONT> tag.
Each of these types:
Are called attributes of the <FONT> tag.
Open one of your html pages and try adding the following line to it:
This color is: <font color="#660000">Dark Red</font>
Save the html page and view it in your browser.
HTML Colors: Hexadecimal
Web pages use the Hexadecimal system for describing colors. You do not need to learn Hexadecimal, you just need to know that it follows
a certain form and then have a color chart to select your colors.
Hexadecimal Color Chart:
| #000000 |
#4A4A4A |
#666666 |
#999999 |
#BFBFBF |
#DCDCDC |
#EBEBEB |
#FFFFFF |
| #693636 |
#996666 |
#D7A4A4 |
#ECB8B8 |
#FFCCCC |
#FFDCDC |
#FFE9E9 |
#FFF9F9 |
| #460000 |
#660000 |
#990000 |
#CC0000 |
#FF0000 |
#FF6666 |
#FF9999 |
#FFF1F1 |
| #570024 |
#990066 |
#C00072 |
#FF0080 |
#FF0099 |
#FF6699 |
#FF99CC |
#FFF1FF |
| #3A003A |
#660066 |
#990099 |
#CC35CC |
#FF00FF |
#FF99FF |
#FFCCFF |
#FFECFF |
| #000044 |
#000068 |
#000099 |
#0000CC |
#0000FF |
#6666FF |
#9999FF |
#E9E9FF |
| #004242 |
#006666 |
#009999 |
#00CCCC |
#00FFFF |
#BFFFFF |
#D7FFFF |
#EDFFFF |
| #004600 |
#006600 |
#009900 |
#00CC00 |
#00FF00 |
#99FF99 |
#CCFFCC |
#EEFFEE |
| #424200 |
#666600 |
#CCCC00 |
#FFFF00 |
#FFFF99 |
#FFFFCC |
#FFFFDC |
#FFFFE9 |
| #501D00 |
#915E00 |
#836611 |
#BD9916 |
#EBB81F |
#FFCC33 |
#FFDC4B |
#FFFFD0 |
| #330000 |
#993300 |
#CC6633 |
#FF6633 |
#FF8000 |
#FF9966 |
#FFCC99 |
#FFF4C1 |
The book goes into greater detail describing hexadecimal, but for now, experiment changing colors of text by cutting and pasting the #HEX color
of your choice from the color chart above, into your html code.
Changing the Page Background Color
Colors can be applied to both text and backgrounds. The simplest way to do this is with the <BODY> tag.
We know that the entire contents of our web page is located between the opening and closing <BODY> tags:
<BODY>
page content here
</BODY>
Anything we do to the body tag, will be applied to the entire page.
Using your text editor, open any of your saved html files and change the body tag to read as follows:
<body bgcolor="#000000" text="#FFFFFF">
Or, cut and paste the following code and view the results:
Background Color and Text Color
View this code as a web page
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Using Colors</title>
</head>
<body bgcolor="#000000" text="#FFFFFF">
<font face="arial">
<center>
<h3>Using the BODY tag to change color schemes</h3>
</center>
</font>
</body>
</html>
|
View this code as a web page
Save your html file and name it: colors.html and view your page. It should look like this:
Body Tag Attributes
The body tag also has attributes. In this case, we are using the bgcolor and the text attributes.
Experiment by cutting and pasting different hexadecimal color values into your body tag, save your webpage and view the results.
|
|