INFO 1311 - Web Page Creation
Assignment 1 (50 points)
Create Course Home Page
I would like you to create a new Web page that
we will use to gain access to your future Homework assignments. This
file will be named default.htm and will be saved on your local drive. Next week we will upload this file to the server and place it in your
student Web site. (Remember that this file name
is often used as the default index file name on a Web server). It
will be your INFO1311 Home Page.
Beginning next week when a Homework
Assignment is complete and ready to be graded, I will view your default.htm
file on your student web site in the browser and look for a link to the homework assignment. You
will be responsible for creating the links to the homework assignments once
they are completed, uploaded, and ready to be graded. The default.htm file will be
used as a kind of "site map" to the pages on your student Web site.
We will not be creating the links yet, but we will get the HTML structure and
content created for this page.
Follow these steps to help you create a new Web page.
- You must use Visual Studio Code to create all assignments this quarter. You are NOT allowed to use an HTML editor like Dreamweaver when creating your HTML and CSS files this quarter. So...using a text editor, create your student home web page so that it looks like the example below. Your code must validate as an HTML5 file and must follow the "best practices" as explained in Chapter 2 and in the "Style Guide" handout. Be sure to validate your code.
- The <title> of the page should be "Student Name's INFO1311 Home Page" -- replace Student Name with your first and last name.
- In the <body> of the page, don't forget to include the Opening Comment that was explained in the Style Guide in Module 1. This is required in all HTML files created this quarter. Using an HTML comment, add the information requested in the Opening Comment as shown below:
<body>
<!-- Student Name
filename
Course number and section
Instructor Last Name
Date Created
-->
- Use the HTML5 structural elements header, main, and footer to define these three areas in the body of the page as explained in the illustration below.
- Use the various element tags (h1, h2, h3, p, ul, li, etc.) to define the structure of your page as explained in the illustration below. DO NOT format the page at this time. We will be doing this next week by creating an external CSS file.
- Replace 'Student Name' with your first and last name in the heading at the top and in the footer at the bottom of the page
- Replace 'Fall 2011' with the quarter and year of your course
- Use the following URL's to create the links in the Important Links list and the email link in the last paragraph.
| Canvas Course Web Site |
http://canvas.mccneb.edu |
| Metro Web Site |
http://www.mccneb.edu |
| W3C (X)HTML Validator |
http://validator.w3.org |
| W3C CSS Validator |
http://jigsaw.w3.org/css-validator/ |
| Created by Student Name |
Use your MCC student email address to create an email link. |
- Name the file default.htm and save it into the public_html folder that you created.
- All pages you create this quarter must validate as an HTML5 file. Test your page in the browser and validate your code using the W3C Validator tool
Example student home page:
When Finished...
- Upload the default.htm file to the Canvas drop box. This is the only assignment that will be "turned in" this way. Beginning next week, you will be uploading your assignments to a Web server to turn them in.