Today, you'll start learning the fundamental features of HTML. As a first step, let's create an example HTML (HyperText Markup Language) file.
Double click "My Computer", and find your personal folder. Double click on it, then create a new folder inside called "cs107webpages". (To create a new subfolder, right click in your folder and choose "New", then "Folder".)
Open up Notepad, and enter the following:
<html> <head> <title>A simple web page</title> </head> <body> <h1>This is the heading</h1> <p>This is a paragraph</p> </body> </html>
Save your file with the name "example.html" in your cs107webpages folder.
Now, launch Mozilla. Once Mozilla gets around to starting up, go to the File menu, select Open, and find your example.html. Select it, and see what happens.
Make some small change in your web page. Add a sentence or something. Save your changes.
Go back to Mozilla and re-load the page. You should see your updates.
Let's make your web page available via the web rather than just via your account. To do so, copy your example.html file into the "webpub" folder that you'll find in your personal folder. Then go to Mozilla and go to the address http://www.people.carleton.edu/~youruserid/example.html, where youruserid> is your Carleton email/login name. Don't forget the tilde(~). You should see your web page again.
Now pay attention for a second: When you save example.html to webpub, you are making the file available to the entire Internet. Google and other web search tools will eventually find whatever you place in this directory. Therefore, I strongly recommend that you show some discretion about what you say on your web pages, and that you use delete or move any files that you no longer want to be in the public space. Your personal folder and all other subfolders from it are not accessible from the Internet, but all subfolders of your webpub folder are. Therefore, a much safer way to work is to do all of your webpage development in a private folder, and only copy it to webpub after it is in a form that you are comfortable with the world seeing.
As you work through the tutorial, store your HTML file in your cs107webpages folder, and view your work by reloading it in Mozilla. Periodically, if you are happy with your web page, copy it to your webpub folder and view it by its http:// address.
Now, on to the main event. Work through this HTML tutorial. Scroll down, start with MiniChapter 1, and get started. You should skip MiniChapters 0 and 10, as these deal with the issues that we addressed above in actually publishing your web page. At the bottom of each page in the tutorial, you can experiment and try out some HTML within the context of the tutorial. This is way cool, but you should also experiment with these ideas in your own web page. Many thanks to Dave Kristula for making this tutorial freely available.
In lab today, or by next class, you should finish the Standard Tutorial (MiniChapters 1-9). If you're interested and want to go further, feel free to do more. We'll stick to the material in the Standard Tutorial as the basis for what we'll cover in class. Bring a list of questions with you to class next time.