Common Violations

The most frequently found accessibility issues, and how to fix them.

• Missing Alt Text: The Most-Cited Accessibility Violation

  Images without alternative text are invisible to screen reader users and the single most commonly cited issue in web accessibility lawsuits. Here's exactly how to fix it.

• Missing Form Labels: Why Placeholder Text Isn't Enough

  A form field without a programmatically associated label is a guessing game for screen reader users, even if it looks fine visually. Here's the fix, and why placeholder text doesn't count.

• Insufficient Color Contrast: The 4.5:1 Rule Explained

  Text needs a minimum contrast ratio against its background to be readable by people with low vision. Here's the exact math, the common failure patterns, and how to fix them.

• Keyboard Inaccessible Controls: Why 'Works With a Mouse' Isn't Enough

  Any interactive control that only responds to a mouse locks out keyboard users entirely — including most screen reader users and many people with motor disabilities. Here's how to test for it and fix it.

• Missing Skip Navigation: Why Every Page Needs a Bypass Link

  Without a way to skip repeated navigation, keyboard and screen reader users have to tab through the same menu on every single page before reaching the actual content. Here's the fix.

• Empty Links and Buttons: When 'Click Here' Isn't Even There

  A link or button with no accessible text announces as just 'link' or 'button' to a screen reader — completely unusable without visible context. Here's how it happens and how to fix it.

• Missing Page Language: The One-Attribute Fix

  Without a lang attribute on the html element, screen readers guess at pronunciation rules and often get it wrong. It's a one-word fix with an outsized impact on how a page actually sounds.

• Missing or Generic Page Titles

  A page with no <title>, or the same title on every page, leaves screen reader users and anyone with many browser tabs open with no way to tell pages apart. Here's what makes a good one.

• Improper Heading Order: Why Skipping Levels Breaks Navigation

  Screen reader users often navigate a page by jumping between headings alone. Skipping from an H1 straight to an H3, or using headings purely for their visual size, breaks that navigation model.

• Duplicate IDs: A Small Markup Mistake With Outsized Consequences

  An id attribute must be unique on a page. When it isn't, label associations, ARIA references, and in-page links can silently point to the wrong element.

• Obsolete Presentational Markup: <center>, <font>, and the align Attribute

  Tags like <center> and <font>, and the align attribute, were dropped from HTML5 because they mix presentation into structure. Here's what to replace each one with.

• Missing Iframe Titles: Naming Embedded Content

  An iframe with no title attribute announces to a screen reader as an unnamed, unexplained region. Here's what a good iframe title looks like and why it matters.

• Invalid ARIA Attributes: When Trying to Help Makes Things Worse

  A misspelled ARIA attribute or an invalid value doesn't just fail silently — it can actively break how assistive technology understands an element. Here's how to catch and fix it.

• Disabled Pinch-to-Zoom: Why maximum-scale=1 Should Never Ship

  A viewport meta tag that disables zooming locks out anyone who needs to enlarge text to read it — a barrier with no legitimate use case in modern responsive design.

• Missing Table Headers: Why Data Tables Need th, Not Just Bold Text

  A data table where headers are only bold or larger text — not real <th> elements — gives a screen reader user no way to know which column or row a given cell belongs to.

• Landmark and Region Issues: Giving Screen Readers a Map of the Page

  ARIA landmarks let screen reader users jump directly between a page's header, navigation, main content, and footer. Missing or duplicate landmarks break that shortcut.

• Missing Form Submit Buttons

  A form with no real submit control forces users to guess how to complete it, or blocks keyboard and screen reader users entirely if submission only works via a mouse-triggered script.

• Ungrouped Form Controls: Why Related Radio Buttons and Checkboxes Need fieldset

  A group of related radio buttons or checkboxes with no fieldset/legend wrapper gives screen reader users no indication that the options belong together, or what the group as a whole is asking.