Assignment "HTML"

Learning goals

After the assignment the student should:

Background: The purpose of the assignment is to learn the nature of a markup language such as HTML through hands-on experience. Although this kind of basic editing of HTML is not something you will do often in the future, it is important for you to understand how a language such as HTML works. WYSIWYG (What You See Is What You Get) editors generate HTML for you without providing much insight. It is important that you as professional are able to understand what such editors generate, and thus be able to judge differences, problems, et cetera. Also, you need to be able to understand the source of a Web page and may need to generate HTML in scripts (see further in the course). Last but not least, WYSIWYG editors might not be able to generate the HTML and/or CSS that you want, due to limitations in functionality.

The assignment

Your job is to manually construct, with the help of a text editor such as jedit or emacs, an HTML file that contains the answers to all the Lab questions for Week 1 of the course. The HTML source should meet the following criteria:

  1. It should be a valid XHTML 1.0 document, that is parsed correctly by the W3C Validator. The document should contain the associated W3C validation image.
  2. The document should just contain content markup and no style markup.
  3. The document should exemplify the use of (almost) all HTML constructs listed in the appendix.
  4. Where appropriate, use the HTML representation of special characters.
  5. Include at the end of the document a feedback form consisting of three parts:
    1. A text field for the name of the person giving feedback
    2. A few appropriate boxes/buttons to give an opinion (think of some useful response categories).
    3. A text area for general feedback
    For the moment the form will not do anything interesting other than returning the input entered (this topic is covered further on in the course). Simply include the following attributes in the form element:
        <form action="http://media.cwi.nl/cgi-bin/wt1-test" method="get"> 
      

Hints and Tips

Submission details

Check the Blackboard site of the course for submission details.

Appendix: List of HTML constructs to be used

Document-level elements html, head, title, body, , p
Headings h1, h2, ....
Various list forms ul, ol, dl
Links (external, within same document) a, the id attribute
Tables table, tr, th, td
Images img, caption
Quotes blockquote, q
Text types em, strong, code, pre

Valid XHTML 1.0!