Question

In: Computer Science

Minimum Requirements: Your website must include appropriate and understandable page titles for each page. These titles...

Minimum Requirements:

  • Your website must include appropriate and understandable page titles for each page. These titles display at the top of the browser when users view your pages
  • Must have a minimum of three sub-pages excluding the homepage. Additional pages MUST be subpages linked off the homepage
    • Homepage: This page will include a brief introduction of the site, links to the other pages, pictures, etc.
      • Name the Homepage file ‘index.html’
    • About me page: this page tells about yourself and everything you want a prospective employer know about you.  
    • Other pages may include the followings:
      • Project page: This page should include an organized set of your past/current projects.  
      • Future goals page: This page should include an outline of what you want to achieve in the future.
      • Resume page; Create a resume for yourself and include that on this page.
  • Use HTML5 and CSS3 only (use of templates is not allowed)
  • Pages must be professionally related and well organized and each page should have a clear navigation bar (links to all the pages in the website)
  • All links must go to designated targets
  • Other things to consider:
    • Check your website for any misspellings or grammatical errors
    • Your website should be attractive, easy to navigate, and pages should fit together properly.
    • Check your website for accessibility. Your website must be accessible to hearing and visually impaired users. For example, use standard internet fonts and include alternate text for all images
    • Your code must be correct, well-structured, free from clutters, and easy to read
    • Use proper indentation and add comments where it helps with the readability of your code. If you copy codes from somewhere else, make sure you review and adjust it to your page. Avoid having any unnecessary lines of code that don’t do anything with your page.
    • Avoid using multiple styling formats
    • If information cannot be viewed due to a webpage error, it will be considered absent. Therefore, verify that the entire website works properly.

Solutions

Expert Solution

Hello , I am writing the answer below and have tried to write complete answer
in simple and easy to understand language. I hope my answer will help you.
PLEASE give me LIKE / UPVOTE if you like my answer. THANK YOU.

all pages made by the HTML & CSS only

index.html

here in this index page :we make a title in the top of the page.

add a nvabar using css also active class in here.

3 navbar links added about, project page , future project

using the images & we make a links a Restaurants links .

then add footer

<!DOCTYPE html>

<html>

<head>

  <title>My Favourite Restaurant</title>

<!-- using here internal stye css here-->

<style>

    h1{

        text-align: center;

    }

    .gal{

      

      margin-left: 60px;;

    }

div.gallery {

  margin: 5px;

  border: 1px solid #ccc;

  float: left;

  width: 400px;

}

<!--mouse curser when then the gallery border color change effect-->

div.gallery:hover {

  border: 1px solid #777;

}

div.gallery img {

    

  width: 400px;

  height:400px;

}

div.desc {

  padding: 15px;

  text-align: center;

}

.dis{

    float: none;

    clear: both;

    text-align: center;padding-top: 20px;

}

ul {

  list-style-type: none;

  margin: 0;

  padding: 0;

  overflow: hidden;

  background-color: #333;

}

<!--all li properties float to the left side -->

li {

  float: left;

}

li a {

  display: block;

  color: white;

  text-align: center;

  padding: 14px 16px;

  text-decoration: none;

}

<!--here you can mouse curser effect add uisng hover-->

li a:hover {

  background-color: #111;

}

<!-- footer style here center , padding space ,bgcolor change & text color white-->

footer {

  text-align: center;

  padding: 3px;

  background-color: DarkSalmon;

  color: white;

}

.active{

    color: darkgrey;

}

</style>

</head>

<body>

    <h1>Restaurant</h1>

<!--here add navbar uisng the unorderd list & list item also making a link uisng ancer tag -->

    <ul>  

      <li><a class="active" href="index.html">Home</a></li>

      <li><a href="About.html">About</a></li>

      <li><a href="project.html">Project page</a></li>

      <li><a href="future.html">Future goals page</a></li>

    </ul>

<!-- the three image are create -->

<div class="gal">

<div class="gallery">

  <a target="_blank" href="hotdog.com">

    <img src="1.jpg" width="100" height="400">

  </a>

  <div class="desc"><b>Hotdog restaurant</b> <p>its good hotdog sellers makit it traditionaly<p><a href="hotdog.com">www.hotdog.com</a></div>

</div>

<div class="gallery">

  <a target="_blank" href="pizza.com">

    <img src="2.jpg" width="400" height="400">

  </a>

  <div class="desc"><b>Pizza restaurant</b> <p>quality pizza baking with wood-fired oven.<p><a href="pizza.com">www.pizza.com</a></div>

</div>

<div class="gallery">

  <a target="_blank" href="southres.com">

    <img src="3.jpg" width="800" height="400">

  </a>

  <div class="desc"><b>south restaurant</b> <p>good food available souths items<p><a href="southres.com">www.south.com</a></div>

