Minute Four

Lesson Plan:

Part 1: How to actually make a page.

This is going to be a lot easier than you might think because you make and view web pages on your own computer -- you don't need to be connected to the web or to anything else!

What you need:
Any simple editor (Notepad++ on PCs)
(For Mac users, For Macs, I recommend that you download Fraise (free)
http://www.macupdate.com/app/mac/33751/fraise
Any web browser

Why do you tell me to use Notepad++ -- can't I use Microsoft Word?
The problem is that modern versions of Word will write the HTML for you (so you can quit these lessons right now.) But that is a very different thing from learning how to write it for yourself. Using Word is just not going to work for these lessons.

Part 2: Using your editor

Start your editor

(To find Notepad++ in Windows go to the Start menu and type notepad in the search box.)
Type a web page. What should you type? Well for starters you could just type the sample document from Minute One

Save what you typed as an html document This is the most important part of this entire lesson because if you don't do this, your browser won't know that it should open the file. To save your page as a text document identified as html:

Go to the File menu and choose Save As ....
The Save As dialog box will appear. (The one shown below is from Notepad++)
In the Save As box, Find the drop down menu "Save as type".

Look for the oval in the picture above.

Select the option All Files from the drop down menu as shown above.
(If you are using some program other than Notepad++, the choice may be called something like "text only")

Name your document.
Web browsers recognize html files by the last part of their names so it is very important that your file name end in .htm or .html (that is, a period and the letters htm or html. It doesn't matter which of the two forms you use.)
Note: With some word processors (like MS Word) you may be able to chose a file type of HTML. Do not do choose this. You will be asking the program to write the HTML for you and you will get very strange results. Do not try to use Word for these lessons.

Now finish the Save As ... pressing the Save button.

Part 3: Using your web browser

Find the icon for the file you just created (on the desktop or in the folder that you selected.) Double click the icon -- your browser will open the file.

Otherwise
Start your web browser.

  1. Find the Open File... command In Firefox and Microsoft browsers this command is under the File menu.
  2. Select the Open File... command
    A normal file opening box will appear. (Or, press the Browse button.) Find the file that you made in Part 1 above.
  3. Select your file and press the Open button
Wow! There it is! Your web page is right there on your browser.

Part 4: Shifting between them

Shift back to your text editor.

Change your document. You might add: <H1> I'm Doing it </H1> on the line below the <BODY> command.

Save your document. This is very important because if you don't save it your browser won't know that you've changed it.

Switch to your web browser

Click in the Reload button at the top of your browser screen. This tells the browser to read the file that you just changed and saved. Remember -- until you press Reload you will be looking at the old version of your page.

Switch back and forth. Experiment. Learn.




Prev. Lesson Next Lesson




This page is at: http://drott.cis.drexel.edu/MinuteFour.html
8 Minute Html by M. Carl Drott