Skip to content

README.md

Latest commit

 

History

History
46 lines (35 loc) · 1.52 KB

README.md

File metadata and controls

46 lines (35 loc) · 1.52 KB

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