</div>

<p>

    <div class="dis"><h3>

    We love foods so our top 3 Restaurant list here , if you like the top quality food visit the image or links. thank you

</p></h3>

</div>

<!--footer here only the auther nake eg. -->

<footer>

  <p>Author: <br>

  <a href="[email protected]">[email protected]</a></p>

</footer>

</body>

</html>

About.html

title & the navbar same mention here as index page,

then add information about us.

(you can also add info as you want or change)

<!DOCTYPE html>

<html>

<head>

  <title>My Favourite Restaurant</title>

<style>

    h1{

        text-align: center;

    }

    .gal{

      margin-left: 25px;;

    }

ul {

  list-style-type: none;

  margin: 0;

  padding: 0;

  overflow: hidden;

  background-color: #333;

}

li {

  float: left;

}

li a {

  display: block;

  color: white;

  text-align: center;

  padding: 14px 16px;

  text-decoration: none;

}

li a:hover {

  background-color: #111;

}

footer {

  text-align: center;

  padding: 3px;

  background-color: DarkSalmon;

  color: white;

}

.active{

    color: darkgrey;

}

.para{font-family:initial;

text-align: center;

font-size: 20px;

padding:20px;

}

</style>

</head>

<body>

    <h1> Restaurant</h1>

    <ul>

      <li><a  href="index.html">Home</a></li>

      <li><a class="active" href="About.html">About</a></li>

      <li><a href="project.html">Project page</a></li>

      <li><a href="future.html">Future goals page</a></li>

    </ul>

    <div class="para">

We can show you which Restaurant is best for you.

<p> We make also you choose best food</p>

<p>Best possible service add in the Restaurant </p>

<p>We test first then suggest food.</p>

</div>

<footer>

  <p>Author: <br>

  <a href="[email protected]">[email protected]</a></p>

</footer>

</body>

</html>

project.html

title & navbar as same in all pages

only the imformation change here

<!DOCTYPE html>

<html>

<head>

  <title>My Favourite Restaurant</title>

<style>

    h1{

        text-align: center;

    }

    .gal{

      margin-left: 25px;;

    }

ul {

  list-style-type: none;

  margin: 0;

  padding: 0;

  overflow: hidden;

  background-color: #333;

}

li {

  float: left;

}

li a {

  display: block;

  color: white;

  text-align: center;

  padding: 14px 16px;

  text-decoration: none;

}

li a:hover {

  background-color: #111;

}

footer {

  text-align: center;

  padding: 3px;

  background-color: DarkSalmon;

  color: white;

}

.active{

    color: darkgrey;

}

.para{font-family:initial;

text-align: center;

font-size: 20px;

padding:20px;

}

</style>

</head>

<body>

    <h1>Restaurant</h1>

    <ul>

      <li><a  href="index.html">Home</a></li>

      <li><a  href="About.html">About</a></li>

      <li><a class="active" href="project.html">Project page</a></li>

      <li><a href="future.html">Future goals page</a></li>

    </ul>

    <div class="para">

we can add some more Restaurant.

<p>new Restaurant list in our website.

<p>we make happy customers </p>

</div>

<footer>

  <p>Author: <br>

  <a href="[email protected]">[email protected]</a></p>

</footer>

</body>

</html>

future.html

title & navbar same as index

added only extran inforamtion here

also footer

you can switch any page between any page

ita all connected.

<!DOCTYPE html>

<html>

<head>

  <title>My Favourite Restaurant</title>

<style>

    h1{

        text-align: center;

    }

    .gal{

      margin-left: 25px;;

    }

ul {

  list-style-type: none;

  margin: 0;

  padding: 0;

  overflow: hidden;

  background-color: #333;

}

li {

  float: left;

}

li a {

  display: block;

  color: white;

  text-align: center;

  padding: 14px 16px;

  text-decoration: none;

}

li a:hover {

  background-color: #111;

}

footer {

  text-align: center;

  padding: 3px;

  background-color: DarkSalmon;

  color: white;

}

.active{

    color: darkgrey;

}

.para{font-family:initial;

text-align: center;

font-size: 20px;

padding:20px;

}

</style>

</head>

<body>

    <h1> Restaurant</h1>

    <ul>

      <li><a  href="index.html">Home</a></li>

      <li><a  href="About.html">About</a></li>

      <li><a href="project.html">Project page</a></li>

      <li><a class="active" href="future.html">Future goals page</a></li>

    </ul>

    <div class="para">

      

We can suggest more Restaurants in the future,as we told we make better Decision Restaurant to you.

<p>Restaurant add list like India. Mexico.Italy.Thailand.

<p>also we add "best Drinks" add in our website</p>

