HTML Coding exam

HTML Course assignment

This is solved assignment of High School Diploma program. If you are looking for online tutoring help in HTML Coding, send a mail to info@xamnation.com for more help

Instructions for HTML Course assignment

  • Use proper XHTML and CSS syntax at all times
  • Close all two-sided tags, properly nest all tags within your code, and use appropriate comments within your code
  • Enclose all attribute values in quotes
  • Include alternate text for non-graphical browsers with inline images
  • Write your code so that it will be easy to read and understand, don’t get sloppy with your code
  • Constantly save your files
  • Reference your text for examples of what you’ll need to complete this project
  • Make sure to reference the process and design guidance from Chapter 18 and practical information from Chapter 19 (HTML and CSS by Jon Duckett), such as SEO keywords, analytics, wireframe and so on. You don’t have to create a page for analytics for this project.
  • You need to include all files with your submission to the school, all HTML files and any supplement files (any other material you used not included in stock photos)
  • Each project is individually graded by your instructor and therefore takes up to a few weeks to grade.

Grading Criteria for HTML course exam

Criteria Possible Points
Use of proper XHTML syntax, including an appropriate heading and paragraph 10
Easy to read and understand code 10
Characters

 

·         Correct character formatting element

·         Use of special characters

·         Use of horizontal line

10
Use of inline images

 

·         Proper format

·         Two example of inline style

10
Tables with appropriate cell margins and spacing 10
Block level element that isn’t a heading, paragraph, list, or horizontal line 10
Boxes

 

Appropriate border image

Appropriate shadow

Appropriate contrast, hue and brightness of all boxes

Rounded corners

10
List

 

Ordered or unordered

Bullet list with appropriate different point stlyes

10
Tags

 

All two sided tags closed

Properly nested tags

Appropriate comments within code

All attribute values enclosed in quotes

10
Forms

 

Text input (sized appropriately)

Text area

Select boxes

Radio buttons

Checkboxes

10
Total 100

HTML Coding exam details

Home page information

John Ricker, the owner of Rucker’s in Scottsdale, Arizona, asks you to create a web page for his restaurant. He wants his customers to be able to view photos of the menu, pricing information, and atmosphere they can expect when they visit the restaurant. He wants you to link this page to a web form where customers can make a reservation. He also wants to monitor visitor activity, such as how long visitors view a page and how many visitors come to the site daily. Follow the instructions below to create this website for Rucker’s.

  1. Open a text editor, such as Windows Notepad
  2. Use the following lines of code to begin writing your document as shown below:

<html>

<head>

<title>Rucker’s</title>

</head>

<body>

</body>

  1. Once you start with this small block of code, open a web browser to view how it looks
  2. Change the color and positioning of your heading by
  3. Centering the heading
  4. Changing the font color to red
  5. Changing the font face to Arial, Helvetica, or Sans Serif
  6. Save changes and view again in your browser
  7. Below the heading, add the following text: “The best steak in Scottsdale!” Be sure to format this text as : Heading 2, Italicized, Centered
  8. Below this heading add the following address information as paragraph text”

555 Mountainview Ave.

Scottsdale, AZ 85260

  1. (602) 789-5672
  2. Make sure to center the text
  3. Add the following greeting below the address and make sure to center”

Welcome to Rucker’s, which has been voted Best Steakhouse in Scottsdale four years running? At Rucker’s you can enjoy a quality steak, amazing wine, and a quiet atmosphere in a mountain-themed restaurant. Rucker’s has been a tradition in Scottsdale since 1975 and is an amazing place to dine.

Order Online Page

Create an Order Online page with a form for customers to fill out. Include appropriate size boxes for the following:

  • First name
  • Last name
  • Phone number
  • Email address
  • Credit card number
  • Credit card expiration date (with a selection box for the month and one for the year)
  • CSV number on the back of the card
  • Desired pickup time (a selection box with half-hour increments within the parameters of business hours)

You may reuse some of the same code on each page as long as it’s relevant and matches, so you don’t have to spend additional time retyping reused code.

Menu Pages

John Rucker desires a main page with two separate subpages- one for his beer and wine list and the other for his shorter dessert list. For the main menu page, include a stock photo of some of the menu items; it isn’t necessary to include a photo of every item on the menu. Make sure the menu includes a list of various dishes and appropriate pricing for an upper-class steakhouse. He had daily featured meals with special pricing. Rucker’s sells various steak dinners (T-bone, Porterhouse, Sirloin and so on), grilled chicken, fish and salads. Make sure the specials.htm shows feature meals and special pricing.

