SPARK Barbershop

A sleek & modern barbershop website.

Company
SPARK Barbershop
Role
Web Developer & Designer
Technology
HTML5, CSS3, Javascript
Website
https://rodr0245.github.io/mtm6201-midterm/index.html

Overview

This project showcases a fully responsive, minimalist website designed for SPARK Barbershop. Built entirely from scratch using vanilla HTML5, CSS3, and JavaScript, the design emphasizes simplicity and accessibility while maintaining a professional, modern aesthetic. The site includes three key sections: Home: A welcoming landing page introducing the barbershop. Services: A detailed list of services provided, designed for easy readability. Contact: A straightforward contact form and details for potential clients.

Objectives

Simple & Modern Design

Deliver a clean, black-and-white aesthetic that reflects the brand's sleek identity while being accessible to all users.

Fully Responsive Layout

Ensure seamless functionality and design consistency across all screen sizes, from mobile devices to desktops.

Usability & Navigation

Provide an intuitive structure and navigation that makes it easy for users to find essential information quickly.

Challenges & Solutions

Challenges

Creating a fully responsive website without using any frameworks or libraries.
Designing a layout that balances simplicity with a modern aesthetic.
Maintaining accessibility standards in a black-and-white design.

Solutions

Wrote custom CSS3 media queries to ensure responsiveness across various devices and screen sizes.
Used semantic HTML5 for a clean structure and easy navigation, ensuring accessibility compliance.
Applied subtle animations and styling techniques with vanilla JavaScript and CSS to maintain an engaging yet simplistic user experience.

Showcase