</div>

<footer>

  <p>Author: <br>

  <a href="[email protected]">[email protected]</a></p>

</footer>

</body>

</html>

venereology answered 8 months ago
Next > < Previous

Related Solutions

create a website that describes a city of your choice. The website must include the following...
create a website that describes a city of your choice. The website must include the following pages:  Home Page  Arts & Culture  News & Events  Recreation Requirements Write from scratch the HTML and CSS files and show your creativity, aesthetics and imagination. Begin by creating a wireframe diagram that indicates the structure of the web page . Use grammatically correct sentences that provide reasonable flow through each web page. Include the following:  Structural elements (header,...
Must include Reference page(s). Citation style MLA/APA, your choice. Minimum word counts: 600 Changes in the...
Must include Reference page(s). Citation style MLA/APA, your choice. Minimum word counts: 600 Changes in the value of a nation’s currency affect the nation’s net exports, and thus GDP. How might this make a large country, like the U.S., more willing to adopt a flexible exchange rate regime than a small country, like Belgium. .Criteria why do large countries, like the U.S., typically have a lower portion of their GDP as exports and imports, than a small country like Belgium...
You must complete a one-page minimum discussion with your overview of the article and your opinion....
You must complete a one-page minimum discussion with your overview of the article and your opinion. The topic for discussion is unemployment. You must post an article related to unemployment or the different types of unemployment; cyclical, frictional or structural. Explain the article Explain how it relates to what we are learning Explain your opinion about it, support with real-life experience Include link to article
Your solution must include all supporting calculations and these supporting calculations must be performed with appropriate...
Your solution must include all supporting calculations and these supporting calculations must be performed with appropriate Excel formulas. Failure to do so will result in a reduction in points. For each case, you must submit one printed copy of the Excel spreadsheet which contains your case solution and a second printed copy displaying the formulas contained in each cell of the spreadsheet. Be sure to format your spreadsheet so that your work is clearly presented and easy to review. Wright...
You will be expected to complete a website of your choice. This website must incorporate a...
You will be expected to complete a website of your choice. This website must incorporate a PHP component, in this case, a form that we will be working on in class. When in doubt, carry out research to see what you could add. There are videos in the required resources section to assist anyone who is not familiar with building a website. Be sure to consult your instructor if additional support is needed. The first task is to have your...
You will be expected to complete a website of your choice. This website must incorporate a...
You will be expected to complete a website of your choice. This website must incorporate a PHP component, in this case, a form that we will be working on in class. When in doubt, carry out research to see what you could add. There are videos in the required resources section to assist anyone who is not familiar with building a website. Be sure to consult your instructor if additional support is needed. The first task is to have your...
For this Discussion, you will research the minimum wage laws. Your response must include a discussion of both the advantages and disadvantages of minimum wage laws.
For this Discussion, you will research the minimum wage laws. Your response must include a discussion of both the advantages and disadvantages of minimum wage laws.For example, you might consider these differing perspectives as you approach your research:Perspective One: The U.S. Department of Labor has imposed a minimum wage since 1938. Most states mandate minimum hourly wage rates, too. Minimum wage legislation inhibits an employer from setting wage rates below the directed amount. Although the goal is to help workers,...
For each problem, compute the appropriate statistical test and report your conclusion. Your answer should include...
For each problem, compute the appropriate statistical test and report your conclusion. Your answer should include the following: a. State the null hypothesis. b.   Identify the appropriate statistical test c.   Calculate the appropriate test statistic. Make sure to report the degrees of freedom for the statistical test (if appropriate). You must show your work to receive full credit. d.   State your conclusions (use a two-tailed test with a = .05 for all tests). e.   Compute an effect size. A therapist would like to evaluate...
Please only show your answers on this page. Include your work on a separate page. Peach,...
Please only show your answers on this page. Include your work on a separate page. Peach, Inc. roasts and sells premium coffee in one pound ba At their current facilities they have one roaster that is able to produce 5,000 pounds of coffee per month. They purchased this machine they twelve years ago for $300,000 total and estimated a twenty year useful life. In the coming year, they plan to produce 55,000 pounds of roasted coffee and sell it for...
Include a cover page and a minimum 500 word document discussion in APA format. Sandra is...
Include a cover page and a minimum 500 word document discussion in APA format. Sandra is a nurse in the physician's office and she has just assisted the physician with a suturing procedure. As she is cleaning up afterwards, she is cut by the suture needle and it penetrates her glove. 1. What procedures should be followed? 2. Is the employer responsible even though Sandra made the mistake? 3. How does this incident affect the patient whose blood is on...
ADVERTISEMENT
Subjects
ADVERTISEMENT
Latest Questions
ADVERTISEMENT