After scanning thousands of websites, we've identified the accessibility issues that appear most frequently. The good news? Most of these are straightforward to fix once you know what to look for.
1. Missing Alternative Text for Images
This is the number one issue we find. Images without alt text are invisible to screen reader users.
The fix: Add descriptive alt text to meaningful images. For decorative images, use an empty alt attribute (alt="") to tell screen readers to skip them.
<!-- Good -->
<img src="chart.png" alt="Bar chart showing 40% increase in sales Q3 2024">
<!-- Decorative image -->
<img src="decorative-swirl.png" alt="">2. Insufficient Color Contrast
Low contrast text is difficult to read for users with low vision or color blindness, and even in bright sunlight.
The fix: Ensure text has a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18px+ or 14px+ bold).
3. Missing Form Labels
Forms without proper labels leave screen reader users guessing what information to enter.
The fix: Associate every input with a label using the for attribute or by wrapping the input in a label element.
<label for="email">Email Address</label>
<input type="email" id="email" name="email">4. Keyboard Navigation Issues
Many users can't use a mouse and rely on keyboard navigation. If your site isn't keyboard accessible, they can't use it.
The fix: Ensure all interactive elements are focusable and have visible focus indicators. Test by pressing Tab through your entire site.
5. Missing Skip Links
Without skip links, keyboard users must tab through the entire navigation on every page.
The fix: Add a "Skip to main content" link at the very beginning of your page that jumps to the main content area.
<a href="#main-content" class="skip-link">Skip to main content</a>6. Improper Heading Structure
Screen reader users navigate by headings. Skipping levels or using headings for styling breaks this navigation.
The fix: Use headings in sequential order (h1, h2, h3) based on content hierarchy, not visual appearance. Use CSS for styling.
7. Auto-Playing Media
Videos or audio that play automatically can be disorienting and interfere with screen readers.
The fix: Never auto-play media with sound. If you must auto-play video, ensure it's muted and provide easy-to-reach pause controls.
8. Missing Link Text
Links that say "click here" or "read more" are meaningless out of context. Screen reader users often navigate by links alone.
The fix: Use descriptive link text that makes sense on its own.
<!-- Bad -->
<a href="/report">Click here</a>
<!-- Good -->
<a href="/report">Download the accessibility report</a>9. Missing Language Declaration
Without a language attribute, screen readers may mispronounce content.
The fix: Add the lang attribute to your HTML element.
<html lang="en">10. Inaccessible Custom Components
Custom dropdowns, modals, and tabs often lack proper ARIA attributes and keyboard support.
The fix: Use native HTML elements when possible. For custom components, implement proper ARIA roles, states, and keyboard interactions following the WAI-ARIA Authoring Practices.
Start Finding Issues Today
Run a free accessibility scan with SiteDNA to identify these issues and more on your website. Our reports prioritize issues by impact and provide specific guidance for fixing each one.