Introduction
In order to make a perfect web page you must understand all of the commands in HTML that are at your disposal. Armed with this knowledge you can do exactly what you want. Sometimes peoples web pages do not turn out exactly how they wanted them to be because they did not know the command that did exactly what they wanted. In HTML, just as in any other programming language, there are specified commands that tell the web browser how to display the document. These commands are be sent to the browser in the form of source code which is translated into what you see when you surf the net.
There are a great deal of commands in HTML which do a variety of different things. Once you finish this book you will be acquainted with all of these commands and you will be told exactly what they do and how to incorporate them into your web page.
The Head Command
The most basic command, and the first one we will learn, is the head command. Anything on your web page that is not going to appear in the body of your browser will be contained in the head command. The body of the browser is the area that contains the main page, normally the area that has a scroll bar and so on. For example, if you put a title on your web page it will appear in the head command because it does not effect the body of the document. Certain Javascript programs appear in the head of the document because they, possibly, do not run a program that deals with an action that happens in the body of the document. However, you do not always need to use the head command on your page. If, for example, you only have a title and everything else appears in the body of the document then the browser will be able to understand where the title is supposed to go.
In order to use the head command on your page you must enter a command that tells the web browser where the head information begins and ends. The command that tells the browser where the head is begins is an angle bracket < followed by the word HEAD followed by an angle bracket >. After you have entered this command you will then enter anything that is going to go in the head of your page. Once you have entered the items that are going to appear in the head you will then need to make sure that you enter the command that tells the web browser that you are done entering the items that are going to appear in the head and ready to start on something else. This command is an angle bracket < followed by a slash / followed by the word HEAD followed by an angle bracket >. The final source code for the most basic head, which is one that contains nothing in it because we have not learned any other commands yet, would look like this: (Note that the items that would appear in the head would go in between the opening and the closing head command.)
<HEAD>
</HEAD>
The Title Command
The next command we will explore is the title command. This command will give your web page a title when a person views it. If you do not put this command on your web page then the person will just see the address of your web page at the top of their browser. On the other hand if you have a title the person will see that at the top of their browser. This will provide the person a quick, to the point description of your page. If they put your page in their bookmarks that title will appear in their bookmarks pull down menu so that the person will remember what your page is and what it is about. If you do not have a title your address will be put in the bookmarks and the person will have no idea what your page is about and mostly likely discourage them from visiting your web page.
|
|
|
My web page has the title Justin Webers Computing Center, in order to incorperate this into my page I put the commands necessary at the TOP of my HTML document. (You will want to write this document in a Text editor because they are very easy to use to write your page, just remember to save the document as *.html or *.htm.) The title command is designated by an angle bracket (all HTML codes are designated beginning and ending with an angle bracket) < then the word TITLE (this is not case sensitive so you may write it like this: title, or this: TITLE, or this: TiTlE, either way they will do the same thing) then another angle bracket >. Then you type your title.
NOTE: When selecting a title use one that accurately describes your web page, unless your page is a joke:). My page is about operating systems and computers so I chose the title Justin Webers Computing Center, respectively.
To end the title you type an angle bracket < then a slash / then the word TITLE then an angle bracket >. Here is what my title looks like in the HTML code:
<TITLE>Justin Webers Computing Center</TITLE>
That completes the section on the head portion of the web page.
The Body Command
The next command that we will explore is the Body command. This command tells the browser where the body of the HTML document begins and ends. Most of the time the body of the document is anything that you see in the window of the web browser. The body command can contain several modifiers which will change items such as background color, text color, background images, and link color.
When selecting a certain set of colors for use in you web page make sure that they do not conflict with each other. For example, I have stumbled upon web pages that have light green text and plain gray background. This combination of colors makes the page very difficult to view and could turn people away from your web page.
On my web page I use a white background, I actually have an image for a background but that will be discussed later, with blue text. I decided not to include any special color for links so they will be blue as well. In order to tell the browser that I want this done the command in my script must begin with an angle bracket <. After the angle bracket I will need to insert the word BODY. After the word BODY I then enter my list of preferences. The first preference I want to input is the background color. My background is going to be white. This is distinguished by the letters FFFFFF (For a list of all colors and the letters that represent them, see the appendix). I will insert the modifier BGCOLOR=FFFFFF. That is all I need to do to change the color. But I am not done, I want the text of my document to be blue. This is distinguished by the code 0000FF. I will insert the modifier TEXT=0000FF. If I wanted to specify red for the visited link, so that if a person has already gone here they will know it, I would insert the command VLINK=FF0000. And if I wanted the links to be a different color from the text, lets say black, I would insert the command LINK=000000. Then I must end this list with another angle bracket >. At the bottom of the body I will have to insert a command telling browser that I am done with the body. That command would be an angle bracket < followed by a slash / followed by the word BODY followed by an angle bracket >. Here is what the final source of my web page would look like:
|
|
|
<BODY BGCOLOR=FFFFFF TEXT=0000FF>
The body of my code
</BODY>
The final source of the web page with everything I described above would look like:
<BODY BGCOLOR=FFFFFF TEXT=0000FF VLINK=FF0000 LINK=00000>
The body of the code
</BODY>
The next modifier that can be used is the command to add a background. The first thing that we will need to do is find a background. A background is normally a gif file that contains an image that will be repeated over and over again when the browser downloads it. It is not a good idea to have a very big background or have one that is not a design. Next the command for the background must be entered into the top body section of parameters. The command for a background is simply the word BACKGROUND. If you have a gif called background.gif you would enter BACKGROUND=background.gif. It is not necessary to have a background color if you have a background image.
Here is what the final source of the web page above would look like, with the BACKGROUND command inserted where the BGCOLOR command would be:
<BODY BACKGROUND=background.gif TEXT=0000FF VLINK=FF0000 LINK=00000>
The body of the code
</BODY>
NOTE= Be sure to upload the background separately to your web server.
The Paragraph Command
The next command is the paragraph command. This command tells the web browser the paragraph that you are typing has ended. In order to type something in HTML you just type it directly into the source. When you enter the paragraph command this tells the web browser to make skip a small space between what you are typing before the paragraph command and after the paragraph command. Unlike most commands you only need a paragraph command at the end of the paragraph. If you start typing on your web page you would type then, at the end of your paragraph, put the paragraph command then continue typing. The paragraph command may also be used to make a small space between other things like pictures if the break command make too big of a space. (The break command will be discussed later.)
The paragraph command is designated by an angle bracket < then a P then another angle bracket >. When typing, only insert the paragraph command at the end of the paragraph because it will make a space that will be unsightly if the page is not at the end of a paragraph.
The next command is the paragraph command.
<P>
