Lab 1 Report

HTML Files & their purpose

• index1.html- this is the main homepage. It contains the website title, navigation menu, some contact details in the footer and a shop now button that directs you to search product page.
• register.html- it contains a customer registration form with input fields for name, email, password, address, city, state, and postal code. This page use internal CSS
• search.html- this provides a search interface with a text input and category selection options (All, Chair, Table, Bedroom Furniture) that redirect to specific product pages.
• order.html- it displays selected products in a cart format along with individual prices, delivery charges, total cost, and a payment button.
• help.html- it contains instructions and navigation links for different functionalities such as registration, product search, order placement, and employee access.
• employee_login.html- this includes a login form for employees requiring employee ID and password.
• employee_dashboard.html- displays options for employees such as updating the product catalog or logging out.
• update.html- this page provides a form interface for editing product details including name, description, and price.
• Category Pages (all.html, table.html, chair.html)- display product listings with names, prices, and "Add to Cart" buttons. These pages use internal CSS
• payment.html- This page offers few payment methods like cash on delivery, credit card or other wallet, however rightnow if customer chooses any option nothing will happen since backend is not implemented.

CSS Usage:

An external stylesheet (style.css) is used to provide a consistent design across multiple pages including index.html, search.html, help.html, employee_login.html, employee_dashboard.html, and update.html. This stylesheet defines the overall layout, including body styling, header design, navigation bar (in common pages), container spacing, button styling, and footer appearance.

Internal CSS is used in certain pages such as register.html, order.html, and bedroom.html to apply page-specific styling. This includes form layout, alignment, colors,button design etc that are unique to those pages.

Back to Lab 1 Page