John Rucker take pride in his Arizona crafted beer and wine collection. Please be sure to highlight Arizona Stronghold’s Merlot and Four Peak’s Hop Knot, as these are his favorites. His dessert list contains four sweet treats. This list usually contains a chocolate treat 9like a lava cake), a regionally inspired treat (like a prickly pear sundae), a seasonal pie, and a special monthly dessert called the Chef’s Creation. Make sure these separate pages are linked from the main menu page and go back to it.

Special Photo Instructions

In addition to the stock photos provided for this assignment, find appropriate background images to use on each page that match the site and provide relevant material for a steak restaurant. Create a table to display photos of the various dishes Rucker’s has to offer.

Make sure to save all photos you use for your web page so you can submit them with the rest of your final assignment documents. You can use the photos provided for this assignment or find your own. If you find other pictures to use, be aware of copyright protection, make sure you use stock photos that aren’t copyright protected

Save each of your .htm files with appropriate naes, such as onlineorderform.htm, enu.htm, and spacials.htm

About Us page

Create an About Us page with a brief bio and history for Rucker’s. Feel free to enter your text, making sure to remember that Rucker’s is a quiet, family-friendly restaurant with a professional wait staff. Rucker’s was founded in 1975. Create a brief backstory for Rucker’s.

Additional site map information

Create a separate page for the menu, specials, and gift cards. Create a form on the main page for customers to make an online reservation. Within this form include selection boxes for customers to choose a month, date, time (include AM and PM), and year for their reservation. Keep in mind Rucker’s is open seven days a week from 11 AM to 10 PM Monday through Saturday and 12 PM through 8 PM on Sunday.

Requirement for Page Links

  • Place the phone number in the upper right-hand header of each page
  • Include the following email address in a ‘contact us’ link on each page: staff@ruckers.com
  • Make sure all links to other pages on the site work and contain a link back to the homepage for Rucker’s

Overall Guidance for HTML exam project

For this project, you must demonstrate proficiency in each of the following areas you learned about in class:

  • Heading
  • Paragraph
  • Ordered or unordered list
  • Character formatting element
  • Inline images
  • Horizontal line
  • Special character
  • Block-level element that isn’t a heading, paragraph, list, or horizontal line
  • Two examples of an inline style
  • Appropriate contrast, hue, and brightness of all boxes
  • Boxes with appropriate border image, shadow, and/or rounded corners
  • Tables with appropriate cell margins and spacing
  • Bullet lists when appropriate with different point styles from pages 333-334 of book (HTML and CSS by Jon Duckett)
  • Form or forms with the following attributes where appropriate- Text input (sized appropriately), Text area, Select boxes, Radio buttons (can use if a dish offers chicken or beef, for example), Checkboxes

Assignment Solution

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>

<!-- 
About Page: This is main page for Rucker's restaurant. 
Author: xamnation.com
 -->
<meta name="description" content="This is main page for Rucker's Restaurant"/>
<meta name="author" content="xamnation"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<!-- Title of page -->
<title>Rucker's</title>
<link rel="stylesheet" href="main.css" />
 
</head>
<body class="index-bg">
<div class="header">
<img class="logo" src="images/ruckers-logo.png" alt="logo" width="100px" />
  <div class="header-right">
    <a class="active" href="index.html">Home</a>
    <a href="menu.html">Menu</a>
    <a href="specials.html">Specials</a>
	 <a href="giftcards.html">Gift Cards</a>
	<a href="onlineorderform.html">Online Order</a>
	 <a href="aboutus.html">About Us</a>
	 <a href="tel:6027895672">Call (602)789-5672</a>
	<a href="mailto:staff@ruckers.com">Contact Us</a>
  </div>
</div>
<div class="indextop"> 
<h1>Rucker's</h1>
<h2>The best steak in Scottsdale!</h2>
<div style="text-align:center;">
<p>555 Mountain View Ave   </p>
<p>Scottsdale, AZ 85360   </p>
<p>(602) 789-5672   </p>
<p>Welcome to Rucker's, which has been voted best Steakhouse in Scottsdale four years running! At Rucker's you can enjoy a quality steak, amazing wine and a quiet atmosphere in a mountain-themed restaurant. Rucker's has been a tradition in Scottsdale since 1975 and is an amazing place to dine  </p>

</div>

<h3 class="hr-line">&#9825;</h3>
</div>



</body>
</html>
 

End Note

We have provided sample html of front page for this html exam project. Contact us if you are looking for full solution.

We, at Xamnation, are helping students in their assignment and project work for IT courses. Students can get online tutoring, personal mentor-ship and project help from us.

Email us your assignment to info@xamnation.com and we will gladly help you.  

See more 

 

1 thought on “HTML Course assignment”

  1. I was told to contact someone for the full Rucker’s restaurant project code. The website said in order to access more than the front page i should contact someone. Is it available?

Leave a Comment

Your email address will not be published. Required fields are marked *