The 10 Most Common Website Accessibility Mistakes (And How to Fix Each One)

The average website has 56.8 detectable accessibility errors per page. That number comes from the WebAIM Million study, which analyzes the top one million websites annually for WCAG conformance. 96.3% of home pages have detectable WCAG 2 failures. But here is the part most reports leave out: the same 10 mistakes account for roughly 85% of all detected violations. Fix these 10, and you eliminate the vast majority of your accessibility risk — and your legal exposure. Most of these fixes take a developer less than an hour per page.

This article covers each of the 10 most common accessibility mistakes in order of frequency, explains why each one matters to real users, and provides the specific fix. For the full compliance standard, see our ADA website compliance services.

Mistake 1: Missing Alt Text on Images

54% of website home pages have images without alt text. When a screen reader encounters an image without alt text, it either skips the image entirely (leaving the user unaware it exists) or reads the file name ("IMG underscore 4837 dot jpeg"), which is meaningless. Alt text is the text alternative that describes the image's content and function for users who cannot see it. WCAG 1.1.1 requires it for every non-decorative image.

The fix: add an alt attribute to every img tag. For informational images, write a concise description of what the image conveys — "kitchen remodel with white shaker cabinets and quartz countertops" rather than "kitchen photo." For decorative images (backgrounds, spacers, purely visual borders), add an empty alt attribute (alt="") so screen readers skip them. For images that function as links, the alt text should describe the link destination, not the image appearance. Revenue Group writes alt text during every website build and accessibility remediation — it takes roughly 30 seconds per image and is the single highest-impact accessibility fix available.

Mistake 2: Insufficient Color Contrast

83% of home pages have text that fails WCAG color contrast requirements. The standard: normal-size text must have a contrast ratio of at least 4.5:1 against its background, and large text (18pt or 14pt bold and above) requires 3:1. The most common failure is light gray text on a white background — a design choice that looks "clean" but renders text unreadable for users with low vision, color blindness, or anyone reading a screen in bright sunlight.

The fix: use a contrast checking tool (WebAIM Contrast Checker, Chrome DevTools, or the WAVE browser extension) to verify every text-background combination on your site. Common offenders include placeholder text in form fields (often light gray on white), footer text, navigation links, and body text with insufficient darkness. Increasing the text color from #999999 to #595959 on a white background changes the ratio from 2.85:1 (failing) to 7.0:1 (passing AA and AAA) without dramatically changing the visual design. For specific WCAG requirements, see our guide on WCAG 2.2 compliance.

Mistake 3: No Keyboard Navigation

Every interactive element on your website — links, buttons, form fields, dropdown menus, modal windows, tabs, sliders — must be operable using only a keyboard. This is not an edge case: keyboard navigation is essential for blind users (who cannot see where to click a mouse), users with motor disabilities (who may use switch devices or voice input that emulates keyboard commands), and power users who navigate by keyboard for efficiency. WCAG 2.1.1 requires that all functionality be accessible via keyboard.

The most common keyboard failures: dropdown menus that only open on mouse hover (not on Enter or Space key), modal windows that cannot be closed with the Escape key, custom UI components (sliders, tabs, accordions) built with div and span elements that do not receive keyboard focus, and "keyboard traps" where the user can Tab into an element but cannot Tab out. The fix depends on the specific failure, but the principle is consistent: use native HTML elements (button, a, input) whenever possible because they are keyboard-accessible by default. Custom components built with non-interactive elements need tabindex, keydown event handlers, and proper ARIA roles.

Mistake 4: Missing Form Labels

46% of form inputs lack a programmatically associated label. A visual label that sits next to a form field but is not connected to it via the "for" attribute is invisible to screen readers — the user hears "edit text" or "text input" with no indication of what information the field expects. Even placeholder text inside the field is not an accessible label because it disappears when the user begins typing, leaving them unable to verify what they were asked to enter.

The fix: every form input must have a label element with a "for" attribute matching the input's ID, or the input must be wrapped inside its label element. This takes approximately 2 minutes per form to implement. For forms that use placeholder text as the only visible label (a common modern design pattern), add a visually hidden label that screen readers can announce while maintaining the visual design. Revenue Group's form audits consistently find that fixing label associations increases form completion rates by 5% to 12% across all users — not just those using assistive technology — because clearly labeled forms are easier for everyone to use.

Mistake 5: Auto-Playing Media

Videos and audio that play automatically when a page loads create barriers for multiple user groups. Screen reader users hear their assistive technology output compete with the media audio, making both unintelligible. Users with cognitive disabilities experience disruption and disorientation. Users with vestibular disorders may experience motion sickness from unexpected video playback. WCAG 1.4.2 requires that any audio playing automatically for more than 3 seconds must have a mechanism to pause or stop it, or to control the volume independently of the system volume.

