A full-page menu with 40+ food photos had no alt attributes on any image. Screen reader users heard "image, image, image" repeated with no information about what food was shown, its description, or its price. The entire menu was invisible to visually impaired customers.
alt="Margherita pizza, 12 inches, tomato and mozzarella, $16". For purely decorative images, use alt="" to tell screen readers to skip them.The "Complete Purchase" button was built as a styled <div> element with a JavaScript click handler. Tab key navigation could not reach it, and pressing Enter or Space did nothing. Keyboard-only users — including many with motor disabilities — were completely locked out of completing a purchase.
<div onclick="..."> with a native <button> element. No visual change required. Browsers give buttons full keyboard support automatically.Patient intake forms were uploaded as scanned image PDFs — essentially photographs of paper documents. Screen reader software returned zero readable content. Patients with visual impairments had no way to independently review, complete, or submit intake forms before appointments.
The "Book Now" button used light grey text (#c0c0c0) on a white background (#ffffff) — a contrast ratio of 2.1:1. WCAG 2.1 AA requires a minimum of 4.5:1 for normal-sized text. For users with low vision, color blindness, or anyone viewing the page in bright sunlight, the button was effectively invisible.
The site's <html> tag had no lang attribute. Screen readers default to the operating system language setting when no language is declared, causing English content to be mispronounced or read incorrectly when a user's OS is set to another language. Affects multilingual users and users with certain assistive technology configurations.
lang="en" to the opening HTML tag: <html lang="en">. This is a 5-second change that applies to every page on the site at once.All examples are anonymized composites based on common violations we encounter. Updated monthly.