StayWell — Accessible Booking Website

A polished, portfolio-quality hotel booking website built with React, TypeScript, and Tailwind CSS.

Project Overview

StayWell includes:

• Home page with hero, search form, featured properties, and testimonials
• Search results with filters and property cards
• Property details with room booking CTAs
• Multi-step booking flow and confirmation
• Login/Signup pages and 404 handling

Accessibility Features

Short Accessibility Checklist

• Keyboard navigation works across key routes
• Skip link to main content is present and focusable
• Visible focus styles are implemented
• Form fields are labeled and validation is announced
• Semantic landmarks/headings are used
• Automated WCAG A/AA audits pass

Issues Found

• Baseline issue: aria-prohibited-attr on the home page testimonial star groups (3 occurrences)
• Baseline Lighthouse score (/): 97
• Current Lighthouse score (/): 100
• Current axe result: 0 violations across 8 tested routes

Tools Used

• Lighthouse (CLI)
• axe (@axe-core/cli)
• WAVE (included in review workflow; see note in full report for localhost limitation)

What Was Fixed

• Added valid semantics for labeled star-rating groups via role="img"
• Removed animation styles that could cause transient contrast failures during automated checks

Full report and raw artifacts: docs/accessibility/ACCESSIBILITY_REPORT.md

Running the Project

npm install
npm run dev