Senior Center of
Charlottesville

Html class at the Senior Center.

Teacher: Gus Goldsmith

1.     Lesson One

To get to Notepad:

1.     Go to Start> Programs>Accessories>Notepad.

2.     Start creating a html file: Start typing the html tag to show that this is going to be a web document. This is to be at the beginning of the document.

3.     Then type the html ending tag for the ending of the the document.

4.     Write some kind of text in between the beginning and the ending. Something like: "My name is... This is going to be in my web folder."

5.     Save as in a file in a new folder.

To create a new folder:

6.     Click the new folder icon on the right hand side of the tool bar.

7.     name the folder "X_Group_ 2"

8.     Save the document:

To save the document :

9.     Click file > save as.

10. Find the path to the folder.

11. Name the file "P_1.html"

12. Choose *all files* as type.

13.                        Click *save*

End of first lesson.

Lesson Two

14. Go to the browser to open your file (internet explorer/nescape)

15. Click*file*

16. Click *open*

17. Click *browse* >

18. Type the *Path* and click *open* (or you can click *refresh*?)

End of second lesson

Lesson Three

Go back to notepad:

o        After the "beginning"tag start a "head"tag. Type: *Senior center of Charlottesville* and another "head" tag to end it. Add the size of font with h1 and/h1.

o        Save and click *refresh* on the web screen to see the result. The *Senior Center...* is in larger print, because h1 means large print.

o        Put the center tag before and after the head line to have the headline centered.

o        Save and refresh to see the result.

o        Put br before *of Charlottesville* . Save and refresh

End of the first week May 16, 20002 ______________________________________________________________________

Senior Center of
Charlottesville

HTML class at the Senior Center (continued with lesson 3)

Teacher: Gus Goldsmith


May 23, 2002

We are trying today to make a sample web page. There are a few things we have to remember as we rewiew some of the items we learned last week:

·         We are writing on Notepad only.

·         The right hand side of the task bar is called the"system tray"

·         Always begin with the beginning tag *html* and the closing */html* tag.

·         The slash has to be the same always, no matter how you call it.

·         Headers go from 1 to 6, the smaller is the bigger print.

Note that there are a few new *things* too:

1.      We can go to *edit*, then click *set font* to change the font size of the text.

2.      We should be consistent about the tag case. If we should choose lower or upper, stay with it all the way through.

3.      *Extension* is what goes after a file name to show its type. Ours are .html.

4.      A pair of tags, the beginning and the closing tags are called a container.

5.      The *refresh* button on the browser menu is between the *stop* button and the *home*. It's a rectangular icon with two arrows pointing one up and one down.

6.      do not leave many windows opened in the task bar. At the time being, we should only have 2 of them working: that is the *notepad* and the *browser* windows.

7.      *b*tags stand for bold, *i*tags for italic. They need to be in pairs

8.      *p* stands for paragraph. You only have to type is once at the end of a paragraph to begin a new one.

9.      tags like *hr* also stand alone. It gives you an horizontal line.

10.  The comment Tags *!-- --* tells you that what is in between does not show in your web site at all.

11.  The same in between the *title* container. What you type in doesn't show.

Lesson Fourth

A sample Web page in HTML

(Note: if you are going to look for books, the HTML for Dummies or the Crafters HTML will do fine, but always find the new edition within 2 current years)

1.      Start by open Notepad, go to Edit, click on *Set Font* and select the size you please.

2.      Type the containers *html* pair.

3.      Type the "comment tag" which is *!--* and have a comment. Note that this does show on your web page at all. I think this is cool.

4.      Type the container *head* pair. Note that what is in between them does not show either.

5.      Type the container *title*. In between the tags the information is not displayed .Type in between the container:"This is my sample web page". This is your page title although it is not displayed.

Now we shall begin our page as it will appear to the browser:

1.      What is in between the *body* tags is displayed. So let's go for it. Type the pair tag *body*.

2.      Choose the size of the header (from h1 to h6)

3.      Type again what is in between the *title* tag which is: " This is my sample web page"

4.      Go to one of the "main" word in the sentence and make it bold.

5.      Go to the same word and make it italic. Remember to close the container.

6.      Use the solo tag *p* to go to another line.

7.      Use both the solo tag *p* and *hr* to make an horizontal line to end Lesson Four.

Finally:

·         Let's save our page as an "all files" type. Click "save" or "save as" depending whether you are working with an old file or with a new one.

·         Open our browser (Netscape or Internet Explorer)

·         Find the path to open our file, click ok

·         Click *refresh* and Voila! Enjoy your creation.

End of Lesson Fourth, second week May 23, 02

Note: Gus won't be here next week. © Jenny 02