Web Development I Assignment II
Personal Portfolio Website [20 marks]
Objective
Question One [15 marks]
Using HTML and CSS Create a personal portfolio website that showcases your soft skills in IT
sector, and the services you can offer to provide IT solution in the society.
Requirements
1. Homepage
o Title of the page should be your name.
o A header with your name and a navigation menu linking to the different sections
(About, Services, Contact).
o A brief introduction about yourself (2-3 sentences).
o A professional-looking image of yourself (optional).
o A background color or image that reflects your personal style.
2. About Section
o A heading (h2) with the title "About Me".
o A paragraph detailing your background, skills, and interests.
o Use at least one list (unordered or ordered) to highlight key skills or experiences.
3. Services Section
o A heading (h2) titled "My Services".
o Showcase at least three projects:
For each service, include:
A service title (h3).
A brief description of the service (1-2 sentences).
A link to the service (if applicable) or a placeholder link.
An image or screenshot of the service (optional).
o Use CSS to style the services page in a grid or card layout.
4. Contact Section
o A heading (h2) titled "Contact Me".
o Include a simple contact form with the following fields:
Name (text input)
Email (email input)
Message (textarea)
Submit button
o Ensure the form is styled for visual clarity.
5. Footer
o Include a footer with your social media links (at least two platforms, e.g.,
LinkedIn, GitHub).
o Add copyright information.
6. Top navigation bar
o Include a top navigation bar with the following link: Home, about us, My
Services, contact us and profile menus to each page
Technical Requirements
Use CSS for styling (external stylesheet preferred).
Ensure the website is responsive (adjusts well on different screen sizes).
Use classes and IDs to apply CSS styles appropriately.
Include comments in your code to explain different sections.
Question Two [5 marks]
Create a responsive top navigation bar of a webpage using HTML and CSS. the navigation
links/menus should change color when hovered over. Your top navigation bar should contain the
following menus: Home, About Us, Services and contact us
How to submit:
Zip all the files on a single file and submit them on the eLearning platform (ZDS)