Skip to main content

Need a website fast? Get a custom site live in just 7 days!

Let's Go!
Brambla
Web Accessibility: The Complete 2026 Guide for UK Business Websites
GuideWeb Design19 min read

Web Accessibility: The Complete 2026 Guide for UK Business Websites

The complete 2026 guide to web accessibility for UK business websites — covering legal requirements, WCAG 2.2, common failures and fixes, testing tools, accessible design principles, and professional audit guidance.

Key Takeaways

  • Over 16 million people in the UK have a disability, roughly 24% of the population. An inaccessible website doesn't just fail a compliance check; it locks out nearly a quarter of your potential customers. (Family Resources Survey, DWP 2023/24)
  • The European Accessibility Act (EAA) took effect in June 2025, extending accessibility requirements to a wide range of digital products and services. While the UK is no longer in the EU, UK businesses selling to EU customers or operating EU-facing websites need to comply — and domestic legislation is expected to follow. (European Commission)
  • 71% of users with disabilities will leave a website that isn't accessible and won't come back. Accessibility failures don't just affect disabled users; they frustrate everyone. Slow-loading pages, confusing navigation, and poor mobile design are accessibility issues that affect all users. (Click-Away Pound Survey)
  • Accessibility improvements often improve SEO and conversion rates — because the same principles that make a website accessible (clear structure, fast loading, readable text, descriptive links) also make it easier for search engines to understand and for all users to navigate.

What Web Accessibility Means (And Why It Matters Commercially)

Web accessibility means designing and building websites that everyone can use, regardless of their abilities or the technology they use to access the web. This includes people who:

  • Have visual impairments — from colour blindness to complete blindness, using screen readers like JAWS, NVDA, or VoiceOver
  • Have hearing impairments — relying on captions, transcripts, and visual indicators instead of audio
  • Have motor impairments — navigating by keyboard, voice control, switch devices, or eye tracking instead of a mouse
  • Have cognitive impairments — benefiting from clear language, consistent navigation, and distraction-free design
  • Use assistive technology — screen readers, magnifiers, alternative input devices, and browser extensions
  • Have temporary or situational limitations — a broken arm, bright sunlight on a screen, slow internet, or holding a baby

Accessibility isn't just about permanent disability. A user on a slow mobile connection in rural Devon, a manager trying to read your website on a phone while walking between meetings, and a warehouse worker wearing gloves who can't use a touchscreen precisely — all of these people benefit from accessible design.

The Commercial Case

Beyond the moral imperative, accessibility makes commercial sense:

  • The UK's disabled population has a combined spending power of over £274 billion — known as the "Purple Pound". (Purple Tuesday)
  • Accessible websites perform better in search — Google's crawlers experience your website similarly to screen readers. Semantic HTML, descriptive alt text, and clear heading structures improve both accessibility and SEO.
  • Accessible design reduces bounce rates — when all users can navigate and interact with your site effectively, they stay longer and convert more often.
  • It reduces legal risk — while UK enforcement has been limited, the trend globally is toward stricter accessibility requirements.

Understanding the legal landscape helps you assess your obligations and prioritise your accessibility investment.

The Equality Act 2010

The UK's primary disability discrimination law requires service providers (including websites) to make "reasonable adjustments" to ensure disabled people can access their services. While the Act doesn't specifically mention websites, legal guidance and case law increasingly interpret digital services as within scope.

For UK businesses, this means your website should be accessible to a reasonable standard. "Reasonable" is generally interpreted as WCAG 2.1 Level AA compliance — the same standard required for UK public sector websites under the Public Sector Bodies Accessibility Regulations 2018.

The European Accessibility Act (EAA)

The EAA, which took effect on 28 June 2025, requires digital products and services sold in EU member states to meet accessibility standards. This affects UK businesses if you:

  • Sell products or services to EU customers online
  • Operate e-commerce websites accessible from EU countries
  • Provide digital services (banking, transport, e-commerce) to EU residents

The EAA references the European standard EN 301 549, which aligns closely with WCAG 2.1 Level AA.

