Answered You can buy a ready-made answer or pick a professional tutor to order an original one.

QUESTION

Part 1: Create a Template Create a folder on your computer to store all of your website files for this Assessment. The folder can be anywhere on your computer or portable drive. Open Notepad (or TextE

Part 1: Create a Template

Create a folder on your computer to store all of your website files for this Assessment. The folder can be anywhere on your computer or portable drive.

Open Notepad (or TextEdit if you are working on a Mac).

Refer to the given code below and type it into a new blank page in Notepad.

Code the Structural Elements

Each Web page should contain a set of structural elements. These elements, commonly called “tags,” set up a Web page as a container of content to be displayed. These structural tags also divide a webpage into sections that are read by the browser. The main structural tags are to be coded in the order shown.

Type this into a blank page in Notepad:

<!doctype html>

<html>

<head>

<title></title>

</head>

<body>

</body>

</html>

The next step is to create a logical layout within your Web page using semantic tags. Semantic tags are easily read by browsers, screen readers, and search engine robots because the name of the tag describes what the tag is or does. For example: <footer> </footer> tags designate the page footer section. These tags can be formatted using CSS formatting; however, you will use them strictly for organization at this point.

Place your cursor between <body> and </body> and type the code below:

<header></header>

<nav></nav>

<main></main>

<footer></footer>

When the correct code for your layout is typed into Notepad, save your template as template.html. You will use this template file to create additional pages for this Assessment. If you plan on taking additional Assessments for IT117X, save this file for future use.

Part 2: Create Your Home Page

Open template.html (created in Part 1) to edit in Notepad.

Save the file as index.html, but do not close the file.

Place your cursor after <title> and before </title> in your code. Type the name of your restaurant and the words Home Page.

For example: <title>Joe’s Grill – Home Page</title>

Place your cursor between <header> and </header>. Add a level 1 (h1) page heading using <h1> and </h1> and type heading text for the page.

For example: <h1>Welcome to Joe’s Grill</h1>

Place your cursor between <main> and </main> and type at least two paragraphs of welcome text for the home page of the restaurant.

Use <p></p> around each paragraph of text.

Paragraphs should be 3–4 sentences each.

Total word count should be 100–200 words.

Save and close document.

Part 3: Create an About Us Page

Next, you will create an About Us page for your restaurant site. You will use the template you created in Part 1 of this Assessment. This part of the assessment involves creating the About Us page for your fictitious restaurant website and adding some hyperlinks to your home page and new About Us page.

Open template.html so you can edit the HTML.

Save the file as aboutus.html, but do not close the file.

Add text in the title tags with the name of your restaurant and About Us.

Example:

<title>Joe’s Grill – About Us</title>

Add a level 1 (h1) heading between <header></header>, including text for an appropriate page heading.

Example:

<h1>About Joe’s Grill</h1>

Place your cursor between <main> and </main> and add your page content following the following guidelines.

About Us Page Guidelines:

Write information about the restaurant that the customer might like to know. This should be a descriptive composition outlining the specific information customers typically need to understand the characteristics of your restaurant.

You may want to include information about how the restaurant started, such as who runs the restaurant (i.e., is it family owned and operated? Is it a franchise?).

Include a mission statement for the restaurant.

Your content for this page should be 250–300 words.

Text content needs to be formatted using <p></p> around each paragraph block of text. Each paragraph should be three or four sentences each.

Add an ordered list to the About Us page.

Using the <ol></ol> tag pair and the <li></li> tag pairs, format some of the page content into an ordered (numbered) list.

List item content does not need to be complete sentences.

Example:

Family owned and operated since 2002

Serve only the highest quality seafood

Dedicated to our customers

Add any desired subheadings (h2, h3…), paragraphs (<p></p>), lines breaks (<br> tags), etc., as needed for content.

 Add an unordered (bulleted) list of hyperlinks between <nav> and </nav> in your “About Us” page using the <ul></ul> tag pair and the <li></li> tag pairs. Include a link to the home page and a link to the “About Us” page.

Each link should be a new list item.

Use the relative file path for internal links

Example:

<ul>

<li><a href=”index.html”>Home Page</a></li>

<li><a href=”aboutus.html”>About Us</a></li>

</ul>

When you copy and paste code directly from a PDF or Word document, the quotation marks may show up as "smart quotes" and will not copy over as standard text. This will affect how your page renders (or doesn't render in the case of the links). Make sure you are re-typing quotation marks as needed. 

When you are finished, save and close aboutus.html.

Hint: Search online to find sample “About” pages from restaurant websites. It may spark some ideas for content.

Open your home page (index.html) to edit in Notepad.

Add an unordered (bulleted) list of hyperlinks between <nav> and </nav> in your home page using the <ul></ul> tag pair and the <li></li> tag pairs. Include a link to the home page and a link to the “About Us” page.

Each link should be a new list item.

Use the relative file path for internal links.

Example:

<ul>

<li><a href=”index.html”>Home Page</a></li>

<li><a href=”aboutus.html”>About Us</a></li>

</ul>

Save and close your home page (index.html).

Part 4: Create Your Logo

You will use GIMP to complete this Assignment. Please do not purchase any software to complete this Assignment. Follow the instructions below to create your logo. In the last part of the Assessment, you will add the logo to your template, home page, and About Us pages.

Open the folder on your computer that holds your template page, home page, and About Us page.

Right click inside the folder and select New > Folder. Name the folder images.

Open your image editor (GIMP) to create a new file. You can use another image editor you have available, but you are NOT expected to purchase any software for this Assessment. If you do not have an image editor, you should download and use GIMP (free download).

Using the tools within the GIMP, create a simple logo for your restaurant website. Logos can be created using simple shapes, text (such as initials), and even keyboard characters. Follow these specifications:

Logo width is no less than 100 pixels and no more than 200 pixels.

Logo height is no less than 100 pixels and no more than 200 pixels.

Logo consists of shapes, drawings, text, and/or filters. (No photos or clipart should be used.)

Logo is the work of the student, not a purchased or open source graphic.

Logo should consist of at least two two colors.

Save the logo as logo.gif or logo.jpg and make sure the file is in the images folder you created.

Hint: Search online for sample logos that might inspire you. Be mindful of keeping your content original.

Part 5: Add Your Logo Image to Your Pages

In this last part of the Assessment, you will add the logo to your template.html, index.html, and aboutus.html pages.

Open template. html to edit in Notepad.

Place your cursor after <header> and before <h1>.

Type the image tag to place the logo in the header of the document.

The file path needs to include the images folder and file name.

The image tag needs to include a description of the image inside the alt attribute.

The actual width and height of the image should be coded using the width and height attributes. Replace “xxx” with the actual values in the example.

<img src="images/filename.jpg" alt="Description of image" width="xxx" height="xxx">

Save template.html and close.

Open index.html and aboutus.html. Repeat steps 1–4 above to add the logo to both pages.

Log in to your web server and create a folder for this Assessment.

Upload the revised template.html, index.html, and aboutus.html pages to the server.

In your folder for this Assessment on the Web server, create a new folder named images.

Select the new images folder to open it and select the Upload button. Browse to select your logo from your computer and upload the file.

Go to your Web browser and check all pages. Copy and paste the URL for each page into a Word document. Submit your document to the Dropbox for this Assessment.

Show more
  • @
  • 252 orders completed
ANSWER

Tutor has posted answer for $15.00. See answer's preview

$15.00

***** ************** **** ********* *** ******* ** support *** **** **** forward ** ** you * have been ************ errors ***** ****** ** upload it **** If ******** ** ***** ****** don't ******** to *** me ******** *******

or Buy custom answer
LEARN MORE EFFECTIVELY AND GET BETTER GRADES!
Ask a Question