COMP 2405 Assignment 1
This assignment involves the creation of some HTML pages. You are forbidden
to use any HTML editor for this assignment. You should do the entire thing by
editing HTML files using a text editor.
General Requirements
For full marks, all your web pages and CSS code must validate
correctly and all your formatting should be done using CSS, either
inline or (in Part 2) as a separate file. You will lose marks for
putting (too much) formatting into your HTML. In particular, you
should avoid using anything other than the class
,
id
, name
, value
, and
href
attributes.
Note that Part 4 of this assignment is the beginning of the web
application that we will be developing throughout this course. Please
give yourself plenty of time to complete it fully so that you get
full marks. If you don't finish it for this assignment you will have
to finish it later (for no marks).
Finally, you should be aware that this assignment, and all others,
will be snarfed from your account precisely at the time of the
assignment deadline and moved into the TA's account. This has two
consequences: (1) any modifications you make after the deadline will
not be seen by the TA marking your assignment and (2) all
hyperlinks and references within your documents must be relative
so that they continue to work even after the assignment has been moved
to the TA's account.
Placement of Assignment Files
All the files you create for this assignment should be in the
directory ~user/public_html/XXXXXX/assn1
and its
subdirectories. Here user
is replaced with your username
and XXXXXX
is the secret subdirectory that was created
when your account was created. This directory should contain a file
called index.html
that contains links to the different
parts of the assignment.
The questions
- [2 marks]
The accounts listed here have been
created on the machine iap.scs.carleton.ca. If your name is not
listed then you are not on the class list. You can still get an
account by sending me an email, but you should make sure you are
indeed registered.
You can login to the machine using an ssh client such as OpenSsh or putty.
Your initial password is your student number. On your first
login, must change your password using the
passwd
command.
You can transfer files to and from your account using scp
(open-ssh), pscp (putty), or WinSCP.
- [10 marks]
For the first part of the assignment, you will make a single webpage
that contains a short biography about one of the Internet pioneers
described in
Hobbes' Internet Timeline. This page should have
- A photograph of the person and their last known address
- A brief biography that includes subsections on Education,
Employment History and any other relevant information
- A list of awards and/or distinctions earned by this person.
- A list of this person's contributions to the development of
the Internet.
- A list of relevant references, including any RFPs, standards,
papers, or books authored by this person that are relevant to the
discussion. If possible, this should include links to online materials.
Each of the above items should be a level-1 heading and there
should be a navigation bar that allows you to jump from the top of
the page to any of these sections. All of this should be
implemented in HTML/CSS without using tables. The design,
layout and color scheme of the page is left up to you, but you
should apply all the CRAP principles and choose a good color scheme (the browswer default is fine).
For this part of this assignment, I don't care if you plagiarize
portions of text from online sources. However, in the references
section you must state clearly where the material comes from and
provide links to the original sources.
- [10 marks]
For the second part of the assignment, you will make a web site out of
the book The Adventures of Sherlock Holmes.
-
The book is divided into 12 adventures. Each adventure should
become its own web page (file).
-
At the top of each adventure (webpage) and at the bottom of
each adventure you will place a menu for jumping to any of the other
adventures. This menu will also have an item entitled "about" (see
item (d), below).
-
Each adventure has several chapters
Each chapter number should be a first level heading.
-
The design, layout and color scheme of the pages is left up
to you, but you should apply all the CRAP principles. In a
separate document, which is available from the "about" menu
item you should give a short discussion describing how each
of the 4 CRAP principles have been used in your design. This
page should also adhere to the CRAP principles.
Like a lot of web site projects, this part of the assignment
involves a lot of tedious work. There is no reason you can not
use your text editor and command-line tools to help do this work
for you. Use this part of the assignment to get yourself
acquainted with working in this environment. If you really can't
stand working in this environment, make your pages locally and
use scp
to copy them to your account on the
server.
- [10 marks]
For this part of the assignment you will build an HTML
form that contains all the information available on a page of a
skydiver's log book.
- Jump number (jumpnum) is a text field in which the user enters a number number
- Date (date) is a text field in which the user enters a date
- Time (time) is a text field in which the user enters a time
- Dropzone (dropzone) is a text field in which the user enters
a location
- Aircraft (aircraft) is a text field in which the user enters
the type of aircraft
- Exit Altitude (exitalt) is a text field in which the user
enters their exit altitude in meters
- Deploy Altitude (deployalt) is a text field in which the user
enters their deploy (open parachute) altitude in meters
- Freefall time - minutes (ffminutes) is a drop down menu from
which the user can select a number between 0 and 5
- Freefall time - seconds (ffseconds) is a drop down menu from
which the user can select a number between 0 and 59
- Manoeuvres (manoeuvres) is a text field in which the user
enters any manoeuvres performed during the dive
- Other jumpers (otherjumpers) is a text field in which the
user can enter names of other jumpers
- Comments (comments) is a text area in which the user can
enter freeform comments
- Signature (signature) is a text field in which the user can
enter the name of an instructor
- When the form is submitted, the data entered in the form is
posted to http://cg.scs.carleton.ca/~morin/cgi-bin/test-cgi.pl.
The layout of the form is up to you. However, your
design should adhere to the CRAP principles. In particular, make
careful use of proximity and spacing so that related parts of the
form are close together. If it helps, you may use HTML tables to
do this, but use CSS to handle the table formatting.