For more on the EAA's specific implications, read The European Accessibility Act: What UK Businesses Need to Know.

What "Compliance" Actually Means

There's no accessibility police force inspecting every website. But there is increasing awareness, legal precedent, and — most importantly — customer expectation. The practical approach for UK small businesses is:

  1. Aim for WCAG 2.2 Level AA — this is the current best-practice standard
  2. Document your efforts — having an accessibility statement shows good faith
  3. Prioritise the most impactful fixes — not every issue carries equal weight
  4. Make continuous improvement — accessibility is a journey, not a destination

What Is WCAG 2.2 and What Does It Require?

The Web Content Accessibility Guidelines (WCAG) are the international standard for web accessibility, published by the W3C. Version 2.2, released in October 2023, is the current standard.

WCAG is built on four principles, known by the acronym POUR:

1. Perceivable

Users must be able to perceive the information on your website. This means:

  • Text alternatives for images — every meaningful image has descriptive alt text
  • Captions for video — audio content has text alternatives
  • Adaptable content — information isn't conveyed by colour, shape, or position alone
  • Sufficient contrast — text is readable against its background

2. Operable

Users must be able to operate your website's interface. This means:

  • Keyboard accessible — everything works without a mouse
  • Enough time — users can pause, stop, or extend time limits
  • No seizure triggers — nothing flashes more than three times per second
  • Navigable — users can find content and know where they are
  • Input modalities — content can be operated through various inputs beyond keyboard

3. Understandable

Users must be able to understand your content and interface. This means:

  • Readable text — language is identified, unusual words are defined
  • Predictable behaviour — navigation is consistent, context doesn't change unexpectedly
  • Error prevention — forms help users avoid and correct mistakes

4. Robust

Content must work with current and future technologies. This means:

  • Valid HTML — proper semantic markup
  • Name, role, value — custom components communicate their purpose to assistive technology
  • Status messages — important updates are announced to screen readers

The Three Conformance Levels

| Level | Standard | What It Means | |-------|----------|--------------| | A | Minimum | Removes the most serious barriers. Your site is basically functional. | | AA | Recommended | The accepted standard for most websites. Addresses the majority of barriers for most users. | | AAA | Highest | Maximum accessibility. Not always achievable for all content types but worth pursuing where possible. |

Target Level AA. It's the legal benchmark, the industry standard, and the level that makes the biggest practical difference for the most users.


What Are the Most Common Accessibility Failures (And How to Fix Them)?

The WebAIM Million study analyses the top one million websites annually for accessibility. In 2024, 95.9% of homepages had detectable WCAG failures. The same issues appear year after year.

We audited twelve client sites last year. Every single one had contrast failures. Three had no keyboard navigation on their main menu. These are not edge cases.

1. Low Colour Contrast (81% of homepages)

The problem: Text colour doesn't contrast enough with the background, making it hard to read for users with low vision or in bright conditions.

The fix: Ensure all text meets WCAG minimum contrast ratios:

  • Normal text: 4.5:1 contrast ratio
  • Large text (18pt+ or 14pt+ bold): 3:1 contrast ratio

Use a tool like WebAIM's Contrast Checker to test your colour combinations. Pay special attention to light grey text on white backgrounds — the most common offender.

2. Missing Alt Text (54% of homepages)

The problem: Images lack alternative text, so screen reader users have no idea what the image shows or why it's there.

The fix: Add descriptive `alt` attributes to all meaningful images:

  • Informative images: Describe what the image shows ("Team meeting in Brambla's Devon studio")
  • Functional images (links/buttons): Describe the action ("Go to homepage")
  • Decorative images: Use an empty alt attribute (`alt=""`) so screen readers skip them

3. Missing Form Labels (48% of homepages)

The problem: Form inputs (name, email, phone fields) don't have associated text labels, so screen reader users don't know what information to enter.

The fix: Every form input needs a `<label>` element with a `for` attribute matching the input's `id`. Placeholder text is NOT a substitute for labels — it disappears when users start typing and isn't reliably announced by screen readers.

The problem: Links or buttons have no accessible text. Common with icon-only buttons (hamburger menus, social media icons, close buttons).

