Assignment Instructions

Part 1 – Create a chef.html page

1. Open template.html in Notepad to edit.
2. Add the restaurant name and Chef to title tag. For example: <title>Joe’s Grill – Chef Dan</title>
3. Add an appropriate level 1 (h1) heading to page. For example:
   • <h1>Meet Chef Dan</h1>

1. Write a short bio about the chef of the restaurant. The bio should be at least 50 words describing the chef’s experience and education. The chef’s bio should be formatted into paragraphs using <p></p> tags. See the example below to get you started.
2. Text content needs to be free of spelling and grammatical errors and use correct punctuation.

Part 2 – Create an additional Web page

1. Decide on a page topic to add to your restaurant website. Some suggestions include nutrition.html (a nutrition page that displays calories and nutritional information about the menu items) or gallery.html (display some photos of the meals on the menu or photos around the restaurant), or a links.html page with links to outside websites related to the restaurant. If you are unsure, ask your instructor before selecting a topic for your page.
2. Use template.html to create your new page.
3. New page must have an appropriate page title.
4. New page must have an appropriate level 1 (h1) heading.
5. New page should include at least two (2) page elements, (properly coded), from the list below:
   • Ordered list
   • Unordered list
   • Table
   • Image
   • Paragraph of text
   • Form
6. New page must be linked to the external CSS document, styles.css.
7. Save page as a web page with a logical name (no caps or spaces in page name).

Part 3 – Link your website pages

1. Create a navigation bar that contains all pages in website.
2. Add navigation bar between <nav></nav> on all pages.
   • Navigation bar includes:
     • index.html
     • aboutus.html
     • history.html
     • menu.html
     • contact.html
     • chef.html
     • The new page added in step 2.
3. Add text-based navigation links to the footer of all pages.
   • Navigation bar includes:
     • index.html
     • aboutus.html
     • history.html
     • menu.html
     • contactus.html
     • chef.html
     • The new page added in step 2.

Example of text-based navigation code:

• <p>
• <a href=”index.html>Home</a> | <a href=”aboutus.html”>About Us</a> | <a href=”history.html”>History</a> | <a href=”menu.html”>Menu</a> | <a href=”contactus.html”>Contact Us</a> | <a href=”chef.html”>Meet the Chef</a> | <a href=”nutrition.html”>Nutritional Information</a>
• </p>

The above code will look like this in the browser:

Home | About Us | History | Menu | Contact Us | Meet the Chef | Nutritional Information

Part 4 – Finishing Touches

1. Add the restaurant logo to the header section of each website page.
2. Add the link tag to link the external CSS styles.css to the head of each website page.
3. Add at least one style rule to styles.css. Some examples include:
   • Add image formatting.
   • Write a class to center heading content.
   • Format the footer

Part 5 – Validate your website

1. Submit your website URL to the validation website: https://validator.w3.org/ or http://html5.validator.nu. If you have validation errors in your code, the website will note them. Correct any errors and submit again. Once your website validates with no errors, submit the URL to the validator page showing validation for the website in the Dropbox with your website URL.