CMSC 104, Summer 2009

Homework 3 - Part One

Creating a Personal Web Page

Out: Monday, 6/15/09
Due: Wednesday, 6/17/09, before class

Objectives

The Assignment

You are going to create a Web page, using xemacs, in your GL account at UMBC. You can put any content you would like on the page but it must have some sort of theme (such as Movies or Music you like). Your page should contain the following elements (using the tags discussed in lecture):

In addition to HTML, you must use at least 3 of the CSS properties discussed in class.

If you would like to use any advanced HTML or CSS, you are more than welcome. Feel free to be as creative as you would like.

Creating a Web page at UMBC

  1. Log into your gl account.

  2. Move to the parent directory of your home directory. 

    linux1[19]% pwd
/afs/umbc.edu/users/d/b/dblock/home/   
linux1[20]% cd ..
linux1[21]% ls
Mail  backup  home  pub
linux1[22]%

  3. Now, change into the pub directory. Look at the contents of the directory.

    4. linux1[23]% pwd
/afs/umbc.edu/users/d/b/dblock/
linux1[24]% ls
Mail  backup  home  pub
linux1[25]% cd pub
linux1[26]% ls
www
linux1[27]%

  4. Change into the www directory. Look at the contents of the directory. You should see the cs104 directory you created in Lab 2.

    5. linux1[28]% cd www
linux1[29]% ls
cs104
linux1[30]%

  5. I am providing you with a file to get you started. You need to copy the file from my pub directory to your current directory. I have given you the command below. Make sure you type all three parts of the copy command.

    6. linux1[31]% cp /afs/umbc.edu/users/d/b/dblock/pub/CS104/web/index.html .
linux1[32]% ls
cs104  index.html
linux1[33]%

  6. To see the file you just copied in a browser, open Firefox. In the location bar at the top, type the following URL:

    7. http://userpages.umbc.edu/~username

    where username is your UMBC login name. For example, mine would be http://userpages.umbc.edu/~dblock. The page you see should be blank, with the default title at the top.

  7. To edit the file you just copied, open it in xemacs.

    8. linux1[34]% xemacs index.html

    When you first open your file in xemacs, it might ask you for your email address. If it is filled in for you, just hit enter to continue to the file. If not, type it and then hit enter. If it says "Save address for future sessions? (y or n)", type 'y' for yes.

    In order to save as you go in xemacs, just type Ctrl-x Ctrl-s. Once you save, you can refresh the browser window and see the changes you made. In order to save and completely exit out of xemacs, type Ctrl-x Ctrl-c and then 'y' for yes to exit.

  8. Once you have opened the file in xemacs, do the following things:

    1. Add the rest of the required parts of the html document as given in the template in Lecture 6. You can choose any title you would like.
    2. Include an html comment inside of the <head> section that has your name in it and some information about the file. For example: 
        <!-- Filename: index.html
       Name: Ima Student
       Username: astudent1
       Date: 03/05/09
       Description:  This file contains the web page for the first part of Homework 3.
    -->
    3. Continue adding new tags and creating your Web page.

    I would recommend saving your page and checking it as you go. It is easier to debug when you work incrementally. There are no right or wrong answers for this one. Just have fun!