In this project, we will be creating our own personal web sites. Since about 1995, web site creation has been a right of passage in the computer field and continues to be an integral portion of many introductory courses. In the beginning... web sites were opportunities to put a little bit of yourself out on the web. Since that time, commercial interests have seized much of the web and now there are numerous free outlets on which to share digital photos, videos, or to write your own blog. In the present, web site development has become more art then technology, but it remains an experience that novice computer users can find engaging, informative and has its own set of puzzles and problems for you to solve.
To create a web site you need three things:
In more detail:
To have a web site you need a web server. This is a machine
that is specially set up to be connected to the Internet and can give
out the web pages that are asked of it. While this type of machine is
not too difficult to set up, it is beyond what this course does. There
are many for free or for pay sites out on the Internet that will happily
host your pages, but in this case the computer science department has a
machine that will hold your pages at least for the duration of
this course and perhaps longer. This machine happens to be called
www.dsm.fordham.edu. However, you will not be interacting
directly with this particular machine.
After you registered for this class, you were given a computer
account on a machine named erdos (more formally,
erdos.dsm.fordham.edu). This account grants you login
privileges, as well as space to store files (called your home
directory), on erdos. Within your home directory, you'll have a
sub-directory named public_html. This subdirectory holds
your website.
You'll be spending a good amount of time (maybe most of your time) working in the departmental computer lab (LL812). When you log in on any of these lab machines, you'll have the same working environment:
You will be creating many web pages using an underlying format called HTML, which is short for "HyperText Markup Language". You can view HTML encoding of any web page you're currently reading, but the exact mechanism for doing this will depend on the web browser you're using, as well as the platform on which it's running. (For example, if you're using Firefox, then you would use control-U on a Linux machine, and command-U on a Mac.) A tab or window will open with what at first might appear as gibberish, but if you look closely it has the very content that you are reading now. Basically all of the "gibberish" is defining the structure of the document. Your instructor may explain more about this but for today you won't need to worry about the details much.
HTML is challenging but certainly not impossible to work directly with. However, we are not going to work directly with it. Instead we are using a program that is designed to aid in Web Site development. There are several such programs including DreamWeaver, Front Page, and even Microsoft Word, and each has its pros and cons. With any of these programs you just type and format as you would a normal document and the HTML will be created automatically for you. For this course, we have chosen a piece of software called KompoZer. It is not the best there is but it is probably better than average. It is also free so you can install it wherever and whenever you like.
Note that KompoZer is installed on all our lab machines, as well as on erdos itself. This means that if you do all your work on the lab machines or on erdos, you should not attempt to install KompoZer yourself. However, should you find it more convenient to work directly on your own personal computer, feel free to do so; simply just follow these directions to install KompoZer.
KompoZer has the nice dual properties of being free and mostly serving the purposes for our course. Note that Kompozer is an unofficial bug-fix of NVU, an earlier free program for building websites. NVU was known to have been problematic at times; it is hoped that KompoZer will behave better. However, if you suddenly lose aspects of its functionality it is recommend that you exit KompoZer and restart it again. If the problems persist then you might want to try to reboot you machine or speak to an instructor.
The following instructions assume that you are working on one of the Linux machines in Room 812. If this is not the case (i.e., you're working at home), see these additional instructions on using Kompozer at a remote site.
First, log in on one of the Linux machines in Room 812.
KompoZer icon on your desktop, simply
double-click it.
cd public_html
kompozer &
The resulting screen configuration will look somewhat like what you see when you use a word processor, but with some telling changes. Look through the menus and check out some of the things you can do. You can insert things such as images, tables and links. You can format text, and colors all over the page. There are limitations to what you can do from here but for a someone new to web development it has just about the right set of "stuff".
Very often, a given website exists in two versions:
This two-step process allows you to proofread your website before you expose it to the entire world.
However, we will use a different tactic. You will be working directly in the "webspace" of the webserver. In other words, any saved changes you make will be immediately visible to the Web. The main reason you will be working this way is that KompoZer does not support something called secure file transfer, and that our web server only uses secure file transfer.
Fill up the existing blank page with the following info
Note: Please do not get the University into legal trouble with your web page. Use no copyrighted pictures, poetry, essays, etc. Post nothing offensive, obscene, or defamatory. No commercial pitches are allowed. It would be a good idea for you to look at Fordham's IT policies, to get more details about what's allowed.
We insist that you include a disclaimer like this one (a link to it like the one on the bottom of my home page will suffice).Periodically you should Save your page. Since this file is the "home page" of your web site (think of it as a "gateway"), it should be saved to a file called index.html. This is important! When you save it for the first time you will want to select the public_html folder of your home directory to save it in. The first time you save a document, KompoZer will prompt you to give the document a title. This is not the name the file will have but what text will appear in the blue title bar of your web browser.
Note that the public_html folder is the starting point for your own webspace. This means that saving your work in the public_html folder of the web server effectively "publishes" your website, making it available to the world. If you don't save your web pages within the public_html folder, they will not be visible to any web browser. Be careful here!!
Well, you web page would be no fun if you can't view it from a web browser. To access your page you need to put int the web address of you page. For now, your page is stored at http://www.dsm.fordham.edu/~username/index.html, or at http://www.dsm.fordham.edu/~username for short. (The comma in the first URL is not part of the URL; it's punctuation.) The username in this case is the one that I gave you for your erdos account. Later we will how to give our web sites have better names, but that is a project for another day.
Make sure you save everything you have done and then view your current version in a web browser. You should also send me an email message, telling me that you are done with Part I of the web project. Now you are all set for today. We will see you next time.
Part I is complete. You may now proceed to Part II.