The fix: do not auto-play media with audio. If a background video is essential to the design, mute it by default and provide a visible play/pause control. The control must be keyboard accessible and clearly labeled ("Pause background video"). Better yet, use a static image or a short looping video that starts paused and only plays when the user activates it. Revenue Group removes auto-playing media from client sites as a standard practice because the accessibility harm outweighs any design benefit.

Mistake 6: Missing Document Language

18% of home pages do not declare a document language in the html tag. Without a lang attribute (lang="en" for English), screen readers cannot determine the correct pronunciation rules, voice profile, or braille translation table to use. A French-language screen reader encountering an undeclared English page will attempt to pronounce English words with French phonetic rules, producing incomprehensible output.

The fix: add lang="en" (or the appropriate language code) to the opening html tag. This is a 10-second fix that affects the entire site. For pages with content in multiple languages, use the lang attribute on specific elements to identify language changes (for example, a Spanish quote within an English page). This is WCAG 3.1.1 — one of the simplest criteria to meet and one of the most commonly missed.

Mistake 7: Empty Links and Buttons

49% of home pages have links or buttons with no accessible name. This happens when a link contains only an image with no alt text, when a button uses an icon font without a text label or ARIA label, or when a link wraps an empty element. The screen reader announces "link" or "button" without telling the user what the link goes to or what the button does. For a screen reader user navigating by link list or button list, these elements are completely unusable.

The fix: every link and button must have a text label — either visible text content, an alt attribute on an image within the element, or an aria-label attribute for icon-only controls. Social media icon links should have aria-label="Follow us on Facebook" or equivalent. Hamburger menu buttons should have aria-label="Open navigation menu." Close buttons should have aria-label="Close dialog." Each fix takes seconds, and the impact on screen reader usability is immediate. For a comprehensive checklist, see our ADA compliance checklist.

Mistake 8: No Skip Navigation Link

A skip navigation link is a hidden link at the top of the page that becomes visible on keyboard focus and allows keyboard users to jump past the navigation menu directly to the main content. Without it, a keyboard user must Tab through every navigation link on every page load before reaching the content they came for. On a site with 15 navigation links, that is 15 Tab presses before the user can interact with the page content — an unnecessary barrier repeated on every single page visit.

The fix: add an anchor link as the first focusable element in the page body, styled to be visually hidden until it receives keyboard focus. The link text should be "Skip to main content" and the href should point to an ID on the main content container (href="#main-content"). The CSS pattern for a skip link that appears only on focus is widely documented and takes under 15 minutes to implement across an entire site.

Mistake 9: Inaccessible PDFs

Restaurants with menu PDFs, law firms with downloadable guides, and contractors with specification sheets frequently publish PDFs that are completely inaccessible. An image-based PDF (scanned from a physical document) contains zero readable text — screen readers see nothing. Even text-based PDFs often lack heading structure, reading order tags, alt text on images, and proper table markup, making them difficult or impossible to navigate with assistive technology.

The fix depends on the PDF type. Image-based PDFs need OCR (optical character recognition) processing to convert the images to selectable text, followed by tagging for accessibility structure. Text-based PDFs need heading tags, reading order specification, alt text, and table headers added through Adobe Acrobat's accessibility tools. The best long-term fix is to replace PDF content with HTML pages wherever possible — HTML is inherently more accessible, more crawlable by search engines, and easier to maintain. Revenue Group converts client PDF content to accessible HTML pages as part of accessibility remediations, eliminating the PDF accessibility problem entirely while improving SEO visibility for that content.

Mistake 10: Relying on Color Alone to Convey Information

Using color as the only means of conveying information — red text for errors, green for success, a colored dot to indicate status — excludes the approximately 8% of men and 0.5% of women who have color vision deficiency. WCAG 1.4.1 requires that color not be the sole indicator. Information conveyed through color must also be available through a text label, icon, pattern, or other non-color indicator.

The fix: pair every color-based indicator with a secondary signal. Error messages should include an icon and text label in addition to red coloring. Required form fields should use an asterisk and the word "required" in addition to any red highlighting. Status indicators should include text labels ("Active," "Pending," "Inactive") alongside colored dots. Charts and graphs should use patterns or textures in addition to color differentiation. These additions improve comprehension for all users, not just those with color vision deficiency — color alone is a weak signal even for users with full color vision.

Why These 10 Mistakes Account for 85% of All Failures

These mistakes are so common because they stem from how websites are built, not from deliberate exclusion. Most web developers are not trained in accessibility. Most website builders and CMS themes do not enforce accessibility requirements. Most design tools do not flag contrast violations or missing labels. The result is that accessibility failures are baked into the default development process — they happen when nobody actively prevents them, which is most of the time. Revenue Group builds accessibility into every project from the first wireframe because retrofitting is always more expensive than building correctly from the start. If you are looking for overlay shortcuts, read our analysis of why accessibility overlays do not work before investing in one.