Blog

Is your website ADA-ready? 7 WCAG issues small businesses miss

Most small business websites fail basic accessibility checks. Learn the seven most common WCAG 2.2 issues that automated scanning catches — and how to fix them before they become problems.

AccessibilityWCAGSmall Business

Your website might be turning away customers without you ever knowing it. According to the World Health Organization, over one billion people worldwide live with some form of disability. In the United States alone, that translates to roughly 27% of adults — a significant portion of your potential customer base who may struggle to use your site if it isn't accessible.

The good news: most accessibility problems have straightforward fixes. The better news: automated scanning tools can catch many of these issues before they become complaints, lost sales, or legal letters. Here are the seven WCAG 2.2 AA issues we see most often when scanning small business websites — and what you can do about each one.

1. Missing or inadequate alt text on images

Alt text (alternative text) describes images for people who use screen readers or have images disabled. When alt text is missing, screen reader users hear "image" or a meaningless file name like IMG_4523.jpg instead of useful context.

What to fix:

  • Add descriptive alt text to every meaningful image. Describe what the image shows and why it matters in context.
  • For decorative images that add no information (like background patterns), use an empty alt attribute (alt="") so screen readers skip them entirely.
  • Avoid keyword stuffing. Alt text should serve users, not search engines.

Example: Instead of alt="photo" for a product image, write alt="Stainless steel French press coffee maker on kitchen counter".

This is one of the most common issues we find — and one of the easiest to fix once you know what to look for.

2. Insufficient color contrast

Low contrast between text and background makes content hard to read for users with low vision, color blindness, or anyone viewing your site in bright sunlight. WCAG 2.2 AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18px+ bold or 24px+ regular).

What to fix:

  • Test your color combinations using a contrast checker tool.
  • Pay special attention to light gray text on white backgrounds — a design trend that fails accessibility requirements.
  • Don't forget about placeholder text in form fields, which often uses low-contrast styling.

Common offenders: Trendy light-gray-on-white designs, text over photographic backgrounds without sufficient overlay, and "muted" UI elements that carry important information.

If your designer pushes back, remind them that accessible color choices don't mean boring design — they mean design that works for everyone.

3. Missing form labels

When form fields lack proper labels, screen reader users can't tell what information they're supposed to enter. A sighted user sees a text field next to the word "Email" and makes the connection instantly. A screen reader user navigating without visual context needs that connection made explicit in the code.

What to fix:

  • Ensure every form input has an associated <label> element with a for attribute matching the input's id.
  • Placeholders are not labels. While placeholder text can provide hints, it disappears when users start typing and isn't reliably announced by all screen readers.
  • Group related fields (like credit card number, expiration, and CVV) using <fieldset> and <legend>.

Your contact form, checkout flow, and newsletter signup are the places to audit first. These are often the most important conversion points on your site — and the ones most likely to have accessibility gaps.

4. Keyboard navigation issues

Not everyone uses a mouse. Some users rely entirely on keyboards due to motor disabilities, temporary injuries, or personal preference. If your website can't be fully operated with Tab, Enter, and arrow keys, you're locking out a portion of your audience.

What to fix:

  • Ensure all interactive elements (links, buttons, form fields, menus) are reachable via keyboard.
  • Add visible focus indicators so keyboard users can see where they are on the page. The default browser outline is functional; if you remove it for aesthetics, replace it with something equally visible.
  • Test dropdown menus and modal dialogs — these are common keyboard trap culprits.

How to test: Put your mouse aside and try to complete key tasks on your site using only your keyboard. Can you navigate to every link? Submit a form? Close a popup? If you get stuck, so will your keyboard-only users.

5. Missing or incorrect heading structure

Headings (<h1> through <h6>) aren't just visual styling — they create a document outline that screen reader users navigate by. When headings skip levels, repeat inappropriately, or don't exist at all, users lose the ability to quickly understand and move through your content.

What to fix:

  • Use one <h1> per page for the main topic.
  • Follow a logical hierarchy: <h1><h2><h3>. Don't skip from <h1> to <h3> because you prefer the smaller font size.
  • Use CSS for visual styling, not heading levels. If you want smaller text, style the appropriate heading level rather than using the wrong level.

A simple audit: Install a browser extension that shows your heading structure. You should see a clean outline that makes sense without the rest of the page content. If your headings read like a jumbled list, restructure them.

"Click here" and "Read more" tell users nothing about where a link leads. Screen reader users often navigate by pulling up a list of all links on a page. When that list shows "Click here" repeated twelve times, it's useless.

What to fix:

  • Write link text that describes the destination: "View our accessibility services" instead of "Click here".
  • If design constraints require short link text, use aria-label to provide screen readers with more context.
  • Ensure linked images have alt text that describes the link destination.

Before: "To learn more about our services, [click here]." After: "[Learn more about our accessibility monitoring services]."

This change benefits everyone. Sighted users scan pages for links too — descriptive text helps them find what they need faster.

Long navigation menus force keyboard users and screen reader users to wade through dozens of links before reaching main content. Skip links (typically "Skip to main content") let users bypass repetitive navigation. Landmark regions (<header>, <nav>, <main>, <footer>) provide additional structure that assistive technology can use for quick navigation.

What to fix:

  • Add a skip link at the very top of your page that jumps to the main content area.
  • Use semantic HTML5 elements (<header>, <nav>, <main>, <aside>, <footer>) instead of generic <div> elements.
  • If you use ARIA landmarks, ensure they don't duplicate what semantic HTML already provides.

Test: Tab into your page from a fresh load. The first focusable element should be a skip link. Activate it and confirm focus moves past navigation to your main content.

Automated scanning helps — but doesn't certify compliance

These seven issues represent a significant portion of what automated accessibility scanners detect. Machine-checkable rules can identify missing alt text, contrast failures, form label problems, and structural issues reliably and repeatedly.

However, there are limitations. Automated scanning informs remediation and audit preparation — it does not replace a manual expert review or legal certification. Some WCAG success criteria require human judgment: Is this alt text actually descriptive? Does this interaction make sense to someone who can't see the visual feedback? Scanners can flag potential problems, but humans verify the full user experience.

How Heuristics AI helps

Our ADA Compliance Scanner runs automated WCAG 2.2 AA checks on up to 25 pages per month. Findings are prioritized by severity — Critical, Serious, Moderate, Minor — so you know what to fix first. Each issue maps to the component or page pattern that caused it, with plain-language remediation guidance your developers can act on.

You receive a monthly PDF report suitable for stakeholders, auditors, or legal conversations. Each cycle rescans the same scope so you can track which issues closed, which regressed, and whether accessibility debt is shrinking over time.

ADA Compliance Scanner costs $100/month, billed month-to-month with no long-term commitment. It's designed for marketing sites, product pages, and focused web properties that need a steady baseline without an enterprise-scale crawl package.

For teams that also need search visibility monitoring, our SEO & GEO Auditor tracks keyword performance and generative-engine visibility alongside accessibility — because being found and being usable go hand in hand.

Next steps

If you're not sure where your site stands, start with a quick self-audit using the checklist above. Focus on your most important pages: homepage, contact form, and primary service or product pages.

When you're ready for systematic monthly monitoring, view our pricing or reach out directly to discuss your specific needs. We're happy to answer questions about scope, methodology, or how our reports integrate with your existing workflows.

Accessibility isn't a one-time checkbox — it's an ongoing practice. The sooner you start monitoring, the easier it becomes to maintain. Get found. Get answered. Stay informed.