We will make a home page as part of this class' assignment. As in all other topics covered in this class, I shall teach by means of a demonstration, and you will best learn by actually doing it. In fact, I believe this is the only way.
In order to make your own WWW page, you need to first create a file with a text editor of your choice, as long as that editor can save document in an ascii/DOS/text/nondocument mode. You need to learn a set of commands called Hypertext Markup Language (HTML). Many places on the internet has information on this language. HTML commands are enclosed in angle brackets. They are inserted in the text file to control the display format. Graphic files can also be imbedded and displayed. If you have ever used a text formatter such as TeX or troff or if you have ever tried to control a printer by manually embedding printing commands, you will find that it is relatively straightforward to learn HTML. Summaries of HTML are available on, where else, the internet. I found the following links helpful. (Start with the first three links.)
I have collected the commands that I use in a test page, which serves as my own on-line reference. Newer versions of some commercial editors (including Microsoft Word), as well as some HTML editors specially created for writing HTML files, allow you to save documents directly as HTML files, thus saving you some agony. Netscape's Communicator (version 4) and Microsoft's Internet Explorer also each come with a composer. They will perform fine for you, although I have personally resisted using these specialized HTML editors because it is easier for me to learn the few commonly used HTML commands than to master yet another editor. Besides I enjoy the challenge of making things work and the resulting satisfaction when things do actually work. I do not know of any HTML editor that supports all HTML commands. Although there are many HTML commands, only a handful of basic ones suffice to get you started. You can always learn more to achieve fancier effects or compose prettier pages.
The best way to learn is by examples. As you browse the internet, note the pages that are particularly well designed or contain interesting effects. We tend to gain appreciation for aesthetics and artistic styles by viewing other people's pages critically. Unlike most programs for which you do not have access to the source codes, you have full access to all the files that you display with your internet browser, both the HTML source codes and the graphic files -- otherwise, you would not have been able to transfer them in the first place. You can view the source file on the fly with the "View Source" item under the View menu and compare it against the effect you see with the browser. In fact, I learned many neat tricks this way. You can also save them in your own computer to study them in detail. You may make references or links to other people's pages -- after all that is the heart of WWW. However, I cannot emphasize enough that you must not plagiarize other people's work. Too many web pages make links without providing much information. As a result, you can browse a lot but find very little useful information. Web is potentially a bottomless sinkhole of time. High quality, substantive web pages are few in number compared to the total number of pages out there, but it is quite refreshing when you do hit one. Avoid making links to unstable sources that are here today and gone tomorrow. I had to modify many of the links listed two paragraphs above, and I have no doubt that some will cease to work before the end of this semester. One of the disadvantages of the web is that some of the things need to be more stable.
In summary, the steps for setting up the WWW pages are as follows:
http://www.glue.umd.edu/~nsw/ench250/network.htmwhich is a short for:
http://www.glue.umd.edu/afs/glue.umd.edu/home/ench/faculty/nsw/pub/ench250/network.htmThus, the tilde sign"~" here saves the user from having to type a long series of directory path "/afs/glue.umd.edu/home/ench/faculty/nsw/pub/", where my files are actually placed under. Most undergraduate glue account holders have their files placed deep under /afs/glue.umd.edu/home/glue/ instead. All other files can be accessed by an explicit reference to the directory path and file name. For example: an input line "http://www.glue.umd.edu/~nsw/subdirectory/foo.html" fetches /pub/subdirectory/foo.html from a computer named glue.umd.edu. Note that the /pub subdirectory is among the ones that are automatically created for you in wam or glue when you first open your account, the other subdirectory being home, backup and mail. After you log in, wam and glue place you under the /home subdirectory in your user directory. To reach /pub after you login, travel up one directory level, then go down one level to /pub. For example, issuing "cd ../pub" will do.
When you design your web page, keep in mind the users on the other side of the line. There are many things you can do to make your web page a bit more user-friendly. Keep things in reasonably digestible chunks while retain enough information on each page. I tend to be on the plain side when it comes to formatting because not all browsers support fancy tags. Stay close to the least common denominator. Likewise, I use graphics rather sparingly because it takes a long time to download these files, especially when I am at home using a modem. I am also constrained by the puny disk quota the system administrator allows me. Many graphics you find on the internet nowadays look jazzy but really do not add much to the information content. I especially resent being forced to view a large boring picture before text material is presented. Unless I am desperate for the information that may subsequently come up, my limited patience would have normally terminated the transmission. You can prevent this from happening to your page by adding "height=xxx" and "width=xxx" to the "img" tag. Most browsers will allocate the specified amount of space and go on with formatting, displaying the text material around the graphics first. After the text material has been displayed, the web browser will then go back to download graphics. The following html line
<img src="foo.gif" alt="Photo" width=80 height=60>saves 80X60 pixels for a graphics file named foo.gif. You can also use this technique to resize your original picture (whatever the original size) to fit into 80X60 pixels.
Finally, if you keep both a glue account and a wam account and want to update web pages on only one of them, I suggest that you include a simple index.htm in the second account to redirect a browser automatically to the first account. The first account will contain a file index.htm with its usual information, but the second account should contain a file index.htm with the following lines:
<meta http-equiv="refresh" content="0; url=http://www.wam.umd.edu/~xxx/"> <a href="http://www.wam.umd.edu/~xxx/">Go to My Home Page</a>
|
