by Dr. Richard Glass
Dept MAT/STA/CMP
Nassau Community College

Table of Contents
HTML, How Do They Do That
This Page.
Revised:
Resource Page
Links to more information and programs.
Revised:
Web Directory Structure.
Builing links and <IMG> statements.
Revised:
Colors
Changing the colors of your web page and particular text within the page.
Revised:
Graphics
Ideas for obtaining and creating graphics. Some common terms and ideas explained.
Revised:
Tables
An introduction to tables.
Revised:
Tables Part II
Continuation.
Revised:
Tables Part III
Examples using tables.
Revised:
Server Side Includes (SSI)
How to date pages, and do other fancy tricks.
Revised:
WS_FTP
Instructions on WS_FTP.
Revised:
Forms
Creating FORMS and interfacing them to CGI programs.
Revised:
Common Errors
Some commone errors, things to look for and possible solutions.
Revised:
Color Finder.
A Javascript (Beta Version) to find foreground and background colors. Requires Netscape® version 3.x.
Revised:

If you have been wondering about HyperText Markup Language (HTML) and how they make all those fancy pages, well I hope to answer (or at least dispell) some of the myth or curiosities about HTML and creating web pages.

What this document is:
This document is written to give you better idea of what your thought process should be in creating a HTML page. This document is going to assume you have either dabbled with HTML or read one of the fine articles about HTML on the web. In particular, I recommend reading:

A Beginner's Guide to HTML (http://www.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimer.html)
Along with talking about some of the Web development tools Including HTML editors) and possibly where to obtain them (Links to other references and software.)

What this document is not:
This document will not provide tutorials or examples of all of HTML but rather make some suggestions, opinions and ideas for using HTML and Web pages.
It will not provide a discussion of graphics. That will come in another page.

The first myth I would like to dispell is that HTML is not word processing. As it turns out, word processing requires considerable more thought than HTML. When I am using a word processor I start worrying about margins, page breaks, fonts (so many fonts, so little disk space), tab settings, etc. In HTML, there is none of that.

First Some History ...

HTML is a subset of what is called SGML (Standardized General Markup Language). The idea of SGML is to abstract the markup (also referred to as content and context) of text from the actual style (visual appearance). For example, a particular publisher might have a style for displaying the title of an article (say bold, italic, no underline). You as the author only should state that "THIS IS MY TITLE" and let the publisher worry about how to style it. With HTML you are the author defining the markup and your publisher (the web browser you are using to view the net) is defining the style.

What HTML is and is not ...

HTML is not a programming language. There are no conditions, loops, control flow involved. There are no error messages. If I do something wrong it is just thrown away.
For example, this paragraph contains an apparent HTML tag called <JUNK>. Here it is enclosed in plus signs, ++. Want to see it again?
Rather HTML is a throwback to the early word processors (aka text processors). Those programs required the author to place particular characters in their document to perform the markup and style. Until you gave a particular command (such as a print command) you never saw the final product. As the technology advanced, the text processors evolved into what is called word processors and the word WYSIWYG (What You See Is What You Get) was born. WYSIWYG gave instant gratification to the author because the markup (and style) appeared right before your eyes and that was the way it appeared as the final product.

A very good current example of this idea is the Word Perfect word processor. Word Perfect requires the user to understand the idea of "hidden codes". These hidden codes (hidden because you need to 'Reveal codes' in order to see them) define the style. Another analogy is that of TeX or LaTex. These are typesetting programs that allow an author to create the fancy mathematical and scientific characters. In fact, HTML is closer to the latter rather than the former because the 'hidden codes' (referred to as Tags in HTML) are not hidden, they are in plain sight of the author. In fact, by now you know HTML tags are enclosed in <>. One question you may have is how do I get the <> to appear without having the browser interpret them as HTML? The answer is, it uses another tag style. (see A Beginner's Guide to HTML

Actual HTML

The number of elements of HTML you actually need to use in a large number of documents is quite small. The tags are in two forms, containers which have a start and an end tag along with non-containers. The ending container will be just like the starting one except it will have a slash "/" in it. (example: For italics, the text is enclosed in <I> and </I>)
You will need to know about:

  2. The ability to create a list. Lists come in three flavors, In the first two lists above, the items of the list begin with <LI>. There is no closing tag. In fact, I used an unordered list to make this list of lists.
  3. Link (or anchor) to another document or within the same document <A> </A>.
  4. Including an image in you document with <IMG SRC="">.
What you need to remember of the precise HTML tags depends on the editor you use (more on that later). In fact, I remember very little. I let my software do the work.

What is nice about HTML and web browsers is that there is nothing proprietary in viewing the HTML for the document. You the reader are free to see the HTML tags used by the author. All browsers allow you to view the source, the actual terminology may vary from browser to browser but I assure you, that option is there.

If you are using Netscape, go to VIEW choose SOURCE. You will now see in all detail the HTML tags I used in this document.

WYSINWTG - What You See Is Not What They Get)

Based I what I said, there are things you need to concern yourself with and things you shouldn't.

If you are in a windows enviornment try these little exercises. Pull the window tighter in width (say from the right). Notice that the text you are viewing now has automatically been wrapped. There should be no scroll bars at the bottom of the screen (unless of course, you pulled it too tight). You cannot control where words will appear or what will happen to sentences. If it is a paragraph <P> to you, use the <P> and let the browser decide if <P> means "skip line, flush text left" or "newline, indent text".

HTML does allow some style. You can define document colors (text, background or use of a background image) but that also can be overridden by your browser.

For example, you might not be too thrilled about the colors I have chosen for this document. If you are using Netscape it is very easy to change (as with all browsers - I just don't know where to direct you).

If you are using Netscape, go to Options, General Preferences, Colors. Click the custom color box and pick a color - maybe a nice pink, now check the box marked ALWAYS USE MY COLORS, followed by OK). Don't forget to go back and uncheck the box saying ALWAYS USE MY COLORS.

If you noticed that under the General Preferences Option, you can also change the font and the font size try looking at this document with a KIDS, RANSOM or some other silly font). I use a 17" monitor at home so I have my font size set alittle larger than most. On the other hand, if you have a small monitor and are tired of viewing just a few words on a page, set your font size to be smaller.

The colors, text font and/or size is an important and critical option for those who are afflicted with various types of visual impairment. I have known several students who required terminals with large, black lettering on a bright yellow background.

Remember, text size, colors (text and background) can be defaulted to always be a certain STYLE defined by the browser. Anything you see is because your browser is configured that way. Any user anywhere can override the style of the author. In fact, I have heard rumors that there exists information on how to change the effect HTML tags such as the <P> and <I>.

Other pages in this series.

Email