Why a Perfect Lighthouse Accessibility Score Still Left Gaps in One Developer's Site
A developer building a practice portfolio site for a fictional potter achieved a 100 Lighthouse accessibility score after fixing a single color contrast issue with terracotta-colored links on a cream background. However, a manual audit revealed further gaps that automated tools had missed entirely. Inline SVG icons in the contact section were given aria-hidden and focusable=false attributes to prevent unpredictable screen reader behavior, since they duplicated information already present in text labels. Landmark navigation was also restructured so that About, Gallery, and Contact sections could be jumped to directly by screen reader users, while the hero section was deliberately left out of the landmark list. A deeper review later uncovered invalid HTML — a heading nested inside an address element — which no automated tool or screen reader had flagged, underscoring that automated scores measure only what they are built to check.
This is an AI-generated summary. ShortSingh links to the original source for the complete article.
Discussion (0)
Log in to join the discussion and vote.
Log in