COMP-2057
Introduction to the Internet
Winter 2024
Created by: Dr. Saja AL-Mamoori
School of Computer Science sajak@uwindsor.ca
https://cs.uwindsor.ca
Final Project
Mark: 25 points
Due date: Monday March 25 (end of day)
• In this project, you will create a complete web site using the HTML tags that you
practiced in Assignment 4.
• Using the reference material provided in the course pages and available at other sites on
the Internet, your activity is to create five web pages described below and one citation
page.
• The six web pages are to be designed according to the specifications below. The website,
total of 6 web pages, must have one home page, called index.html, and five other web
pages of related information created as separate .html files.
• Create a folder under myweb → system info and files → file manager → public_html
directory on MyWeb to save all the project files and submit the link to the home page,
index.html, of the site on Brightspace.
Page 1: Homepage – Introduction to the Internet (index.html)
Your home page will be created in either one of the following layouts (A or B):
Layout A: Links as a top navbar Layout B: Links as a side navbar
Page 1 – Page Page Page Page Page 6 – Page 1 – Home Content here!
Home 2 3 4 5 Citation page
page page Page 2
Content here! Page 3
Page 4
Page 5
Page 6 – Citation
Page
• Use 3 HTML paragraphs (<p>) to provide a brief overview of the Internet's history and
significance. Each paragraph should be 7-10 sentences.
COMP-2057
Introduction to the Internet
Winter 2024
Created by: Dr. Saja AL-Mamoori
School of Computer Science sajak@uwindsor.ca
https://cs.uwindsor.ca
• Incorporate one HTML list (<ul>) for key milestones or advancements on the Internet.
• Create a descriptive timeline of the history of the Internet on and included it as an image
using the <img> tag.
Page 2: Web Technologies – Understanding Protocols and Standards
• Utilize 2 HTML tables (<table>/<tr>/<td>) to present information about various web
technologies related to the Internet.
• Embed 3 code snippets within HTML <pre> tags to showcase examples of protocols like
HTTP and HTML.
• Include 3 links (<a>) to external resources for further reading.
Page 3: Cybersecurity – Navigating the Online World Securely
• Include 3 paragraphs to explain common online threats and security measures. Each
paragraph should be 7-10 sentences.
• Incorporate 2 images and 2 icons to enhance visual appeal.
• Add 3 links to external Internet security websites and tutorials.
Page 4: E-commerce –The Evolution of Online Shopping
• Implement 1 HTML list (<ol>) and 2 paragraphs to outline the evolution of e-commerce.
Each paragraph should be 7-10 sentences.
• Integrate 2 images of successful e-commerce platforms using the HTML <img> element.
• Add 3 links to popular e-commerce websites.
Page 5 – Contact Us Page
• Include 1 feedback form for users to submit queries or comments.
• Add links to 3 social media profiles.
• Use a clickable map to show and find the location of the office.
Page 6: Citation Page
Use this page to give credit to all your sources of information and/or images used in your web
site. Citation should be in MLA format.
Instructions:
COMP-2057
Introduction to the Internet
Winter 2024
Created by: Dr. Saja AL-Mamoori
School of Computer Science sajak@uwindsor.ca
https://cs.uwindsor.ca
• You are to create the entire Web site from scratch using a simple text editor such
as NotePad or NotePad++, TextEdit or Brackets.
• When using colour parameters only hexadecimal values will be accepted for specifying a
color. Use the # sign with all hexadecimal colour codes.
• Capitals are not accepted when naming a file or within a command. Everything that is not
text (content) must be in lowercase. Tags, especially, must be in lower case.
• Spelling, grammar, and coherency count.
• Watch the order of tags while closing them.
• Keep backgrounds consistent throughout the site.
• When making thumbnails, the use of height and width parameters is not permitted to
resize your image files. Only resizing the image to thumbnail size using Paint Shop Pro
or another graphics editor is acceptable. Otherwise, you will have a major slowdown in
page loading time. NOTE: make sure you still include height and width attributes in your
image tags with the actual dimensions of the images.
• Make sure you aren't missing quote marks around attribute value specifications (i.e.,
attribute="value")
• As a page is a full body it cannot be dismembered. It will always have one <head> tag
and one <body> tag in that order.
• A page of 1 and a half screens or longer MUST have internal links and targets.
• Every page (file) must have a title.
• Tables and images that scroll off the screen to the right will be penalized.
• Pay attention to the components of each page to avoid deductions.
• No spaces in any file names.
• No commercial web sites of any kind!
• All content on all pages must be the original work of the student. Using external images
and resources must be cited in the citation page.
Submission:
1. The assignment is to be “uploaded” on MyWeb or the electron server. A link to the home
page, index.html, should be submitted on Brightspace.
2. Be sure to zip all the website’s files and upload it on Brighspace to access it in case of
any issue with the server.
Marking Scheme (25 points)
COMP-2057
Introduction to the Internet
Winter 2024
Created by: Dr. Saja AL-Mamoori
School of Computer Science sajak@uwindsor.ca
https://cs.uwindsor.ca
The following is a breakdown of the marking scheme for the final project. All content must be
original work of the student. Plagiarism will not be tolerated.
1. Required elements of the pages (up to 15 Marks)
a. Page 1 – Home Page index.html (3 paragraphs, 1 ul list, 1 timeline image) (3 marks)
b. Page 2 – Web technologies (2 tables, 3 code snippets, 3 external links) (2 marks)
c. Page 3 – Cybersecurity (3 paragraphs, 2 images, 2 icons, 3 external links) (3 marks)
d. Page 4 – E-commerce (1 ol list, 2 paragraphs, 2 images, 3 external links) (2 marks)
e. Page 5 – Contact us (1 form, 3 external links, clickable map) (4 marks)
f. Citation Page (1 mark)
2. Content and Aesthetics (up to 5 Marks)
a. The quality of the material presented on the website. The project must contain a
minimum of 6 pages with genuine content on them. (2 marks)
b. Correct spelling and grammar (1 marks)
c. The presentation and general appearance of the website. The pages should be easy
to read and have some visual appeal without distracting from the information
presented. The information presented in the pages should be easy to locate within
the pages. The images and colours chosen for the pages must be appropriate for the
subject matter being presented. (2 marks)
3. Construction (up to 5 Marks)
a. Links not working between pages, 2-mark deduction.
b. There will be a 0.5-mark deduction for each of the following HTML errors.
i. Using deprecated (old) tags.
ii. Using more than one <body> tag.
iii. Missing a closing </body>,</title>,</head>, or </html>
iv. Improperly closing a <br />, <hr />, or <img /> tag.
v. Improper indentation.
vi. Improper spacing.
vii. Missing comments on every page.
viii. Improper file names, folders used, and/or not loading automatically.
ix. External links not working on image map.
x. Improper nesting or missing closing tags.
xi. Background colour NOT using #RRGGBB format.
Please be very mindful of copyright and plagiarism. If you are using material or ideas from other
sources, you must indicate it. We need to know that your work is original and not just a copy and
COMP-2057
Introduction to the Internet
Winter 2024
Created by: Dr. Saja AL-Mamoori
School of Computer Science sajak@uwindsor.ca
https://cs.uwindsor.ca
paste of something that already exists on the Internet. If you do submit work as original, and we
determine that it has been copied, appropriate academic actions will be taken.
