Homepage Constructions 网页建设

[<<Back 返回] [Online Resource Centre 教学材料] [E-Teacher 电子教师]

Basic HTML

Baby Homepage

Now we are going to take our first steps toward putting together a personal homepage for the Web. The language of the Web is called Hypertext, and our homepage will actually be a little program written in Hypertext. We will learn more about Hypertext later, but as you will see, we don't need to know too much about it to begin to do some interesting things.

Constructing a Simple Hypertext Document

If you haven't opened a second browser window already, do so now (by selecting "New Web Browser" from the "File" pulldown menu).

Use your mouse to copy the following text between the horizontal lines:


<html>
<head>
<title>
Baby Homepage for Jane Doe
</title>
</head>
<BODY BGCOLOR="#000030" TEXT="#ff0000"
LINK="#00ffff" VLINK="#00ffff" ALINK="#FF0000">

<center>
<font size="+4">
<b>Local Home Page for Jane Doe</b>
</font>
</center>
<b>
<h1>Some Favorite Web Sites:</h1>
<ol>
<li>
<a href=
"http://www.webteacher.org/">
webTeacher Tutorial</a>
<p>
<li>
<a href="http://www.korrnet.org/fis/FIS.html">
Farragut Intermediate School</a>
</ol>
</b>

</body>
</html>

Open an editor like Notepad or WordPad and paste the text copied with the mouse into the editing window. Save as a new file under the name index.html in your home directory. Now edit this file, replacing the two instances of "Jane Doe" with your name, save the corrections, and hide the editor window.
Use the Browser to open this file in the second browser window by selecting "Open..." from the "File" pulldown menu and navigating accordingly. This should display something like the following, but with your name inserted in place of Jane's:

Local Home Page for Jane Doe

Some Favorite Web Sites:

While still displaying this file, use the mouse to copy the URL address appearing in the Address window.
Open the "Navigation" tab in "Options" (under the "View" menu), select "Start Page" in the dropdown list next to "Page:"; and use the mouse to paste the address into the window for the homepage location (see figure below).
Click "OK" to exit "Options".

Now click the "Home" button on the browser; if everything has gone well, your new personalized homepage should come up as the default homepage. Now every time that you launch the Browser your new homepage will come up as the default document.

Congratulations, Budding Webmeister!

You have just constructed a rudimentary homepage! But this is just the beginning. As we proceed through the tutorial we will add additional pieces to this homepage so that when we are through it will be a personalized template for your use in general Web page design. Ya ain't seen nothin' yet!

[<<Back 返回] [Online Resource Centre 教学材料] [E-Teacher 电子教师]