Annual Report
FY [Year]
[Add a quote here from one of your company executives or use this space for a brief summary of the document content.]

Web Design
IT 404

Instructions:

You must submit two separate copies (one Word file and one PDF file) using the Assignment Template on Blackboard via the allocated folder. These files must not be in compressed format.
It is your responsibility to check and make sure that you have uploaded both the correct files.
Zero mark will be given if you try to bypass the SafeAssign (e.g. misspell words, remove spaces between words, hide characters, use different character sets, convert text into image or languages other than English or any kind of manipulation).
Email submission will not be accepted.
You are advised to make your work clear and well-presented. This includes filling your information on the cover page.
You must use this template, failing which will result in zero mark.
You MUST show all your work, and text must not be converted into an image, unless specified otherwise by the question.
Late submission will result in ZERO mark.
The work should be your own, copying from students or other resources will result in ZERO mark.
Use Times New Roman font for all your answers.

Name: ###

CRN: ###
ID: ###

2 Marks

Learning Outcome(s):CLO2
Recognize and evaluate a range of real-world web design approaches.

Question One
Define progressive enhancement and explain its significance in web development.
Answer:
Progressive enhancement is a web development strategy that focuses on building a basic, functional experience for all users and then adding advanced features for those with more capable devices or browsers.//[1.25 mark]
Universal Accessibility: progressive enhancement ensures that all users can access the core content, regardless of their device capabilities.//[0.25]
Improved Performance: foundational content loads quickly and efficiently, enhancing the overall performance of the site.//[0.25]
Enhanced User Experience: Users with modern browsers and devices benefit from enhanced features//[0.25]
2 Marks

Learning Outcome(s): CLO2
Recognize and evaluate a range of real-world web design approaches

Question Two Explain the differences between absolute URLs and relative URLs. Provide examples of each and discuss when it would be appropriate to use in web development.
Answer:
Absolute URLs: ///[1 mark]
An absolute URL provides the complete address needed to access a resource on the web. It includes the protocol (such as HTTP or HTTPS), the domain name, and the path to the specific resource.
Always points to the same location, regardless of the current page.
A relative URL provides a path relative to the current page’s URL. It omits the protocol and domain name, focusing instead on the path to the resource.
Depends on the current URL structure.
Example:
https://www.example.com/home/index.html
When to Use: When linking to external resources
Relative URLs: ///[1 mark]
Example:
home/index.html
When to Use: When linking to resources within the same website
2 Marks

Learning Outcome(s):CLO1
Identify most HTML tags and CSS properties and use a text editor to construct the basic HTML and CSS structure for a webpage.

Question Three Write a HTML code to generate the following output.
Important notes:
You should copy and paste the “HTML script” to answer this question. DON’T take screenshots for your HTML script. It must be an editable script.
Take a screenshot of your output web page and paste it as a part of your answer.

Answer:

//[0.25]

//[0.25]

//[0.25]

//[0.25]

//[0.25]

//[0.25]

//[0.25]

//[0.25]

The average height and weight for males andfemales

	Average
	Height (cm)	Weight (kg)
Males	171	74.70
Females	150	62.2

2 Marks

Learning Outcome(s):CLO1
Identify most HTML tags and CSS properties and use a text editor to construct the basic HTML and CSS structure for a webpage.

Question Four Create a well-structured webpage for your favorite book. Your webpage should include the following elements:
Title of the Book: Display the name of the book using the most significant heading.
Image: Include an image of the book cover.
Summary: Provide a summary of the book’s content.
Link: Add a link where users can purchase the book.
Page Structure: Organize your page with a header, a section for the book details, and a footer that includes your name and student ID.

Important notes:
You should copy and paste the “HTML script” to answer this question. DON’T take screenshots for your HTML script. It must be an editable script.
Take a screenshot of your output web page and paste it as a part of your answer.
Answer:

//[0.25]

Title of the Book

//[0.25]
//[0.25]

//[0.25]

Summary: This is a summary of the content of the book.

//[0.25]

Click here to find the book to buy//[0.25]