WWW pages are written in HyperText Markup Language (HTML). The hypertext portion means that documents have links to other resources. Those resources may reside anywhere on the Internet. From the users' point of view, this means one can start reading about recent agricultural advances, jump to a page regarding fighting diseases that plague crops, and end up reading about the Scripps Medical Institute in San Diego, CA.

From the HTML writers' point of view, it means there are many different "tags" that exist in an HTML document to control where links go, where and how to include graphics and other forms of multimedia, and how to format the document itself.

HTML is meant to be as generic and widely-interpreted as possible. That means there are limits to what one can do with it. Microsoft Word and other text formatting/layout programs are very flexible and can create documents that can look any way you want them to. That is because those document files only have to be interpretted by one program: the one that created it. Certainly one can save the document in another format, but formatting is lost in the process to a certain degree.

That is exactly what HTML strives to avoid. It is meant to be viewed by Macs, PCs, using all sorts of browsers.

Netscape is one of those browsers, and it is considered the best one. It has the most features and is used by 75% of web browsers. This was caused by, or perhaps was a result of Netscape breaking with standard HTML and adding Netscape Extensions. The Extensions don't work when viewed by other browsers, but only 25% of the web-browsing populace would care!

Basic Elements

HTML documents are formatted using tags. Tags are almost always surrounded with the < and the > symbols. For those of you who have worked with WordPerfect's Reveal Codes command, you will have a better idea of what we're talking about.

There are two types of tags: Paired and UnPaired. A Paired tag is how WordPerfect works: you start the tag where you want the formatting to take effect, and you end the tag where you want to end the formatting. One example is the italics tag. To start italics, you type the tag that looks like this: <i>. To stop doing italics, use this tag: </i>

<i>This is in italics</i>		This is in italics
<b>This is in bold</b>		This is in bold
<center>This is centered</center>		This is centered

These are a few of the character and paragraph formatting tags. I put them here just to illustrate how to use such a paired tag. I'll show you more later, but many of them you'll find out on your own by looking at other web sites.

One of the best ways to learn (and how this author learned) is to click on the menu bar at the top of your Netscape screen on View Source. It will show you what the actual HTML document looks like before being viewed by a browser such as Netscape.

This is the "code" that went into making that Web page! Anyone can view it, copy it, save, and use it for their own purposes. If you see something you like, by all means liberate it!

Creating an HTML File

Look at the top of your screen at the Location Bar. Notice that there is an address: http://falcon.jmu.edu/~jarvislb/htmllesson1.htm
That is the location of that document, where anyone in the world can find it. The http:// portion means that it is HyperText Transport Protocol, which is just a fancy way of saying it's a web document you are viewing. Next comes the computer's web address, which probably goes like this: "www.something.extension". The site doesn't have to start with "www" but many of them do. The "something" is the registered name of that computer on the Internet. The "extension" denotes what sort of site you are looking at. An extension of ".edu" indicates an educational site.

Next may come a bunch of words separated with slashes. This is the file's location on that computer. All HTML documents must end with an extension of ".htm" or ".html".

When you click on a link or type in an web address in the location bar, you are actually requesting the document of that name at that site. Software on that computer that recieves and processes such requests is called a Web Server. When it recieves your request for, say, this document you are now reading, it establishes a connection with your browser. It then shoves the HTML document through the Internet lines into your browser. The browser reads through the document and interprets what's there. If it comes across pure text, like that which you are now reading, it simply puts it on the screen in the default font you've specified in the browser. If it comes across the tags we introduced in the last chapter it formats the text accordingly. If the HTML document requests a graphic image, it looks for it in the proper location then dumps it into your browser as well.

When creating an HTML file, you need to save it in a text format. That means do not save it in a WordPerfect format, or ClarisWorks, or MicroSoft Word's. These programs all default to saving files in their formats. If you use these programs to create HTML files, you need to Save As the proper format. Acceptable formats are text, text with line breaks, and probably DOS text.

What I suggest is the following: use a text editor that just does pure text, such as Windows' Notepad. Another one is on Falcon, called "pico". From your account's prompt, type pico filename.

Once you've created an HTML document, it needs to be placed in a location where the Web Server (Falcon or Raven) can find it. Usually there are special directories (WWW) set aside, where all the files within may be viewed by the Web. If you create the HTML file using an editor on your own computer (Notepad), you need to get it to the Server somehow. We recommend using WS-FTP.

Now that you have your HTML Masterpiece moved into your account on the server, there is a little matter of making your Web-Page accessible to the rest of the world. Here is a quick tutorial for getting your HTML files ready on Falcon. For Web-Pages on Raven, typing loc wwwsetup at the $ command prompt will create your www directory as well as change protection on your files.

Example HTML Tags

<h1>This is heading level 1</h1>		This is heading level 1
<h2>This is heading level 2</h2>		This is heading level 2
<h3>This is heading level 3</h3>		This is heading level 3
<h4>This is heading level 4</h4>		This is heading level 4
<h5>This is heading level 5</h5>		This is heading level 5
This a n example of how Netscape ignores extra white space.		This a n example of how Netscape ignores extra white space.
<hr> This will make a horizontal rule		This will make a horizontal rule
a single-space line break<br>a single-space line break		a single-space line break a single-space line break
a double-space line break<p>a double-space line break		a double-space line break a double-space line break

Your Turn!

<HTML>

<head> 
  <title> 
     This will set the document tile, which appears in top of the window
  </title>
</head> 

<body>

<h1>Your Name</h1>
<hr>
Your Department or Organization
<br>
Here we can just type text as we normally do.  It'll automatically wrap to the
next line in our browser, no matter how we resize the window.  Think of
something pertinent to your dept. to type.

Here is a NonPaired tag. <br> It makes a break in the line.
<br>
Sometimes it's nice to have things in <i>italics<i>. Other times
<b>bold<b> is better.
<br>
Remember: Capital letters in tags do not matter, and white space in your
text is ignored.
<br>


</body>
</HTML>