|
This tutorial will make use of the text editor found on your computer,
or one that can be downloaded online. Examples are Notepad or WordPad.
You can use the "Edit HTML Source" mode of Claris/Filemaker
Home Page 3.0 if you prefer, but for these tutorials we will concentrate
on using the plain text editors mentioned above. When you open your
text editor, you will see a blank page before you. Now type in the
next four lines exactly as you see them below: (You can always change
your webpage title later on)
<HTML>
<HEAD>
<TITLE>My Simple Webpage</TITLE>
</HEAD>
We open our HTML document with the <HTML> tag. Next we begin
the <HEAD> section, where all information is hidden from view
on the screen, but aids the browser with detecting and displaying
our webpage. We've named our webpage and placed the title between
the - <TITLE> tags. And finally we would close with the </HEAD>
tag. (Other important information can go in this section)
Now we're ready to do the part that shows on the screen. So we're
going to open the <BODY> section. Let's look at the next few
lines of our simple webpage:
<BODY BGCOLOR="white">
<CENTER>My Simple Webpage</CENTER>
<BR>
The first line is our webpage background color, in this case white.
Then comes our webpage title that shows on the screen. Notice it's
sandwiched between the <CENTER> tags. These tags centers our
title on the webpage. Now we want a break between our title and
the next few lines of text. So we use <BR>.
<B>
Welcome to my simple webpage. Below I have some useful links.
</B>
<BR>
We're ready for the first few lines of text on our webpage. We want
this text to appear Bold, so we start with <B>. And after
a couple lines of text, we close with </B>. Starting to see
a pattern here? Next we have another break or <BR>
Now let's put in a couple of links to other sites.
<a href="http://mba.yale.edu">Yale School of Management</a>
<BR>
<a href="http://www.yale.edu">Yale University</a>
</BODY>
</HTML>
The links start out <a href=, then the link address or url, the
name of the link and finally closed with </a>. Now we close
the body section with </BODY> and then finally end our simple
webpage with </HTML>. But we're not quite finished yet...
With our webpage complete we want to save it to file. Go up and
click on File and then Save As. Click on the right arrow on file
types and bring up All Files [**] - now type in simple.html. Now
we've named and saved our webpage as a HTML document, so let's see
how it will look. Go back on your start menu and go on Documents,
you should see simple listed. Click on it, your browser should open
- and you should see your webpage! Make sure you saved it correctly
- simple.html.
I know it's not much to look at - but we will add to it in the next
tutorial.
Onto Step Two: Adding Design and Functionality To The Simple
Web Page
|