Computer Science 180
Web Design

Fall 2011, Siena College

Lab 1: Basic HTML
Due: 1:30 PM, Monday, September 19, 2011

Your first lab task is, not surprisingly, to build and publish a few simple web pages. This week we will use only the simple HTML tags we have seen so far in class.

Given lab space limitations, at least some of you will need to work with a partner on the first part of the lab then switch accounts so everyone completes the task. Your task for the remainder of the lab is to develop a couple of pages on your own, either during the lab meeting or on your own, and post them to the class development web server before the due date.

Setup and a Very Simple Page

For this part of the lab, you may work alone or with a partner. If you work with a partner and use your partner's account, please switch to your account and repeat the process before continuing.

In your account, create a folder within your Z: drive (your networked file storage area within the School of Science labs) for your web development work for this course. A name like cs180web might be appropriate. Within that folder, create a lab1 folder where you will do your work for this lab.

For now, we will use a plain text editor like Notepad to edit your HTML file. We will use Dreamweaver, a more full-featured HTML editor, later in in this lab and more throughout the semester.

There is a longstanding tradition among many computer programmers that when learning a new language or trying out a new technology, we write a very simple program, often one that prints the message "Hello, World!" before attempting to do anything more complicated (or useful). This ensures we can make use of the computers and software needed to accomplish this task without worrying about trying to do something that might have a higher likelihood of error.

Therefore, the first web page you are to edit and publish will display that "Hello, World!" message.

The following HTML does this job:

<html>
<head>
<title>Hello, World!</title>
</head>
<body>
<p>Hello, World!</p>
</body>
</html>

Enter this HTML text in an editor in the file hello.html in your lab1 folder. You should be able to view your page within a browser as you develop it by choosing the browser's "Open File" option and selecting your hello.html file.

Once you are happy with the page, upload it to your space on the course web server in the folder "lab1". Your file should then be available at the URL

http://j32cool.sienacs.com/lab1/hello.html

where "j32cool" is your Siena userid.

Details about your account on our web host and how to perform the upload will be given during lab.

"About Me" Page

Next, you will develop a "main index" page in your course web space. To do this, you will edit and upload a file index.html.

On this page, include your name, a few paragraphs telling a bit about yourself, and a few paragraphs telling about your home town and one or more of your favorite restaurants there.

Your page should include:

You should be able to view your page as you develop it within a browser, by choosing the browser's "Open File" option and selecting your index.html file.

When you are happy with your index.html and other files (images), you should upload them to the class web server, again in the folder "lab1". The page should be displayed when you visit the URL:

http://j32cool.sienacs.com/lab1/

Main Index Page

Finally, you should develop a main index page for your work this semester, which will be displayed when you visit your default URL:

http://j32cool.sienacs.com/lab1/

This file will also need to be named index.html, so you'll need to create it in a different folder than the one you created for the previous section.

This page need not be very complicated. For now, it should have your name, a section for this week's lab, and a bulleted list of links to the pages you have created and published for this week (the two HTML files in your lab1 folder) within that section. You will update this page after each lab to have links to your work from that week.

Example

You can see Dr. Teresco's demo pages for this assignment linked from the page at:

http://teresco.sienacs.com/.

Submitting Your Work

Before 1:30 PM, Monday, September 19, 2011, submit your files for grading. There are two things you need to do to complete the submission: (i) make sure your page is uploaded properly to the class web space and is available at your URL, and (ii) email a copy of your index.html and any other files to me at jteresco AT siena.edu.

Grading Sheet

This lab is worth 25 points, which are distributed as follows:

> FeatureValueScore
Page Content
Hello, World! 1
About yourself section 1
Hometown restaurant section 2
Main index page 1
Required Elements
Sections 2
Text formatting 2
At least one list 2
At least one inline image 2
At least one hyperlink 2
Style
Proper overall HTML page format 2
Proper use of other HTML tags 3
Formatting of HTML text 2
Submission
Correct filenames and available at correct URLs 2
Email submission 1
Total 25