Assignment 2 – FNDS015 IT

Website and Presentation

Due during class in Week 8

This is an individual assignment

Weighting – 30%

1. Overview

Objectives:

Eva is the owner of “Eva’s Travel Tours” and has requested that you build a website to advertise her business. You will also be doing a brief oral presentation to the class, demonstrating your website and your HTML/CSS code.

Assignment Instructions:

1. You will create a website using HTML and CSS. You will gain an understanding of what these languages do when we discuss them during your classes. If not, speak to your tutor before proceeding.

2. Your website will consist of three webpages: a Home page, a Prices page, and a Contact page.

3. To create your website, we will be using Visual Studio Code (https://code.visualstudio.com/). Your teacher can assist you if you need.

4. Ensure that you read the requirements down below.

5. You will then do a 3 – 4 minute oral presentation that will demonstrate your website to the class, showing your created webpages, as well as your HTML and CSS files.

6. Please be respectful of your classmates. If you talk during another person’s presentation, you will automatically lose 10% from your Assignment grade. Your tutor will be monitoring the class during presentations.

Submission Instructions:

1. You must submit your website before you do your oral presentation in class.

2. Ensure that the HTML file for your Home webpage is named home.html, the Places webpage file is named places.html, and the Contact webpage file is named contact.html. Failure to follow these instructions will cost you marks!

3. Zip your website files together (create a .zip file). Remember to also include in your zip any extra files needed, such as image files.

4. Submit the zipped website files to the Assignment 2 Submission link.

5. During class, you will do an oral presentation, demonstrating your website and HTML/CSS code.

Late submissions will incur a 5% penalty each day for up to 5 days. After 5 days, the total assignment score will be 0.

The Business

Eva’s Travel Tours is a travel agency that offers pre-organised travel packages. For example, they may offer a travel package with the following:

● New Zealand, arriving at Auckland

● 7 nights in a hotel

● Bus rides between the hotel and the travel destinations

● Bus rides between the airport and the hotel

● Air fares to and from Auckland

● Total cost: $2500 AUD

2.1 Assignment Requirement – Home Page

The Home page of the website should welcome visitors and explain the business. Create a new HTML file called home.html.

 

On this page, it should:

● Be well organised: there should be a structured layout to the page (e.g. have different content aligned properly), and have the obvious structure that a webpage should have, such as a heading at the top, content in the middle, and links to other pages at the top or left of the page.

● Use good colours: this means that the background should be a pleasing colour, and the text should be easy to read.

● Have a link to the other webpages: somewhere on the Home page should be a hyperlink to the other webpages. This link can either be text, a button, or an image.

● Have a header image: an image or logo that represents the business.

● Have important welcome information: obviously the Home page should provide information about the business to the reader. Have a think about what information you would like to include on the home page. Remember to look at other websites on the Internet for inspiration and ideas.

 

An example of the front page can be found below. Note that this is for an Ice Cream store, which obviously is not the business that we are working with, so do not copy it exactly. It is only an example of how your own website could be laid out.

 

 

2.2 Assignment Requirement – Prices Page

Create a new HTML file called prices.html. The page will describe the travel packages that the business offers. This page should have:

● A header image: an image that represents the business

● A link back to the Home page: somewhere on the page should be a hyperlink to the Home page. This link can either be text, a button, or an image.

● The business offers the following travel packages, which should be displayed on the page:

Package #1:

● Paris, France

● 7 nights in a 5 star hotel

● Day trips to the countryside by bus

● Economy airfares to and from Paris International Airport

● Free entry into all the museums

● Total cost: $5000 AUD

Package #2:

● New York, USA

● 12 nights in a 5 star hotel

● Bus tour of the city

● Economy airfares to and from New York International Airport

● Tickets to a show at Madison Square Garden

● Total cost: $7000 AUD

Package #3:

● Tokyo, Japan

● 10 nights in a 5 star hotel

● Day trips to the countryside by bus

● Economy airfares to and from Tokyo International Airport

● Free train tickets

● Total cost: $6000 AUD

Package #4:

● You need to make up your own travel package, including the destination, cost, and what is included in the travel package.

2.3 Assignment Requirement – Contact Page

The Contact page should provide information about the business. Create a new HTML file called contact.html. This page should contain:

● A header image: an image that represents the business

● A link back to the Home page: somewhere on the page should be a hyperlink to the Home page. This link can either be text, a button, or an image.

● Store addresses*: the address that the business is located

● A phone number to contact*

● Opening times*: the days and times that the business is open

● Google Maps*: include screenshots of locations on Google Maps that show where the business is located

*Keep in mind that obviously the business is not real, so they don’t have real addresses and phone numbers. Please make up your own addresses and phone numbers.

2.4 HTML and CSS Requirements

You will need to write your own HTML and CSS code to create your website. You are not allowed to use a website builder, and instead must write the code yourself. To prove your understanding of HTML and CSS, your website must have each of the following at least once:

● Appropriate headings with proper styles (e.g. with proper font sizes and colours)

● Paragraphs (e.g. with the <p> tag)

● A link between the Home page and the other pages

● An unordered list. What you put in the list is up to you.

● A table

● At least 3 images

● Use of CSS to create styles

● Other information related to the business (e.g. contact details)

  

3. Presentation Requirements

Your oral presentation to the class should demonstrate the following:

1. Home page

2. Price page

3. Contact page

4. HTML code written by you

5. CSS code written by you

Note: You do not need to create any slides for this presentation. Instead, you will show your website live during the presentation through the browser (e.g. Firefox)

When presenting, you should focus on the following topics:

● Describe your website, and comment on your design choices. For example, why did you choose certain colours? How did you decide where the images should go? What do you think a user of your website would think about it?

● Describe your code. Explain clearly what HTML and CSS code you wrote, and explain how it works in detail. You should be able to tell the class how you created your webpages with the HTML/CSS code that you have.

● Presentations should be between 3 – 4 minutes

Helpful resources

There are lots of great recourses available online to help you:

● https://www.w3schools.com/

● https://www.tutorialspoint.com/html/index.htm

● Google searches are very effective also

 

4. Marking Rubric

	Not Satisfactory 0 Marks	Minimum 2.5 Marks	Satisfactory 5 Marks	Good 7.5 Marks	Excellent 10 Marks
HTML Criteria
Pages make good use of tags like <h1>, <p>.
Link between pages is implemented correctly.
Page organised data using tables and lists effectively.
Images are used effectively on the web page and appropriately chosen.
CSS Criteria
CSS code is implemented properly.
Fonts used are of good visual quality.
Colours used are of good visual quality.
Presentation Criteria
Presentation describes all visual qualities of the website.
Presentation describes the html and CSS code well.
Presentation is well spoken and of good quality.