0% found this document useful (0 votes)
4 views

Week 12- Final Web Assignment

The assignment requires the creation of a fully functional, responsive, and accessible multi-page website using HTML, CSS, JavaScript, and XML. Key components include proper web structure, styling, interactive elements, XML data handling, and adherence to web standards and accessibility guidelines. The final submission must include a ZIP file of the project and a README.txt detailing its features.
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
4 views

Week 12- Final Web Assignment

The assignment requires the creation of a fully functional, responsive, and accessible multi-page website using HTML, CSS, JavaScript, and XML. Key components include proper web structure, styling, interactive elements, XML data handling, and adherence to web standards and accessibility guidelines. The final submission must include a ZIP file of the project and a README.txt detailing its features.
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

Assignment Title: Building a Dynamic and Accessible Website

Objective:
In this final assignment, you will apply the key concepts learned throughout the semester to
create a fully functional, responsive, and accessible website that incorporates HTML, CSS,
JavaScript, and XML. This assignment will test your understanding of web standards,
usability, and server-side concepts.

Instructions

You will create a multi-page website based on a topic of your choice (e.g., an online portfolio, a
business website, a blog, or an educational resource). The website must meet the following
requirements:

1. Basic Web Structure (HTML) - 5 Marks

✅ Create at least 3 interlinked web pages (e.g., Home, About, Contact).


✅ Use proper HTML5 structure, including <header>, <nav>, <section>, <article>, <aside>,
and <footer>.
✅ Include ordered and unordered lists, tables, and appropriate headings.
✅ Ensure that all links (internal & external) work correctly.
✅ Embed at least one image with proper alt text.

2. Styling and Layout (CSS) - 4 Marks

✅ Use an external CSS file to style the website.


✅ Implement responsive design using @media queries.
✅ Apply the CSS Box Model correctly (margin, padding, border).
✅ Use flexbox or CSS grid for layout structuring.

3. Interactive Elements (JavaScript) - 4 Marks

✅ Implement at least 2 JavaScript features, such as:

 A form validation script (e.g., checking for empty fields or email format).
 A simple image slider or dynamic content loader.
 Interactive UI elements like a light/dark mode switch.

4. XML Data Handling - 3 Marks


✅ Create an XML file that stores structured data (e.g., product catalog, student records).
✅ Display XML data on your website using JavaScript and DOM manipulation.
✅ Ensure the XML is well-formed and valid.

5. Web Standards & Accessibility (W3C, WCAG) - 2 Marks

✅ Validate your HTML and CSS using W3C Validator.


✅ Follow WCAG accessibility guidelines (proper contrast, keyboard navigation).
✅ Add ARIA attributes for better screen reader support.

6. Submission - 2 Marks

✅ Submit a ZIP file containing your project and a README.txt explaining its features.

You might also like