In this project, you need to use HTML/CSS and JavaScript to build a simple websi

ID: 3725106 • Letter: I

Question

In this project, you need to use HTML/CSS and JavaScript to build a simple website and publish it online. You can build a personal website for yourself, or a website of a small business or organization like a farm, a restaurant, a park, a hotel, a baseball club, or a website of some tutorials, showing skills that you have expertise in and want to share with others. You have a lot of freedom to determine the details of your website as long as you meet the requirements. The theme doesn’t need to be real. Be creative! You will have three weeks (w6-w8) to work on this project.

Requirements:

The webpages should be presentable as a whole; the interface should be user friendly (text should be easy to read); the website should contain pictures or videos.

Website has 1 homepage and at least 3 subpages; the homepage and subpages have a horizontal menu that leads to the other pages.

The homepage has picture carousel animation (slideshow effect, for example, pictures in this page http://oregonstateparks.org/ (Links to an external site.)Links to an external site.)

Have a scroll box in one page. You can put anything inside the scroll box.

One page has unordered HTML list with several entries.

There is a button to download files (map to the farm, menu in the restaurant, a personal CV, etc.) The downloaded file can either open in the browser or download to the local computer.

There is a link that you can click and leads to outside webpages (linkedin, yelp, email, etc.)

You are allowed to add other features not listed above to your website as long as they are functional and serve some purpose in your website.

Things to keep in mind:

You need to search online or read books to learn the skills you need for this project by yourself. You can post questions on Piazza if you couldn’t solve some technical difficulty after some research. Check out the resource link page on Canvas for more information (https://oregonstate.instructure.com$WIKI_REFERENCE$/pages/useful-links) and also W3School for short tutorials (https://www.w3schools.com/ (Links to an external site.)Links to an external site.). You are allowed to use other existing APIs (like Bootstrap for CSS) for your project. If you are not sure about certain resources, ask us on Piazza.

There are a lot of website templates online. You can learn some features or settings from these templates, but you can’t copy the whole templates and use it as your own project.

You need to design your page first before you actually start coding.

You can build a simple website that meets the requirement first, and add more features later if you have time.

If you use pictures/videos from other resources (not owned by you), please cite the resources to avoid any copyright issue.

The content of your website doesn’t matter. We will not grade based on the content (for example, we won’t look at your CV attached in your website to see whether it is a good one). So just put something meaningful there, and if you want to make your website real, you can update the content later.

Many website functions rely on the database access which will be taught in CS340. We will touch it a little bit in week 9. We won’t require you to implement the database related functions in this project. Try to use all the skills you learned so far in this course to build your website. If your website only uses HTML/CSS without JavaScript code, your project will be deduct 10% points.

Explanation / Answer

<!DOCTYPE html>

<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Resume Template</title>

<style>

html,body,h1,h2,h3,h4,h5,h6 {font-family: "Roboto", sans-serif}

</style>

</head><body class="w3-light-grey">

<br><h2>RESUME</h2>

</div>

<p><i class="fa fa-briefcase fa-fw w3-margin-right w3-large w3-text-teal"></i>Designer</p>

<p><i class="fa fa-home fa-fw w3-margin-right w3-large w3-text-teal"></i>Germany</p>

<p><i class="fa fa-envelope fa-fw w3-margin-right w3-large w3-text-teal"></i>mailtotest</p>

<hr>

<p class="w3-large"><b><i class="fa fa-asterisk fa-fw w3-margin-right w3-text-teal"></i>Skills</b></p>

<p>Adobe Photoshop</p>

</div>

<p>Photography</p>

</div>

<p>Illustrator</p>

</div>

<p>Media</p>

</div>

<br>

<p class="w3-large w3-text-theme"><b><i class="fa fa-globe fa-fw w3-margin-right w3-text-teal"></i>Languages</b></p>

<p>English</p>

</div>

<p>Spanish</p>

</div>

<p>German</p>

</div>

<br>

</div>

</div><br>

</div>

<h2 class="w3-text-grey w3-padding-16"><i class="fa fa-suitcase fa-fw w3-margin-right w3-xxlarge w3-text-teal"></i>Work Experience</h2>

<h5 class="w3-opacity"><b>Front End Developer</b></h5>

<h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Jan 2018 <span class="w3-tag w3-teal w3-round">Current</span></h6>

<p>Hi, I am happy to introduce myself as John started working on front-end development tools recently.I am interested in exploring technologies such as: HTML,CSS and Bootstrap</p>

</div>

<h2 class="w3-text-grey w3-padding-16"><i class="fa fa-certificate fa-fw w3-margin-right w3-xxlarge w3-text-teal"></i>Education</h2>

<h6 class="w3-text-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Alumni</h6>

<p>Web Development and much more!</p>

<hr>

</div>

<h5 class="w3-opacity"><b>MASTERS</b></h5>

<p>Master Degree from Harvard University</p>

<hr>

</div>

<h5 class="w3-opacity"><b>School of Coding</b></h5>

<p>Bachelor Degree</p><br>

</div>

</div>

</div>

</div>

<p>Find me on social media.</p>

<p>Powered by Self Learning</p>

</footer>

</body></html>

Basics:

Read me Instructions:

Navigate

In this project, you need to use HTML/CSS and JavaScript to build a simple websi

In this project, you will add a new table for home run leaders to the baseball_s

Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.

In this project, you need to use HTML/CSS and JavaScript to build a simple websi

Question

Explanation / Answer

Related Questions

Navigate