Description

Objective

This is an opportunity to get familiar with HTML structure, syntax, and the elements that are used to create web pages.

Requirements

Your task is to create an HTML document that is your resume as it stands now. You can decide how you structure your document, but you must use the following elements in your document:

• The body element with:
  • At least two heading elements (e.g., h1, h3)
  • A p, span, i, b, an abbr, and a small element
  • Each of the three lists (ordered, unordered, and definition)
  • Anchors that link within your document and outside of your document (e.g., to BCIT’s web site)
  • Use several br elements
• The meta element and the title inside of your head element
• Use the following semantic elements:
  • header, nav, article, aside, figure, section, footer
• Create a form with the following inputs and characteristics:
  • a login name, required and accepts between 8 and 20 upper/lower case characters (no numbers)
  • a password that accepts between 10 and 20 upper/lower case characters – and numbers too
  • an age field going from 18 to 65
  • a reset button
  • a submit button
  • the login name and password are required
  • the login name, password, and age field require a placeholder
  • wrap all inputs inside of a fieldset and use a legend (with the name ‘user profile’)
• Add an image to page (for use with the figure element) and link to dummyimage.com
• Create a table that contains three courses you are currently enrolled in with the following columns:
  • Course name
  • Course number
  • Course credits

As well, include a readme.txt file that follows this format:

Note: you must also run your HTML code through a validator. The validator you must adhere to this term is found at the following web site:

https://en.rakko.tools/tools/58/

If you fail to validate your HTML in your assignments, you run the risk of losing marks for your assignment submissions.

Once you have completed, ensure that your document is valid. It is suggested that you use the validator in Visual Studio extension as it catches all HTML and CSS errors. You code (HTML, CSS, JavaScript) must all be free of all syntax errors regardless of what validation tools you use (online, editor plugins, reading manually, etc.).

Your files must be in text form. This is mostly for Mac users who may decide to use TextEdit – don’t use it! It saves files in a binary format that cannot be read outside of the Mac platform.

Submission

Create a zip archive of any and all text files that are part of your assignment submission. Your HTML files will have the extension “.html”, your CSS files will have the extension “.css”, and your JavaScript files will have the extension “.js”. If you have images, be sure to include them in this archive that you create.

Once you create your zip archive file, rename it to follow the format SurnameFirstnameCOMP1537Assignment1. My zip file would be FergusonArronCOMP1537Assignment1, for instance.

Finally, submit it to the learning hub in the folder labeled “assignment 1”.