My Favorite Brunette: Accessibility Remediation
A multi-page film fan site I built as a college final project at Johnson County Community College. I came back to it later with fresh accessibility knowledge and corrected every issue I found against WCAG 2.1 AA. The before and after shows how much a site can change when accessibility is actually applied.
-
Added skip navigation links and wired
id="main-content"targets on every page, enabling keyboard and screen reader users to bypass repeated headers (WCAG 2.4.1). -
Fixed missing
alttext on the logo image and addedaria-labelto the logo anchor; addedaria-label="Main navigation"to every<nav>andaria-current="page"to active nav links (WCAG 1.1.1, 2.4.4). -
Replaced non-semantic
<div>/<span>patterns in the film vitals and cast list with proper<dl>/<dt>/<dd>elements so screen readers expose the term and value relationships correctly (WCAG 1.3.1). -
Fixed
<blockquote>citation markup to use the correct<footer>/<cite>nesting pattern; addedaria-labelledbyto all<section>elements tied to their heading IDs; marked decorative dividersaria-hidden="true"(WCAG 1.3.1, 4.1.2).