T1 2020 ICT272 Web Design And Development Assignment 1 Due

T1 2020 Ict272 Web Design And Developmentassignment 1 10due Date

Create an online store with some specialty products following specified guidelines. The site must be created using Visual Studio and include multiple web pages with consistent navigation, layout, and styling. Each page should feature a menu at the top using CSS, a footer, and a sidebar on the left for category navigation. The website must incorporate HTML, CSS, and minimal ASP controls, particularly on the Contact page. The layout should utilize tables, images/graphics, diverse fonts, various headings, and colors, ensuring proper spelling and grammar throughout.

Paper For Above instruction

The development of a comprehensive online store requires meticulous planning and implementation to ensure user engagement, aesthetic appeal, and functional integrity. This project involves creating a multi-page website using Visual Studio, integrating HTML, CSS, and minimal ASP controls to simulate a real-world e-commerce platform. The site's design must be responsive, visually engaging, and easy to navigate, aligning with best practices in modern web development.

Introduction and Purpose

The primary aim of this project is to develop an online store that effectively showcases specialty products within a structured and user-friendly interface. The purpose is to provide potential customers with detailed information about products, facilitate easy navigation through various categories, and enable direct communication via a contact form. The website acts as a prototype for real-world digital commerce platforms, emphasizing effective layout, design, and technical implementation.

Website Structure and Content

The website consists of several interconnected pages: the Main Page, About Us, Products, Contact, and Reference page. Each page should maintain uniformity in layout and style, ensuring a seamless user experience. The Main Page introduces visitors to the store, highlighting key offerings and providing an overview of the site. The About Us page details the purpose of the website and explains the layout choices, emphasizing the site's focus and design philosophy.

The Products page categorizes products into at least three distinct categories, with five products listed under each. Products should be presented within tables to optimize layout and readability. A sidebar on the left should display the categories, allowing users to navigate easily to their area of interest. Images and graphics should complement text descriptions, making the store visually appealing.

The Contact page should incorporate form elements such as text inputs and labels to gather user information. A map image should be included to display the location or store address. When the form is submitted, users should be redirected to a Thank You page confirming their submission. Additionally, a References page must list all sources for images, graphics, and other external resources, presented as a bulleted list with links.

Design and Technical Requirements

  • All pages must include a menu at the top, styled with CSS, linking to all other pages.
  • Use CSS to style the menu, footer, sidebar, and overall layout, including font styles, headings, colors, and spacing.
  • Implement a footer section across all pages containing copyright or contact information.
  • Use HTML tables for product layout, ensuring a structured presentation.
  • Incorporate images and graphics relevant to the products and store branding.
  • Employ a variety of fonts, headings, and colors to enhance visual interest and hierarchy.
  • On the Contact page, use ASP controls minimally — for example, to enhance validation or submission handling.
  • Ensure all text is well-written with proper spelling and grammar.

Submission and Presentation

The completed website files should be zipped and uploaded to Moodle by the tutorial deadline in Week 6. Additionally, a Word document containing explanations and screenshots of the design and code should be submitted. During Week 6, a presentation may be conducted, where you explain the design choices and code structure.

Conclusion

This project provides an opportunity to demonstrate skills in web design, development, and project management. By adhering to these guidelines, the final website will serve as a strong example of an effective online store built with HTML, CSS, and minimal server-side controls, emphasizing visual appeal, usability, and technical proficiency.

References

  • W3Schools. (2024). HTML Tutorial. https://www.w3schools.com/html/
  • W3Schools. (2024). CSS Tutorial. https://www.w3schools.com/css/
  • Mozilla Developer Network (MDN). (2024). HTML Reference. https://developer.mozilla.org/en-US/docs/Web/HTML
  • Mozilla Developer Network (MDN). (2024). CSS Reference. https://developer.mozilla.org/en-US/docs/Web/CSS
  • Microsoft Docs. (2024). ASP.NET Web Controls. https://docs.microsoft.com/en-us/aspnet/web-forms/overview/getting-started/introduction/getting-started
  • Google Fonts. (2024). Free Web Fonts. https://fonts.google.com/
  • Adobe Stock. (2024). Commercial Images. https://stock.adobe.com/
  • Unsplash. (2024). Free Stock Photos. https://unsplash.com/
  • Stack Overflow. (2024). Web Development Q&A. https://stackoverflow.com/
  • SitePoint. (2024). Web Design Best Practices. https://www.sitepoint.com/

Related Assignments