The fix: Add text content to every interactive element. If the button only contains an icon, add `aria-label="Menu"` or visually hidden text that screen readers can announce.

5. Missing Document Language (18% of homepages)

The problem: The page doesn't declare its language, so screen readers don't know which pronunciation rules to use.

The fix: Add `lang="en"` (or appropriate language code) to your `<html>` element. This is a one-line fix that takes 10 seconds.

6. Empty Heading Tags (heading hierarchy issues)

The problem: Headings are skipped (H1 → H3 with no H2), used decoratively rather than structurally, or left empty.

The fix: Use headings in logical order (H1 → H2 → H3). Don't skip levels. Only use heading tags for actual headings, not for styling. Every page should have exactly one H1.


How to Test Your Website's Accessibility

You don't need to be an expert to start testing. Here are free tools that catch the most common issues.

Automated Testing Tools

Automated tools catch approximately 30-40% of accessibility issues — the easy, detectable ones. They're a great starting point.

| Tool | Type | What It Tests | |------|------|---------------| | WAVE | Browser extension / URL checker | Contrast, alt text, labels, headings, ARIA | | axe DevTools | Browser extension | Comprehensive WCAG testing in DevTools | | Lighthouse | Built into Chrome | Accessibility audit as part of performance audit | | Pa11y | Command line | Automated testing for CI/CD pipelines |

Manual Testing (Essential)

Automated tools can't test everything. These manual checks catch the issues that matter most:

  1. Keyboard navigation — Unplug your mouse and try to use your entire website with just the keyboard. Can you reach every link, button, and form field? Can you see where the focus is? Can you operate dropdown menus?
  2. Screen reader testing — Try VoiceOver (Mac, built-in), NVDA (Windows, free), or the screen reader in your phone's accessibility settings. Navigate your homepage. Does the content make sense when read aloud? Are images described? Are form fields labelled?
  3. Zoom to 200% — Does your layout break? Is all content still visible and readable? This tests whether your design accommodates users who enlarge text.
  4. Colour-only information — Is any information conveyed only by colour? (e.g., red text for errors without any icon or text label). If so, users who can't distinguish colours will miss it.

When to Bring in Professionals

An automated scan plus basic manual testing covers the fundamentals. For a thorough assessment, consider a professional accessibility audit, which typically includes:

  • Full WCAG 2.2 conformance testing
  • Assistive technology testing (multiple screen readers and input devices)
  • User testing with people who have disabilities
  • Prioritised remediation plan
  • Accessibility statement drafting

This is where a website audit adds real value — combining accessibility testing with SEO, performance, and usability analysis.


What Are the Key Accessible Design Principles?

Building accessibility in from the start is far cheaper and more effective than retrofitting it. These principles apply whether you're designing a new website or improving an existing one.

Colour and Contrast

  • Meet minimum contrast ratios (4.5:1 for body text, 3:1 for large text)
  • Never rely on colour alone to convey information — always pair with text, icons, or patterns
  • Test your colour palette with a colour blindness simulator (try Coblis)
  • Ensure interactive elements (links, buttons, form fields) have visible focus indicators

Typography and Readability

  • Use a minimum body text size of 16px (browsers default to this for a reason)
  • Set line height to at least 1.5× the font size for body text
  • Keep line length between 50-75 characters for optimal readability
  • Ensure text can be resized to 200% without loss of content or function
  • Use left-aligned text (centred body text is harder to read for everyone, especially users with dyslexia)
  • Provide a clear, consistent navigation structure across all pages
  • Include a "skip to main content" link at the top of every page
  • Use breadcrumbs to show users where they are in your site hierarchy
  • Ensure the current page is visually indicated in navigation
  • Provide a search function for sites with more than 20 pages

Layout and Spacing

  • Use generous white space — cramped layouts are harder for everyone
  • Ensure touch targets are at least 44×44 pixels for mobile users
  • Don't make content available only on hover — hover states are inaccessible to touch and keyboard users
  • Ensure your layout works in both portrait and landscape orientations

