How to Fix the 10 Most Common WCAG Violations on WordPress

ComplyZen Team · · Last updated April 17, 2026 · 6 min read
How to Fix the 10 Most Common WCAG Violations on WordPress

Why WordPress Sites Are Frequent Targets

WordPress powers over 40% of the web, which makes it the most common platform in accessibility lawsuits by sheer volume. The good news: most WordPress accessibility issues come from themes and plugins, not the core software. And most can be fixed without touching code.

Here are the 10 violations we see most often on WordPress sites, with step-by-step instructions for fixing each one. Not sure what WCAG even means? Read our plain-English WCAG guide first.

1. Images Missing Alt Text

Why it matters: Screen readers announce images by their alt text. No alt text means the image is invisible or confusing to blind users. This violates WCAG 1.1.1 (Non-text Content).

How to fix in WordPress:

  1. Go to Media → Library in your WordPress admin
  2. Click on any image
  3. Fill in the "Alt Text" field in the right sidebar
  4. Write a short description of what the image shows (not "image of" - just describe it)
  5. Click Save

For images already embedded in posts, edit the post, click the image, and add alt text in the block settings panel on the right.

Pro tip: If you have hundreds of images without alt text, the Enable Media Replace plugin lets you bulk-edit media metadata.

2. Low Color Contrast

Why it matters: Text that doesn't contrast enough with its background is hard to read for users with low vision or color blindness. WCAG requires a 4.5:1 ratio for normal text.

How to fix in WordPress:

  1. Go to Appearance → Customize
  2. Find your theme's color settings (usually under "Colors" or "Typography")
  3. Adjust text and background colors to meet the 4.5:1 ratio
  4. Pay special attention to: link colors, footer text, navigation items, and button text

If your theme doesn't let you change specific colors, add a snippet to Appearance → Customize → Additional CSS.

3. Form Fields Without Labels

Why it matters: Screen readers use <label> elements to tell users what a form field is for. Without them, a blind user hears "edit text" with no context.

How to fix in WordPress:

  • Contact Form 7: Always use the [text* your-name] shortcode inside a <label> tag. The plugin docs show this, but many tutorials skip it.
  • WPForms / Gravity Forms: Labels are added by default. Make sure "Hide Label" isn't checked unless you have a very good reason.
  • WooCommerce checkout: WooCommerce forms have proper labels by default. If yours don't, a plugin or theme is overriding them - check your checkout template.

4. Missing Language Attribute

Why it matters: The lang attribute on the <html> tag tells screen readers which language to use for pronunciation. Without it, a French screen reader might try to read English text with French pronunciation rules.

How to fix in WordPress:

  1. Go to Settings → General
  2. Set "Site Language" to the correct language
  3. WordPress will automatically add the correct lang attribute

This is almost always already correct, but we see it broken on sites that were set up in one language and then switched.

5. Links With No Descriptive Text

Why it matters: "Click here" and "Read more" tell a screen reader user nothing about where the link goes. They often navigate by pulling up a list of all links on the page - a list of 15 "Read more" links is useless.

How to fix in WordPress:

  • Replace "Click here" with descriptive text: "Download our accessibility checklist" instead of "Click here to download"
  • For "Read more" links on blog archives, most themes let you customize the text. Add the post title: "Read more about WordPress accessibility"
  • For icon-only links (social media icons), add an aria-label attribute: aria-label="Follow us on Twitter"

6. Skipped Heading Levels

Why it matters: Screen reader users navigate pages by headings. Jumping from H1 to H4 - or using H3 everywhere because it looks right - breaks this navigation completely.

How to fix in WordPress:

  1. Your page title should be the only H1 (most themes handle this)
  2. In the block editor, use Heading blocks and set levels sequentially: H2 for main sections, H3 for subsections
  3. Never choose a heading level for its visual size - that's what CSS is for

7. Missing Document Title

Why it matters: The page <title> is the first thing a screen reader announces. "Untitled" or a generic site name doesn't tell users what page they're on.

How to fix in WordPress:

  • Install Yoast SEO or Rank Math if you haven't already
  • Set unique SEO titles for every page and post
  • Format: "Page Name - Site Name"

8. Missing Viewport Meta Tag (Zoom Disabled)

Why it matters: Some themes set maximum-scale=1 or user-scalable=no in the viewport meta tag, which prevents users from zooming in. People with low vision rely on zoom to read text.

How to fix in WordPress:

  1. Check your theme's header.php file (or use View Source in your browser)
  2. Look for <meta name="viewport">
  3. Remove maximum-scale=1 and user-scalable=no if present
  4. The correct value: content="width=device-width, initial-scale=1"

Why it matters: Keyboard users have to tab through every navigation link on every page load before reaching the main content. A "Skip to content" link lets them jump past the navigation.

How to fix in WordPress:

  • Many modern themes include this by default (check by pressing Tab on your homepage - if the first thing that appears is "Skip to content," you're good)
  • If your theme doesn't have it, add this as the first element inside <body>: <a href="#main-content" class="skip-link">Skip to content</a>
  • Style it to be visually hidden until focused

10. Inaccessible Sliders and Carousels

Why it matters: Auto-rotating carousels are a triple threat: they move too fast for slow readers, they can't be paused by keyboard users, and their controls often lack accessible labels.

How to fix in WordPress:

  • Best option: Remove the carousel. Studies consistently show they have abysmal click-through rates anyway.
  • If you must keep it: Switch to an accessible slider plugin like Accessible Slick. Ensure it has pause/play controls, keyboard navigation, and proper ARIA attributes.
  • Disable auto-rotation at minimum.

Find all the accessibility issues on your WordPress site

Run a free scan and get your compliance score in seconds.

Scan My WordPress Site

Start With the Critical Issues

You don't need to fix everything at once. Start with critical and serious violations - the ones that actually prevent users from accessing your content. Missing alt text, broken form labels, and keyboard traps are the issues that trigger lawsuits. Color contrast and heading structure are important but less likely to be the sole basis of a legal complaint.

Whatever you do, don't fall for the promise of one-click accessibility overlays - they don't work and courts have rejected them as a compliance strategy.

Run a scan to see exactly what needs fixing, then work through the list in order of severity. Most WordPress sites can get to a passing score in a weekend.

Comments

No comments yet. Be the first to share your thoughts.

Sign in to join the conversation.

Sign in