Question Description
General Instructions for your Assignments:
During Week 1 through Week 7 of this course, you will have a new assignment each week. You should create a new set of files for each assignment. During Weeks 1 through 7 you are NOT building on your previous assignment, like you did in WEBD121. Instead you are creating a new set of files for each assignment. However, make sure you save all of your files from each assignment because you will need them later for your Final Project. During Week 8, for your Final Project, you will create a Home Page with a navigation menu that uses JavaScript for drop-down sub-menus, which will link all of your previous assignments together, creating a comprehensive website that showcases all of your work this semester.
You must write the code files by hand for all assignments in this class. A simple text editor, such as Notepad or Notepad++ will suffice (or TextEdit on the Mac). DO NOT use GUI editors, such as FrontPage, Dreamweaver, etc. You must write the code for your web page files yourself. If you are using a PC, it is strongly recommended that you download the free Notepad++ text editor (https://notepad-plus-plus.org/) because it contains extra features which assist with debugging, such as line numbering and color coding of different elements of syntax. Mac users should use the TextEdit text editor that comes with the Mac OS. However, if you are a Mac user, make sure you set TextEdit to use Plain Text by default. You can find instructions for this here: https://www.tekrevue.com/tip/textedit-plain-text-mode/
Make sure all of your web pages comply with the HTML 5 standards and CSS standards. DO NOT use obsolete HTML elements and attributes from previous versions of HTML. By including the HTML 5 DOCTYPE declaration in your webpages, and validating all of your HTML files at https://validator.w3.org/#validate_by_upload, you can be sure that your code complies with HTML 5. Also, make sure that your external style sheet (.css file) passes validation at the W3C CSS Validation Service: https://jigsaw.w3.org/css-validator/#validate_by_upload. Make sure you use the "Validate by File Upload" option (and NOT the "Validate by Direct Input" option), on both of these validators since this is the way your instructor will check your pages when grading your assignments.
Specific Instructions for Assignment 1:
Perform all of the following steps to complete this assignment:
1) Begin by creating a new file in your text editor. On the PC, you should use Notepad++ (https://notepad-plus-plus.org/). On the Mac, you should use TextEdit (but make sure to set it to use Plain Text by default, following these instructions: https://www.tekrevue.com/tip/textedit-plain-text-mode/).
2) Enter the following code into your text editor and save the file as LastFirstAssignment1.html (where “Last” is your last name and “First” is your first name).
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Assignment 1</title>
<link rel="stylesheet" type="text/css" href="Assignment1.css">
</head>
<body>
<h1>Your Name</h1>
<hr />
<script>
<!–
//–>
</script>
</body>
</html>
3) Replace “Your Name” with your full name, inside of the <h1> heading element.
4) Your page should now contain a basic skeleton with all required HTML elements. Save your file and open it in your browser to view it. You should see the heading with your name.
5) Upload this file to the HTML validator to check for compliance with the HTML5 standards here:
https://validator.w3.org/#validate_by_upload. Your file should pass validation. If you receive any errors or warnings, then go back through the previous steps of the assignment again until you have corrected all errors and your file passes validation.
6) Create another new file in your text editor and save it as Assignment1.css
7) In your CSS file, write code to set the background color of your page to #AED6F1 and write code to center the h1 element. Save your CSS file.
8) View your webpage again in your browser and confirm that your page has a light blue background and that the heading is centered. Upload your CSS file to the CSS validator to check for compliance with the CSS standards here: https://jigsaw.w3.org/css-validator/#validate_by_upload. Your file should pass validation. If you receive any errors or warnings, debug your CSS code until you have corrected all errors and your file passes validation.
9) Using the appName and appVersion properties of the navigator object, insert JavaScript code inside of the <script> tag to display the type and version of the browser being used to display your page.
10) Add additional document.write statements to format the output of your JavaScript code. This should include <p> tags, as well as literal text prefacing each element your JavaScript code is generating, such as in the following example:
You are using the following browser:
You are using the following version of this browser:
11) Save your file and view it in the browser. Compare your results with the results you got when viewing practice Lab 1-2 on the CIW website, to make sure you are seeing the correct output from the appName and appVersion properties of the navigator object.
12) You may add any additional HTML, CSS, or JavaScript content that you wish, to practice more of the features that you have learned about in your online textbook, as long as all of your code files still pass validation. However, do not add anything to your files that would make them invalid according to the standards. You can confirm this by making sure your files still pass validation.
13) Before submitting your assignment, validate your HTML and CSS files one last time at https://validator.w3.org/#validate_by_upload AND https://jigsaw.w3.org/css-validator/#validate_by_upload, using the "Validate by File Upload" option. Note: It is critical that you debug and fix ALL errors identified by the validator before submitting your assignments. Contact your instructor for assistance if you are having difficulty debugging and fixing your errors because it is imperative that all of your code files pass validation.
14) Create a zip archive containing all pages pertaining to your website (.html files, .css files, .js files, image files, etc). Make sure you maintain the necessary directory structure in your zip archive so that your webpages will view correctly
when unzipped. In other words, if your images are in a sub-folder, in relation to the folder containing your .html file, then you need to maintain that same directory structure in your zip archive, too, including the sub-folder. Submit only the zip file for grading.
Validation Requirements:
Before submitting your web site:
- Validate your HTML file at https://validator.w3.org/#validate_by_upload, using the "Validate by File Upload" option, and fix any errors that the validator identifies before submitting your web site for grading.
- Validate your CSS file at https://jigsaw.w3.org/css-validator/#validate_by_upload, using the "Validate by File Upload" option, and fix any errors that the validator identifies before submitting your web site for grading.
Note: It is critical that you debug and fix ALL errors identified by these two code validators before submitting your assignments. Contact your instructor for assistance if you are having difficulty debugging and fixing your errors because it is imperative that your code files pass validation. Remember that valid JavaScript relies on a foundation of valid HTML and valid CSS to function as intended.
Submission Instructions: Create a zip file containing all files related to your web page (.html files, .css files, .js files, image files, etc). Make sure you maintain the necessary directory structure in your zip file so that your webpages will view correctly when unzipped. In other words, if your images are in a sub-folder on your computer, in relation to the folder containing your .html file, then you need to maintain that same directory structure in your zip file, too. Submit only the zip file for grading.
|
Rubric for Grading Assignment |
Points |
||||||
|
HTML file(s) validate without errors at https://validator.w3.org/#validate_by_upload |
10 |
||||||
|
CSS file(s) validate without errors at https://jigsaw.w3.org/css-validator/#validate_by_upload |
10 |
||||||
|
All required HTML code is present. |
10 |
||||||
|
All required CSS code is present. |
10 |
||||||
|
appName property of navigator object is correcting displaying result in browser. |
25 |
||||||
|
appVersion property of navigator object is correcting displaying result in browser. |
25 |
||||||
|
Output is well-formatted, with appropriate text prefacing each value output by the JavaScript |
10
|
Please use APA formatting and in text cititation
Please No Plagiarism
Our website has a team of professional writers who can help you write any of your homework. They will write your papers from scratch. We also have a team of editors just to make sure all papers are of HIGH QUALITY & PLAGIARISM FREE. To make an Order you only need to click Ask A Question and we will direct you to our Order Page at WriteDemy. Then fill Our Order Form with all your assignment instructions. Select your deadline and pay for your paper. You will get it few hours before your set deadline.
Fill in all the assignment paper details that are required in the order form with the standard information being the page count, deadline, academic level and type of paper. It is advisable to have this information at hand so that you can quickly fill in the necessary information needed in the form for the essay writer to be immediately assigned to your writing project. Make payment for the custom essay order to enable us to assign a suitable writer to your order. Payments are made through Paypal on a secured billing page. Finally, sit back and relax.
About Writedemy
We are a professional paper writing website. If you have searched a question and bumped into our website just know you are in the right place to get help in your coursework. We offer HIGH QUALITY & PLAGIARISM FREE Papers.
How It Works
To make an Order you only need to click on “Place Order” and we will direct you to our Order Page. Fill Our Order Form with all your assignment instructions. Select your deadline and pay for your paper. You will get it few hours before your set deadline.
Are there Discounts?
All new clients are eligible for 20% off in their first Order. Our payment method is safe and secure.