Assignment 1: Portfolio Web page

Due: 5pm, Tuesday, January 31. Value: 20 pts. You may work with one other student on this assignment if you wish. Submit to Sauron.

Write a page conforming using HTML5 and CSS2.1 for displaying your own professional portfolio. It should satisfy the following requirements:

Both the HTML and the CSS should be hand-coded using a text editor, where you are directly editing the HTML tags appearing within the file.
The HTML should reference at least one image — perhaps a photograph of yourself suitable for a professional environment.
The HTML should include at least one list of related items; this list should be presented in a way that each list item appears on a separate line (or group of lines), as with a bulleted list or a table.
The CSS should affect where the image appears within the page.
The CSS should affect the font or color of a portion of each element in the list. For example, if you have a list of relevant courses, the CSS might indicate that each course number should be in boldface and the course title in italics.
Your HTML code should be passed as valid HTML5 by the W3C Validation Service, and the CSS should be passed as valid CSS2.1 by the W3C CSS Validation Service. Note that with each of these validators, there are tabs at the top of the page that allow you to choose between entering the page's URL, uploading a file, or copying the file into a blank.

To develop your HTML and CSS, simply use a text editor such as gedit or jEdit to create a text file with an extension of .html or .css. You can view how the page would appear by opening the HTML page within a Web browser; one way to view a file is to browse within your windowing environment to the icon representing the HTML file, and then dragging this icon into the browser window.

If you're reasonably new to HTML/CSS, you will surely run into some questions about how to get HTML/CSS to do what you want. Please don't hesitate to stop by my office to ask questions. Another possibly useful reference:

CSS tutorial: Starting with HTML + CSS: This is a well-written tutorial covering the basics needed for this assignment. It uses XHTML (mostly) rather than HTML5. You can basically convert to HTML5 by changing the DOCTYPE to simply <!DOCTYPE html> and adding <meta charset="utf-8"> to the beginning of the head element.
HTML Basics: A generic, if dated, overview of HTML (without CSS), with coverage of most of the tags that are still useful today.