Assignments
Create two structurally correct web pages. Name one index.html and name the other one news.html.
Using appropriate heading elements, Index.html will display your name, the course name and number, and the word Assignments. Using an ordered list, you will create elements for Assignments 1, 2, 3, 4, and Final Project. You will create a link from Assignment 1 to the page named news.html.
To create news.html, use real content from another web page (e.g. a CNN article), that has at least all of the following:
- Three levels of headings
- Paragraphs, blockquotes and an appropriate usage of each kind of the three kinds of lists covered in class
- Inline elements including strong and emphasis, as well as three anchor links
- One to another point in the same page
- One to the web page that provided your source material
- One back to your home page
- At least two images, located in a sub folder entitled "images" that you must create
Upload your web page and images (and images folder) via FTP using the information provided on the course web site.
Do NOT style any elements or any aspect of either Web page! Your XHTML should be absolutely plain vanilla with no extra bits to distract anyone.
Validate both your index page and your news page xhtml 1.0 transitional.
Table and Form
- Create a directory called "Assignment2" on your computer and then ftp the directory to your work space on student-iat.ubalt.edu
- Create a web page named table.html with a header, paragraph and table. The table should use a caption, table headings, at least 10 rows and at least 4 columns. You may use dummy content or fill your table with stuff like weather data.
- Create a web page named "form.html" with a header, paragraph and form. The form should have the following elements (you may use dummy content or fill your form elements with goofy stuff to shop for):
- 3 text inputs
- 1 textarea
- A radio input with at least 5 options
- A series of at least 5 checkboxes
- A select element with at least 5 options
- A submit and reset button
- Apply the definition list technique to the form using the label element advocated by Cederholm on page 68.
- Add a nested unordered list to your index.html page under the element for Assignment 2, one called table page and one called forms page. Create a link from the words table page to table.html and a link from the words forms page to form.html.
Do NOT style any elements or any aspect of either Web page! Your XHTML should be absolutely plain vanilla with no extra bits to distract anyone.
Validate the page xhtml 1.0 strict.
The information for this assignment is in a Word document you can download here. You will find the images you need here:
Don't forget to create a link from your home page to the home page for assignment 3.
Don't forget to validate all your code.
Your assignment, due by the beginning of class on April 9, is to create a single web page describing your final project. Save the page as index.html in a directory named "finalproject." Advanced option: apply the sane css typography here by saving it in a directory called "css" within the "finalproject" directory and using the import method.
Make sure you include your name, the course name and assignment number, and the date somewhere on the page.
Link from your main index.html page to Assignment 4's index.html page and also from this assignment's page back to your main (home) page.
As always, validate your code.
Your final project will be a four page web-site that meets the following criteria:
- Valid XHMTL 1.0 Strict Markup, or XHTML Transitional (if justified)
- Proper document structure
- Valid CSS for all layout and presentation
- Section 508 Compliant
- Home page layout related to but distinct from content page template
- Content page template related to but distinct from home page layout
- Template page containing at least one styled table
- Template page containing at least one form consisting of multiple field types
- All pages stored in a directory called "finale" at the root level of your directory
- All css files stored in a directory called "css" at the root level of your directory
- All images stored in a directory called "images" level of your directory