After the qwe cluster account is created, you should log in either at one of the computers or remotely using ssh and change the password. Instructions for doing these things can be found at http://www.math.cmu.edu/support/faq.html. Once the account has been setup, it is easy to create a webpage. Simply change into the “public” directory and create index.html. HTML files are a special type of text file. They can be created by hand in a text editor such as vi, pico, emacs, etc., or a more specialized application can be used such as Microsoft FrontPage if a machine with Microsoft Windows is available. If files are created on another machine, they must be relocated to the qwe cluster when they are finished using scp. How to do this is also described on the faq site. This technique will also need to be used to put other files onto the cluster, such as supporting image files, etc. But the most important thing for creating a webpage is HTML. The ability to create hyperlinks in HTML makes web pages very versatile and dynamic—rather than being a flat document of text and images, pages can reference other pages, which can be changed/updated totally independently. Because of this, this tutorial will now concentrate solely on the basics of HTML.
HTML is an acronym for hypertext markup language. It is a language used to convey formatted documents, including images, fonts, colors, positioning, etc. As mentioned previously, it also allows for hyperlinks to other documents. The basic structure of an HTML document is to put text within a set of nested tags. Tags are of the form <tag> and </tag>. The tag with the slash indicates the end of the corresponding tag. So for example, all HTML documents begin with the tag <html> and end with the closing tag </html>. Between the <html> and the </html> tags are the text of the document, as well as other tags. Most documents start with a <head></head> tag pair at the beginning of the document. The head contains various metadata about the document and can include a <title></title> tag pair. Whatever (unformatted) text that goes between the <title> and </title> tags will be displayed on the title bar of the user’s web browser. After the <head></head> pair generally comes the <body></body> tag pair. As one might expect, everything that is to be in the body of the document is placed between these two tags. So for the index.html that we are currently creating, this is what we should have so far:
<html>
<head>
<title>
Here is my website
</title>
</head>
<body>
</body>
</html>
What actually goes between the <body> tag and the </body> tag totally depends on what the page is going to contain. To try it out, you might type just Hello World. Once the file is saved, it can be viewed by opening a web browser and opening the page. It will be located at http://www.math.cmu.edu/~USER where USER is your user id. If everything has been done correctly, it will show “Hello World” and the title bar of the browser will say “Here is my website”. If you wish, you can create other files with other filenames (but they should still be called something.html so that the browser can identify them as an HTML document). If there were another page called foo.html, it would be found at http://www.math.cmu.edu/~USER/foo.html. The filename was not needed before because index.html is assumed when there is no filename specified in the address.
Now all that’s left in creating a webpage that looks the way you want it to look is finding the appropriate combination of tags. There are actually many, many tags so rather than trying to list them all here, I will provide some hyperlinks to references about the different HTML tags. Another good reference is to view the html source to this document. You can do this by finding the “view source” option in the browser. Another good reference would be the source to my main site, located here.
Here are some comprehensive references for HTML tags: