MCS-270 Lab 1: Basic HTML (Spring 2008)

Check-off lab, done on your own in lab on Friday, Feb 15

Introduction

The purpose of this lab is to insure that you can write raw HTML in an accurate and clear manner. By accurate, I mean that it satisfies the rules of HTML, as verified by an HTML verifier (for example, the one given below). By clear, I mean that it is formatted and indented in a manner that makes it easy to read and (this is important) easy to create and check programmatically when writing dynamic web pages, such as with JSP.

This will be a check-off lab, as we did in MCS273: Introduction to C++ Programming, for those of you that took that course. Thus, I will assign you several relatively simple tasks, and you will call me over when you have finished one or more of the tasks, and I will check you off on it. In case you don't complete the tasks in the lab session, you may show them to me by class day on Monday.

Resources

Tasks

In general, your task is to write a web page that includes several standard HTML constructs. I will check that it does what is needed, is valid, and is written in a good style.

  1. Your first task is to write a complete document (it can be very short) that contains a title, heading tags, and paragraphs. Be sure to give the appropriate HTML version information and default character encoding (this is meta data). You should find the specifications the global structure of HTML documents in the online documentation (to be found at HTML 4.01 Specification (table of contents)), in particular how to give the version information (I recommend HTML 4.01 Transitional for now) and how to specify the charset.
  2. Now use the W3 HTML Validation Service to check that your document is valid. Check-off 1: Show me your page, its validation, and the place in online documentation that describes the global structure of HTML documents.
  3. As I said in class, I find it useful to add some addons to Firefox that are useful for web development. Go to the site http://addons.mozilla.org to get these addons. Two that are useful (Joe Lencioni will talk about them next week) are Firebug and Web Developer, both of which you can get through the search box. Add those two and restart Firefox so that you can see them. Then (using Web Developer) you can validate your current page using Ctrl-Shift-h.
  4. Find the section in the online HTML documentation that describes links, and then add a link to the homepage for this course using an absolute URL. Check-off 2: Show me your page, its validation, and the place in online documentation that describes links.
  5. Find the section in the online HTML documentation that describe images, and add one or two to your document. Check-off 3: Show me your page, its validation, and the places in online documentation that describe links and images.
  6. Find the section in the online HTML documentation that describes lists, and then add an ordered list, an unordered list, and a definition list to your document. Be sure to come up with a consistent and appropriate indentation style. Also, add one or two attribute definitions. (Note that most of them are deprecated, being supplanted by style sheets; the HTML 4.01 Transitional version allows them, whereas the strict version does not.) Check-off 4: Show me your page, its validation, and the place in online documentation that describes lists.
  7. Find the section in the online HTML documentation that describes tables and read through the introduction, especially if you are unfamiliar with them. Add one or two tables to your document. Again, come up with a consistent and appropriate indentation style. Spend a little time looking through the various examples the give, and try out some of the examples, in order to see how you can make more complicated tables. Check-off 5: Show me your page, its validation, and the place in online documentation that describes the tables.
  8. Optional: Find the section in the online HTML documentation that describes Style Sheets. Read through the introduction and try to add style sheets to your document. Actually, Joe Lencioni will be going over CSS next week, so don't worry at all if you don't get to this.