Web Accessibility: Meeting WCAG Without Redesigning Everything

6 min read

Improving website accessibility does not automatically mean replacing your website. Many businesses can remove significant barriers by fixing shared components, updating content, and improving how existing pages behave. The key is to separate targeted repairs from structural problems that genuinely require deeper web development work.

Why website accessibility rarely starts with a redesign

Accessibility is about whether people can perceive, understand, navigate, and interact with your website, including when they use assistive technology. A site can look polished and still prevent someone from submitting a form using a keyboard or understanding a product image with a screen reader.

Conversely, an established website may already have a workable foundation. Its biggest barriers might sit in a handful of reusable elements:

  • Navigation menus that cannot be operated without a mouse.
  • Form fields without programmatically associated labels.
  • Text with insufficient contrast against its background.
  • Buttons with unclear names, such as repeated “Click here” links.
  • Videos without accurate captions.
  • Dialog boxes that trap focus or fail to return it when closed.

Fixing a shared header, form component, or button style can improve many pages at once. That makes an accessibility audit a better first investment than assuming the entire site needs replacing.

Set a clear WCAG target before assigning work

The Web Content Accessibility Guidelines, or WCAG, provide testable criteria organized around four principles: perceivable, operable, understandable, and robust.

For many organizations, WCAG 2.2 Level AA is a practical technical target. It includes Level A and AA requirements covering issues such as keyboard access, contrast, focus visibility, error identification, and accessible authentication.

However, your applicable legal, contractual, or procurement requirements may reference a different version or standard. Confirm those obligations with qualified counsel rather than treating a technical checklist as legal advice.

Define what “done” means

Avoid vague project goals such as “make the site accessible.” Specify the standard, scope, testing approach, and acceptance criteria.

A useful scope identifies:

  • The target WCAG version and conformance level.
  • Pages, templates, and complete user journeys being assessed.
  • Third-party tools, embedded content, and downloadable documents.
  • Supported browser and assistive-technology testing combinations.
  • Who approves fixes and maintains them after launch.

A sampled audit helps identify patterns, but it does not prove that every page conforms. Likewise, resolving automated findings alone does not establish WCAG conformance.

Audit the journeys that matter most

Start where an accessibility barrier could stop someone from doing business with you. For a service company, that might be finding a service, reviewing its details, and requesting a consultation. For an online store, it includes product selection, cart updates, checkout, and payment confirmation.

Use three complementary assessment methods:

  1. Automated scanning: Identify detectable issues such as missing accessible names, some contrast failures, and invalid markup patterns.
  2. Manual technical testing: Check keyboard operation, focus order, zoom, reflow, error handling, and screen-reader output.
  3. Usability testing with people with disabilities: Observe whether real users can complete important tasks and understand the experience.

Automated tools are useful for coverage and repeatability. They cannot reliably judge whether alternative text communicates the right meaning or whether a complex workflow is understandable.

For an initial assessment, a representative sample might include 8 to 15 page types or states, depending on complexity. Include menus, validation errors, pop-ups, and confirmation screens, not just pages in their default state.

Prioritize website accessibility fixes by impact

An audit should become a development backlog, not a report that sits unread. For each issue, record the affected component, relevant WCAG criterion, user impact, reproduction steps, recommended fix, and verification method.

Use this practical priority model:

Priority Typical issue Recommended response
Critical blocker A keyboard user cannot complete checkout Fix or provide an accessible alternative urgently
High-impact shared issue Navigation lacks reliable keyboard support Repair the reusable component early
Repeated content issue Meaningful images lack useful text alternatives Update publishing rules and remediate affected content
Isolated barrier One older page has an unclear link label Schedule a targeted correction and retest

These are delivery priorities, not WCAG severity classifications. A lower-priority failure still needs resolution within the agreed scope.

Balance reach, task importance, and implementation effort. A shared form-label fix may help more users than repairing a rarely visited page, but page traffic alone should not determine whether someone receives access.

Make targeted improvements to the existing site

Repair structure before changing appearance

Use native HTML elements wherever possible. A real button already provides behavior that a clickable generic container would need developers to recreate.

Check heading hierarchy, page landmarks, link names, and form labels. Use ARIA when needed to communicate roles, states, or relationships, but do not assume adding ARIA makes a component accessible. Incorrect ARIA can make the experience worse.

These changes often preserve the current visual design while improving navigation and interpretation.

Improve contrast and visible focus

WCAG AA generally requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text, with defined exceptions. Relevant non-text interface elements also have contrast requirements.

You may be able to retain the brand palette by introducing darker text variants, adjusting backgrounds, or changing button treatments. Keyboard focus must be visible and meet the applicable requirements, including not being entirely hidden by author-created content.

The trade-off is usually a controlled design adjustment, not a new brand identity.

Make forms easier to complete

Give every field an accessible label. Explain required formats before submission, identify errors in text, and help users locate and correct mistakes without losing valid entries.

Do not rely on red borders alone to communicate failure. Test autocomplete, password-manager support, and authentication steps against applicable criteria.

A form is not accessible merely because someone can tab through it. Instructions, validation, and success messages must also work.

Check mobile layouts and dynamic behavior

Test text resizing and narrow layouts, not just familiar device sizes. Content should reflow appropriately without forcing two-dimensional scrolling, subject to WCAG exceptions.

Review sticky banners, cookie dialogs, accordions, and chat widgets. They can obscure focused controls, disrupt reading order, or create keyboard traps.

Third-party components deserve particular attention because your team may not control their code. Ask vendors for current accessibility documentation, known limitations, and remediation commitments.

Know when deeper development is necessary

Targeted remediation works best when templates are consistent and the underlying platform allows semantic markup and predictable interaction.

More substantial work may be justified when:

  • A page builder repeatedly generates inaccessible controls.
  • The same functionality exists in several inconsistent implementations.
  • Navigation depends on interactions that cannot be repaired reliably.
  • A critical third-party checkout has no workable accessible path.
  • Basic accessibility fixes require fragile overrides across the site.

Ask your development partner to compare repairing the current component, replacing that component, and rebuilding the affected workflow. Each option should explain coverage, dependencies, maintenance risk, and testing effort.

A full redesign may still be appropriate, but it should follow evidence. A new visual system does not automatically deliver better website accessibility.

Build accessibility into ongoing delivery

For a modest marketing website, consider a phased plan: one assessment phase, one or more focused remediation sprints, and a separate verification phase. Complex applications, multilingual content, documents, and vendor dependencies can extend that schedule considerably.

Before approving work, ask:

  1. Which critical journeys will be tested end to end?
  2. Which fixes belong in shared components rather than individual pages?
  3. How will manual testing complement automated checks?
  4. Who will verify the fixes independently of implementation?
  5. How will editors avoid reintroducing the same problems?

Add accessibility checks to design reviews, development acceptance criteria, and publishing workflows. Retest changed components and their dependent journeys before release.

An accessibility statement can explain your approach, known limitations, and contact options. It supports transparency, but it does not replace remediation.

Where to start

Book a free growth audit or discovery call with HA Technologies to discuss your website’s barriers, business priorities, and web development options. Based at 295 Madison Avenue in New York, with a Dubai office, HA Technologies brings 16 years of delivery experience, 1,500+ clients, and 100+ in-house specialists. Web development is one of our nine services, and the conversation can help define whether your next step is a focused accessibility assessment, component remediation, or deeper platform work. Start with the journeys people need most, then build a measurable plan around removing the barriers.