For broader design considerations, see Web Design Trends 2026: What Actually Matters for Small Businesses.


Images, Alt Text, and Media Accessibility

Images and media are where many websites fail accessibility requirements. Here's how to handle them properly.

Writing Good Alt Text

Alt text should convey the purpose of the image, not just describe it literally.

| Image Type | Bad Alt Text | Good Alt Text | |-----------|-------------|--------------| | Team photo | "Photo" | "Brambla team working in the Devon studio" | | Product shot | "Image1.jpg" | "Oak dining table, seats six, natural finish" | | Infographic | "Infographic" | "Chart showing website costs: template £500-£1,500, custom £2,500-£8,000" | | Logo | "Logo" | "Brambla - Creative Digital Agency" | | Decorative divider | (should be `alt=""`) | (empty alt — screen readers ignore it) |

Video Accessibility

  • Provide captions for all video content (auto-generated captions are a start but need editing for accuracy)
  • Provide transcripts for audio-only content (podcasts, audio messages)
  • Avoid autoplay — let users choose when to play media
  • Provide audio descriptions for video content where important visual information isn't described in the dialogue

SVGs and Icons

  • Inline SVGs need `role="img"` and an `aria-label` or `<title>` element
  • Icon fonts (like Font Awesome) need `aria-label` or `aria-hidden="true"` if decorative
  • Ensure icon-only buttons always have accessible text alternatives

Forms and Interactive Elements

Forms are where accessibility failures have the most direct business impact — if users can't complete your contact form or checkout process, you lose revenue.

Form Accessibility Checklist

  • Every input has a visible `<label>` (not just placeholder text)
  • Required fields are indicated by more than just colour (add "required" text or an asterisk with explanation)
  • Error messages are specific ("Please enter a valid email address" not "Invalid input")
  • Error messages are associated with their input using `aria-describedby`
  • Users can review and confirm before final submission (especially for financial transactions)
  • Form validation doesn't rely solely on colour (a red border isn't enough — add an icon and text)

Keyboard-Accessible Interactive Components

Custom components (dropdowns, modals, tabs, carousels) need careful attention:

  • Focus management — when a modal opens, focus moves to the modal. When it closes, focus returns to the trigger.
  • Keyboard operation — dropdowns respond to arrow keys, modals close with Escape, tabs switch with arrow keys.
  • ARIA roles and properties — custom components need appropriate ARIA attributes so assistive technology understands their purpose and state.

Mobile Accessibility

Mobile accessibility is increasingly important as mobile traffic exceeds desktop for most UK small business websites.

Key Mobile Accessibility Considerations

  • Touch targets — buttons and links need at least 44×44 pixels of tappable area, with adequate spacing between them. This is a WCAG 2.2 requirement (Success Criterion 2.5.8).
  • Orientation — don't lock your site to portrait or landscape. Users with devices mounted to wheelchairs may only be able to use one orientation.
  • Pinch-to-zoom — never disable it. Users who need to enlarge content rely on this. Remove any `maximum-scale=1` or `user-scalable=no` from your viewport meta tag.
  • Reflow — at 400% zoom, content should reflow into a single column without horizontal scrolling. This is how many users with low vision browse on mobile.
  • Motion — respect the `prefers-reduced-motion` setting. Users who experience motion sickness or vestibular disorders should be able to use your site without triggering symptoms.

Testing Mobile Accessibility

  • Use your phone's built-in screen reader (VoiceOver on iOS, TalkBack on Android) to navigate your website
  • Try using your phone with voice control enabled
  • Test with the largest text size setting your phone offers
  • Check that nothing breaks when you rotate your device

Getting Professional Help

If your website has significant accessibility issues or you're building a new site, professional support ensures you meet standards without guesswork.

What an Accessibility Audit Includes

A professional accessibility audit typically covers:

  • Automated scanning of all key pages
  • Manual testing with screen readers and keyboard navigation
  • WCAG 2.2 conformance assessment against Level AA criteria
  • Prioritised remediation plan (critical → high → medium → low)
  • Accessibility statement drafting or review
  • Developer guidance for fixing identified issues

