HTML Lesson 8


Don't Forget,

Remember that you can print this page if you want to. At the bottom.


Well! Your moving right along.
Now you know how to copy and paste, save things to your DOCUMENTS FOLDER, create a new folder and you have your very own Tester.

Before we go any further, I think you have learned enough to understand these 2 very important tips.

Before you start writing your web pages and keep them in your documents till your ready to put them on line.

You will certainly be changing things such as words, color's even the layout of your pages, specially once you learn how to do tables.
This is called EDITING.

To edit something you have to find it. This can be very frustrating and difficult since every one is taught to type their HTML tags in a straight line with no spaces inbetween the tags. You let the computer, or your tester, or note pad create their own spaces and break the words to the next line down.

Here's an example of a web page typed the correct way we have all learned to do.

This example is very short compared to a complete full web page.
It is just to give you an idea of what it looks like.

<html> <head> <title>My Web Page</title> </head> <body bgcolor="white"link="blue"alink="green"vlink="red"> <center> <font size="5"color="blue"> MY WEB PAGE </font> </center> <p align="right"> <font size="4"color="red"> <b> Welcome to my site <br /> I have very interesting things to say. </b> </font> </p> <p> <b> It is very important to learn how to set up your writing inorder to <u>edit </u>it easy with out going crazy trying to find things. </b> </p> <p> <b> If you try it any other way, like using your space bar on the key board then the browser gets confused and somethings won't work. <br /><br /><font color="red">; I know this sounds silly or even stupid, but trust me that's the way things are.</font> <br /><font color="green">I am writing all this stuff just to show you how confusing it can look when every thing runs all together.</font> <br /><font color="blue">You would have to read almost every line to try and find what your looking for.</font> </b> </p> </body> </html>


Like I said it's short. Imagine it being 8 or even 10 times longer.

Try finding what your looking for with out getting real upset.

So here's the 2 secret's to organizing your writing so you can find things easy.

1. You "Can Not" use the space bar on the key board to give spaces inbetween the tags, but you CAN use the "Enter" key to move things down to the next line, or several lines down. (For web tv it's your "Return" key)

You seperate your tags using the "enter", (webtv the return) key so they look like this.

Where ever you want to break to the next line. JUST don't ever break a tag in half.



<html>
<head>
<title>My Web Page</title>
</head>
<body bgcolor="white"link="blue"alink="green"vlink="red">
<center>
<font size="5"color="blue"> My Web Page </font;>
</center>

Get the picture? This way you can see things much better.

But wait! There's even an easier way to find things.

2. Leave Comments.

Besides using the enter, or return key you can leave comments.
Beleave me 6 months from now if you go to edit a page you will be so glad you left comments to find things.

THIS is tricky, so listen carefully.
You can leave a comment and the browser gets confused reading it, so it doesn't put it on the screen.

But you have to do it exactly this way.

<!-- my comment -->

You have to put a space (with the space bar on the key board) right after the 2 dashes before your words, and after your words before the 2 ending dashes. Other wise it won't work.

Now here's what your writing will look like. You should be able to find things real easy. Of course you put what ever words you want in the comment tags.
ALSO notice -- No capital letters inside the comment tags.

<html>

<!-- head section -->

<head> <title>My Web Page</title> </head>

<!-- page body -->

<body bgcolor="white"link="blue"alink="green"vlink="red">

<!-- page header -->

<center: <font size="5"color="blue"><b> My Web Page </b></font> </center>

<!-- 1st paragraph -->

<p><font size="3">Hello and welcome to my web site.<br />There wre many interesting things on my site for you to read and learn. Blah Blah Blah and Blah Blah. And so on and so on.</font></p>

<!-- 2nd paragraph -->

<p>Blah Blah and ect. ect. ??????????????????????????????????????????
?????????????????????????????????????????????????????????????????
???????????????????????????????????????????????????????????????
?????????????????????????????????????????????????????????????????
????????????????????????????????</p>

</body>
</html>

Just don't get to crazy with spaces and comment tags.
Make it so it's easy for you to find things but don't confuse the browser to much.

REMEMBER how to write the comment tag.

less than symbol
exclamation ( located on the number 1 key )
dash dash ( located next to the equal = symbol )
space ( use the space bar )
your words
space ( use the space bar )
dash, dash
greater than symbol.
It should look like this <!--  your words  -->

Practice this and you will see just how far you can go.

Great idea! Let's practice this.

Practice 8

Or go back to,
Lesson 7
Lesson 6    Practice 6
Lesson 5    Practice 5
Lesson 4    Practice 4a    Practice 4b
Lesson 3    Practice 3
Lesson 2    Practice 2
Lesson 1    Practice 1
Introduction Page
Home Page