.
World Wide Web has been with us for a couple of years now. If you haven't been into the Web, now is the time to do it. The reason is not because it's cool. The Web is cool, but the reason that you need to use the Web is because it is the best solution for most of your problems. The World Wide Web has expanded quite rapidly within the last few months and the newest technology makes it very convenient for lay person to be involved with the World Wide Web.
The World Wide Web is designed for ordinary people just like you. Ordinary people do not care about RAM, ROM, and CPU cycles. Ordinary people do care about making their work easier and faster. The Web is designed so it can run on older computer systems, as well as new ones. Ordinary people do not like to upgrade their computer system every year, and purchase new systems every three years. Ordinary people want an easy-to-use, convenient system that they can use to gather information quickly and easily.
If you are one of those ordinary people who thinks that the World Wide Web is a hopelessly complex bureaucratic system, and that writing in HTML code is an extremely difficult programming process, you're not alone. You'd be wrong, but you're not alone. Also a myth is the idea of WYSIWYG (What you see is what you get) in World Wide Web. HTML, the language of World Wide Web, is flexible enough to let the reader, as opposed to the writer, formats the page. This means that the writer would not know what the reader will see, hence no WYSIWYG.
| Side note: Easy to use? How's this for easy to use? You have a big TV with DVD bay. You turn it on, adjust settings with remote control. Then you browse the Web, pointing to things you like to see (touch screen) and tell it things it needs to know (voice recognition). When you're done, simply turn it off. Is that easy to use enough for you? |
Like any new sophisticated technology, you need to learn the Web in order to use it. However, the learning curve is very short in order to use it. Not only that, it doesn't matter what kind of computer you use, so once you learn it on, say, a Macintosh, you can apply the knowledge to IBM PC, Atari, Amiga, or even Network Computer (NC) just the same. In this program, I will show you how to get started, and later on, how to design your own Web page using HTML. We'll go through examples of applications that you can later modify to suit your needs.
The first thing you need in order to connect to the World Wide Web is an internet connection. You can get an internet connection from an Internet access provider. Some companies are already providing Internet access for their employees. If you have to initiate the process yourself, this is the hardest part of World Wide Web, and if you can manage this step, you can be sure to manage the rest.
Some of the more common Internet Access Providers in U.S. are:
The second thing you need is some computer familiarity. At least enough familiarity to type in text into the computer with the keyboard, and the ability to use mouse pointing device well. If you're a veteran word processor and spreadsheet user, then you have all the skills you need in order to browse the web. If you're having a little difficulty using the mouse, then I suggest that you spend some time in a paint program. It will not only improve your mouse dexterity, it will also give you the skills necessary should you ever want to make your own homepage.
| Side note: Most writers who write for knowledge sake have no trouble with HTML, but I guess most people do not write for knowledge sake. Judging by the number of new tags having to do with page layout, either most people write for fluff, or those graphic artists and/or domineering egotist people really do have a very loud voice. |
All right, now you're ready to cruise the World Wide Web. The computer program to do it is called a web browser. Just as you use a word processor to process words, and a paint program to create paintings, you use a web browser to browse the web. The browser is a document reader with the ability to take documents and data from the Internet. Since the data is digital and can represent anything, you can listen to music and watch movies from the Internet.
Since a web browser is a computer program, you need a computer to go along with it. The minimum computer configuration is dictacted by the browser program. In general, the less capable the computer, the less capability your browser has. In this show, we are going to use a Pentium with 8 MB of memory. Although the concept works equally well for people with different computer systems such as Apple, Amiga, and others, we will focus on the most widely available platform currently in the market (as of 1996), and that is an IBM compatible with Windows '95.
As of 1996, you can get a good computer system that will last several years for just under $2,000. If you shop around, you can get a good deal for about $1,500. Avoid the temptation to spend less than that. Most likely, cheap computers do not have enough memory or hard disk space to be of any good use, therefore necessitating costly and inconvenient upgrades.
If you're buying a new computer, I recommend that you get at least a Pentium with 90 Mhz clock speed. At least 16 MB of memory. At least 1 GB hard drive. At least 28.8 fax/modem. At least 2X CD. SVGA monitor. 16 bit sound card. Windows '95 (or '97) upgrade and bundled software. This should cost you less than $2,000 dollars. It's also a good idea to get a color printer along with it. An inkjet printer is inexpensive, yet high quality printer, although it tends to be slow at times.
| Side note: The last thing I want is a two-bit contraption taking over my life! |
If you do get a Windows '95 upgrade, you should have Microsoft Internet Explorer built-in. There should also be an Internet Wizard to help you get connected to the Internet. If you have just purchased a new computer system, take time to learn what the computer can do. This means playing around with the computer for a couple of days. Take time to investigate what each programs on the computer can do. I know this takes a long time to do properly, especially if you're new with the computer. Trust me. The reward is well worth the effort.
If you're quite anxious to see what the Web has to offer without buying a computer, simply go to your local library and check whether or not they have a Web terminal you can use. For starters, I suggest these informative points on the web:
At this point, you should be familiar with what the World Wide Web has to offer: It lets you find information on just about anything. Also, it's very convenient to get. You can get information 24 hours a day. Imagine if you want to know what color is the giraffe's tongue at two o'clock in the morning. You can't go to the library to find out because the library would be closed, and you can't find the answer on TV, either. Well, you can find the answer on the World Wide Web!
Of course, that was just one scenario. Maybe you want to know about news around the world, or the latest scores of your favorite team. There are many news station on the net. Some of them are quite specialized. Here are some of them to get you started:
And, may I point out that it does this without any regards to computer platform, which means that the information is easily accessible whether you're an IBM user, Mac user, Amiga user, Atari user, or Unix user. As far as we know, even television of the future may have the ability to browse the web, bringing a new dimension to the phrase interactive TV
. With the World Wide Web, the Internet has truly become a place for everybody to be.
The World Wide Web provides answers and solutions to all kinds of problems imaginable. Therefore, today's businesses, as well as other organizations, need to be on the World Wide Web, if they want to remain competitive. Just as telephone and faxes changes the business world, and radio and television changes the entertainment circle, the World Wide Web promises to do the same. When computerized catalog invade the library, card catalog system quickly disappeared. Imagine what happens when an always current and updated world-wide telephone directory is available 24 hours a day. Will people look up the yellow pages or call operators instead? Of course, not! They will want to just type in the information on the computer and get the answers within seconds.
| Side Note: To say that HTML is not easy is like saying BASIC is not for beginners. |
HTML, HyperText Markup Language, was created in the need of a universal, easy to use, flexible and powerful presentation format. The format has to be not only accomodating to all computer systems, past, present, and future, but also human readable, so people, not computer, can use it as well.
The format chosen was that of a markup format. This means if you have a paragraph, you simply say "The following is a paragraph" then the paragraph then "This is the end of the paragraph". With this technique, you can specify more than just paragraphs, you can specify the name and location of a document on the Internet.
In fact, the name HTML is very descriptive. The first part is HyperText, for the ability to retrieve documents with just a click of a button. The second part is Markup, for all the marks the document has. The last part is Language, because the computer depends on a particular linguistic styles to make processing the document as simple and easy as possible.
So let's imagine a scenario where you have to distribute a memo for the world. You can use AmiPro, MS Word, WordPerfect, WordStar, and a host of other programs for many different computer system in 30 different languages. Alternatively, you can use HTML format. Now I don't know which one you'd choose, but I know which one I would choose!
|
Side Note: Hello, World! |
The HTML format is like this:
So, in this case we can put "How to work more effectively" in the title and "Do not eat, do not drink, do not sleep, do not take breaks until you get the work done". No! Just kidding! Take a quick look at the example and don't forget to look at the source. It helps if you have a quick reference HTML Guide (for example: Bare Bones Guide to HTML at http:/werbach.com/) for you to look at.
Great! Now you know what each of these tags are for, and how to use them.
See if you can figure out what these are for and how to use them
Why don't you practice some more? Make up some memos for you to write. Here are some ideas to get you going:
| Side Note: Wissy-DON-Wig? Are you sure about this? |
One of the biggest obstacles to writing an HTML document is the notion of Content oriented presentation. The concept of WYSIDNWYG (wissy-don-wig: What you see is definitely not what you get) is very frustrating to many people. Take, for example, tables. When people draw some boxes to make a table, they expect it to stay looking that way. This is not true with HTML. HTML tables may have different line thickness or it may not have any lines at all. Just because it is specified in the document, doesn't mean that it will always be followed.
To give you a quick example of this WYSIDNWYG phenomenon, all you have to do is print this page. Most likely, you'll notice several differences. Since I don't know what your setup looks like, I can only approximate, so please be patient if some of the following does not apply to you:
Due to increasing pressure from HTML writers all around the world, as well as the continuing abuses of HTML tags usage, the WWW consortium has added several tags specific to page layout. It has also approved several attributes for formatting purposes. Attributes are extra information contained in the tags. For example, the Paragraph tag has an attribute for alignment.
<P align=left|center|right>
There is a tag pair for layout purposes. <PRE></PRE> are the tags that you want to use for layout control. It stands for PREformatted. Anything between these two tags are already formatted. You don't want the browser to mess up the formatting that you specify. This way, we can format the pages anyway we want. For example: paragraph with indentation.
This is a sample paragraph. Notice that
the width is fixed just because I purposely
fix it at that width.
This is another sample paragraph. This one
illustrate the hanging indent concept,
so common to the industry.
|
Side Note:
Cheap HTML Doc: <HTML><HEAD><TITLE> Title of Doc </TITLE></HEAD><BODY> <PRE> Docs here... </PRE> </BODY> |
Having said that, let's see what some of the more common content-oriented tags are:
Of course, then there's these talks about multimedia on the Web. Audio, video, and images are the more common elements on the Web. The first images on the Web are in-line images. Images are specified with <IMG> tag. This allows you to put pictures on HTML pages and actually helps to increase the popularity of the Web. All kinds of customizations can be done with it. Image maps, one of the more frequent application of the tag, is very common, nowadays. It is, unfortunately, harmful to page distribution for the page, so please (,please, pleeeeeeeease) use it sparingly.
This is an example of
.
Side Note:
|
Frequently, you don't want to put images, especially large ones, on the page. You simply want to link it from your page. You can use the <A></A> anchor tag. This will let you link anything you want. Anchor tag is one of the more useful tags in HTML. You can use it to link another document, image, video, audio, and a host of other things including Virtual Reality.
In order to use it, all you have to do is give it a URL (Uniform Resource Locator). Or, just a filename if the file is located in the same directory. Here's some examples:
Just to give you an idea how this work, try looking at the example. You can also make a page that contains link to all of your favorite places. It's a good idea to put a picture or two on that page. Also annotate the links so you know where they go. Use it as your own fancy, personal bookmark!
Oftentimes, it is very desirable use different sized fonts, just to make the point clearer. Although this capability is outside the capability of older computers, new graphical computers can do it just fine. Furthermore, the word processor industry has spoiled computer users everywhere to such extent that they also expect to be able to choose which font to use and what color. Knowing that this violates the principles of content-oriented principle, the WWW consortium resisted the idea for months, until everybody uses it, regardless of standard. Of course, just because you use it, doesn't mean that it will be followed. At least now you can make some not so gentle suggestion as to how the document should look.
The following is done with <FONT SIZE=1|2|3|4|5|6|7 FACE="font1[,font2[,font3]]" COLOR=colorchart|RGB>
L e t ' s P a r t y E v e r y b o d y ! H a v e f u n t o n i g h t !
We can also put a picture in the background. The picture will be tiled if it is not big enough. You can also put background music and sound as well. I suggest you use this background sound sparingly. Most dedicated computer people not only have high quality stereo sound connected to the computer, they also surf the Internet from night to morning. It's not nice to have a stereo suddenly blast tunes from William Tell Overture at 2 o'clock in the morning.
| Side Note: What do you mean I can't use my 2400 bps modem, anymore? I paid $300 for that thing! |
Oh, yes. You can also have video and audio play automatically. Needless to say, this is a new invention. They're still working on it, so don't expect to be able to do it for everybody.
There's also a couple tags that are quite popular. Unfortunately, they are browser specific. That is, they only work on certain browsers. As a good HTML writer, I'm sure this presents you no problem. Netscape came up with <BLINK></BLINK> tag. Most people either love it or hate it. It, guess what?, makes the text blinks at the user. Microsoft, on the other hand, came up with <MARQUEE></MARQUEE> tag. It lets text crawl on the page similar to ticker tape effect. Very nice, indeed. A lot of people use it since it allows more material to be shown without taking up too much space.
Of course, not all improvements are useless. One of the most neat and useful is image map. This capability redefines the meaning of point-and-click for the Internet. We'll simply use the overused <IMG> tag again:
Technically speaking, there is no such thing as layout in HTML format. However, we have this <TABLE></TABLE> tag that we can use to format things. Again, this is quite advanced and not all browsers is sophisticated enough to do this properly. Strict adherence to HTML standard aside, using <TABLE></TABLE> tag is the standard acceptable way to lay out your pages. The principle is quite simple.
<TABLE> <TR><TH> Head 1 <TH> Head 2 <TH> Head 3 <TR><TD> Data 1 <TD> Data 2 <TD> Data 3 <TR><TD> Data 4 <TD> Data 5 <TD> Data 6 </TABLE>
| Side Note: This little side note is done using table! |
Each row is preceeded by Table Row tag, each Heading is preceeded by Table Heading tag, and each Data is preceeded by Table Data tag. If you want lines with the table, you can specify BORDER attribute in TABLE tag. Because you're using tables to format the pages, you can't do any fancy formatting options. That's reserved for FRAME tag. However, TABLE is not only quite accepted, it fills in most layout needs.
You can take a look at the example, or you can make some yourself. Here are some exercises to get you started:
The HTTP Server that is powering the World Wide Web, is actually capable of two way communications. This is mostly apparent when using forms on the WWW. Therefore, theoretically everybody can not only browse the Internet, but also send data to it, including sound, pictures, and even programs. Unfortunately, most browsers do not include this capability, even after a tag was proposed just to make life easier for communicating via the Web.
Wishful thinking aside, you can still send images, or just about everything else to the Web. It's just that it's very inconvenient. In this guide, however, we won't go into that much detail. We will discuss CGI scripting only. Even limiting the subject to CGI scripting, there is still a lot to cover, so we will limit it even further to just highlighting the capabilities, rather than the actual implementation. This means that you will know what some of the more common CGI capabilities are and how to design a page using one.
|
Side Note: My name is: My password is: |
The most common technique of implementing CGI scripting is forms, and the easiest forms to do are Fill-in-the-blank forms. Along the way, you'll also encounter check boxes, and multiple choice option (We call this Radio button). This is all basic knowledge. Everybody can do this. Who in the world can't create fill-in forms? You can use this to create surveys, tests, guest books, feedbacks, registrations, and many other applications that requires user input, including purchase forms. And you write all these just by using Fill-in-the blank techniques.
The hard part of it is what goes on behind the scene. What happens to the information entered once the form is submitted? Now, we leave the real world and enter the world of hackers and computer geeks. Well, let's not do that. Suffice to say that it is somewhat complicated, although it is something your average System Administrator should be able to handle. As a non-programmer, all you have to do is know where the information is going, and not how the information got there. And here are some of the more popular destinations for it:
Things get a little tricky when you want the information to be processed. This includes data verification, source identification, auto time stamp, and other little tid-bits associated with sending packet over the Net. Things get even trickier when you want the information processed according to certain rule. This includes search engines, databases, and other custom programming jobs. I suggest you contact your local system administrator for more than a simple fill in the blank forms.
Now is a good time to practice using forms. Try making these forms:| Side Note: If I have to choose a new name for a programming language called Oak, I wouldn't choose Java. Considering that it is an Object Oriented language, I would call it Sycamore, after the tree in Pocahontas, or Og, a phonetic variance of Oak. |
| Side Note: It is as easy to get lost in virtual worlds as it is in real life. The difference is, in real life, you can always call a cab, or ask local residents. |
| Side Note: Auto program update via Net? This smells like another plot for big corporations to take over the life of little people. Another reason to stay off the Net, I should say. |
| Side Note: If I'm elected president, I promise to provide an IP address for every home! |
| Side Note: The big brother is watching! |
We have come a long way. I hope you now have some idea on how to get access to the Web, how to write documents in HTML, and what capabilities the World Wide Web has to offer. I also hope that you are no longer be intimidated with the newest technological breakthrough since computers are really becoming easier to use.
Even if you have no interest in browsing the Web, you should still have a browser in your computer since HTML is becoming quite a standard on the Internet, Intranet, or at home. Even if you use one of those fancy word processor like Microsoft Word or Word Perfect, you owe it to yourself to learn HTML. Use an HTML editor if you must. Two HTML editor that I recommend are:
By concentrating on content, you no longer spend your precious time trying to get the document look just right. Also, the quality of your writing will improve since you end up planning the document from top to bottom rather than piece by piece, thereby gaining the understanding of the big picture. At the very least, it is very easy to do lists in HTML, so if you are one of those people who has been struggling to indent the paragraphs properly in preparing your lists, consider how much easier it would be with HTML.