What an Accessible Website Build Includes

When commissioning a custom website with accessibility in mind, look for:

  • Semantic HTML structure (proper heading hierarchy, landmarks, form labels)
  • WCAG 2.2 Level AA colour contrast compliance
  • Keyboard navigation testing on all interactive components
  • Screen reader testing during development (not just at the end)
  • An accessibility statement page
  • Alt text guidance for content the client will manage

Writing an Accessibility Statement

An accessibility statement is a page on your website that:

  1. States your commitment to accessibility
  2. Names the standard you're targeting (e.g., WCAG 2.2 Level AA)
  3. Lists any known limitations and what you're doing about them
  4. Provides a contact method for users who encounter barriers
  5. Explains your process for maintaining accessibility

This demonstrates good faith and gives users a way to report issues — which is valuable feedback for continuous improvement.

Interested in a sustainability-first approach to web design? Read Sustainable Web Design: How to Reduce Your Website's Carbon Footprint — many sustainability and accessibility principles overlap.


Frequently Asked Questions

Is my website legally required to be accessible in the UK?

The Equality Act 2010 requires service providers to make reasonable adjustments for disabled users, which is increasingly interpreted to include websites. There's no specific "website accessibility law" in the UK yet, but the direction of travel is clearly toward stronger requirements. The European Accessibility Act took effect in June 2025 and affects UK businesses selling to EU customers. In the US, ADA lawsuits against inaccessible websites have increased every year since 2018, and similar legal pressure is building in the UK. Several UK companies have faced complaints through the Equality and Human Rights Commission for inaccessible digital services. The practical answer: treat WCAG 2.2 Level AA as your baseline, document your efforts with an accessibility statement, and prioritise the fixes that affect the most users. Even without a strict legal mandate, accessible websites perform better in search, convert more visitors, and reach a wider audience.

How much does it cost to make a website accessible?

For an existing website, an accessibility audit and remediation typically costs £500-£3,000 depending on the site's size and complexity. For a new build, building accessibility in from the start adds roughly 10-15% to the project cost — far less than retrofitting later. The highest cost is usually fixing custom interactive components (carousels, mega menus, custom form controls).

Does accessibility hurt my website's design?

No. Accessibility constraints (contrast ratios, text sizing, clear navigation) actually improve design by enforcing clarity and usability.

What's the difference between WCAG 2.1 and 2.2?

WCAG 2.2, released in October 2023, builds on 2.1 by adding nine new success criteria. The most significant additions are requirements for consistent help mechanisms, minimum touch target sizes (44×44px), and better support for cognitive accessibility. If you're already meeting 2.1 Level AA, the step to 2.2 is manageable. If you're starting from scratch, target 2.2 directly.

Can I use overlays or widgets to make my site accessible?

Accessibility overlay tools (like AccessiBe, UserWay, or AudioEye) claim to fix accessibility automatically with a single line of code. We do not recommend them. The National Federation of the Blind, WebAIM, and major accessibility organisations have issued statements against overlays. They don't fix underlying code issues, they can actually interfere with screen readers, and they create a false sense of compliance. There are no shortcuts to genuine accessibility.

How do I maintain accessibility over time?

Accessibility isn't a one-time fix. Content updates (new images without alt text, new forms without labels) can introduce issues. Build accessibility into your content workflow: train anyone who updates your website to add alt text, use proper heading structure, and test new content with keyboard navigation. Schedule a quarterly automated scan to catch regression, and consider an annual professional audit.


*Want to know how accessible your website is? Request a free mini audit or talk to us about building an accessible website that works for every user.*

Tags

AccessibilityWCAGWeb DesignEAAInclusive DesignUK Law
SB

Sam Butcher

Founder, Brambla

Sam is the founder of Brambla (SDB Digital Ltd), a creative digital agency based in Devon. With experience across web design, branding and digital marketing, he works directly with SMEs across Devon, Cornwall, Kent and London to build websites that drive real business results.

READY TO GROW YOUR BUSINESS?

Whether you need a new website, SEO, or a full digital marketing strategy — we're here to help.

START A PROJECT