---
title: "How to Check Website Accessibility (WCAG)"
description: "How to conduct a website accessibility audit according to WCAG 2.2. A practical guide to automated accessibility checking in your browser."
date: 2026-01-13
category: UPER
tags: ["Accessibility", "WCAG", "A11y", "Audit", "UPER SEO Auditor"]
url: https://uper.pl/en/blog/check-website-accessibility-wcag/
---

# How to Check Website Accessibility (WCAG)

Website accessibility (a11y) is not only a legal requirement in many countries but, above all, a best practice that expands your audience. In this article, I'll show you how to quickly check your website's compliance with WCAG guidelines.

## What Is WCAG?

**WCAG** (Web Content Accessibility Guidelines) is an international set of guidelines for web content accessibility. The current version is WCAG 2.2, which defines three conformance levels:

| Level | Description |
|-------|-------------|
| **A** | Minimum - basic requirements |
| **AA** | Standard - required by most regulations |
| **AAA** | Advanced - highest level of accessibility |

Most regulations (e.g., European Accessibility Act) require **AA** level.

## Why Is Accessibility Important?

### Legal Aspect

- **EU**: European Accessibility Act (EAA) from 2025
- **US**: ADA, Section 508
- **UK**: Equality Act 2010

### Business Aspect

- **15%** of the population has some form of disability
- Accessible websites have better SEO (alt texts, structure)
- Improved UX for all users

### Technical Aspect

- Better HTML code
- Proper semantics
- Better keyboard navigation

## Traditional Audit Methods

### Manual Audit

Requires a WCAG expert who checks the site point by point. Time-consuming and expensive.

### Lighthouse Accessibility

Built into Chrome DevTools, but:
- Requires running an audit
- Doesn't show error context
- Limited checklist

### axe DevTools

Popular extension, but:
- Separate tool from SEO audit
- Requires separate launch

## UPER SEO Auditor - Accessibility Audit

The [UPER SEO Auditor](https://chromewebstore.google.com/detail/uper-seo-auditor/khhpbeckpphaoiemjdijhbfpjnendage) extension includes a built-in accessibility audit based on WCAG 2.2 Level A and AA.

### What Categories Are Checked?

1. **Images** - alt text, decorative images
2. **Headings** - hierarchy, skipped levels
3. **Links** - link text, ambiguous links
4. **Forms** - labels, instructions
5. **Language** - lang attribute on html
6. **ARIA** - proper use of attributes
7. **Keyboard** - tabindex, focus
8. **Contrast** - text contrast ratio
9. **Zoom** - text in relative units

![Accessibility Audit in UPER SEO Auditor](../../assets/images/blog/uper-seo-auditor-a11y.png)

### How to Run the Audit?

1. Open the page in your browser
2. Launch the UPER SEO Auditor panel
3. Go to the **A11y** (or Accessibility) tab
4. Results appear automatically

## Check Categories

### Images (WCAG 1.1.1)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Missing alt | Image without alt attribute | Critical |
| Empty alt on linked image | Linked image without description | Serious |
| Alt = filename | Alt contains filename | Moderate |
| Long alt | Alt > 125 characters | Minor |

**How to fix:**

```html
<!-- ❌ Wrong -->
<img src="hero.jpg">
<img src="logo.png" alt="logo.png">

<!-- ✅ Correct -->
<img src="hero.jpg" alt="Team working in office">
<img src="logo.png" alt="Example Company Logo">

<!-- Decorative images -->
<img src="decoration.svg" alt="" role="presentation">
```

### Headings (WCAG 1.3.1)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Missing H1 | Page without H1 heading | Serious |
| Multiple H1 | More than one H1 | Moderate |
| Skipped level | H2 → H4 (missing H3) | Moderate |
| Empty heading | Heading without text | Serious |

**Proper hierarchy:**

```html
<h1>Page Title</h1>
  <h2>Main Section</h2>
    <h3>Subsection</h3>
    <h3>Subsection</h3>
  <h2>Next Section</h2>
    <h3>Subsection</h3>
```

### Links (WCAG 2.4.4)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Ambiguous text | "Click here", "More" | Moderate |
| Empty link | Link without text | Critical |
| Icon only | Link with only icon, no aria-label | Serious |

**Ambiguous texts to avoid:**

- "Click here"
- "Read more"
- "More"
- "Here"
- "Link"

**How to fix:**

```html
<!-- ❌ Wrong -->
<a href="/offer">Click here</a>
<a href="/blog"><i class="icon-arrow"></i></a>

<!-- ✅ Correct -->
<a href="/offer">View our offer</a>
<a href="/blog" aria-label="Go to blog">
  <i class="icon-arrow"></i>
</a>
```

### Forms (WCAG 3.3.2)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Missing label | Input without associated label | Critical |
| Missing id | Input without id (can't associate label) | Serious |
| Placeholder as label | Only placeholder, no label | Moderate |

**Proper forms:**

```html
<!-- Method 1: label with for -->
<label for="email">Email</label>
<input type="email" id="email" name="email">

<!-- Method 2: wrapping label -->
<label>
  Email
  <input type="email" name="email">
</label>

<!-- Method 3: aria-label -->
<input type="search" aria-label="Search the site">
```

### Page Language (WCAG 3.1.1)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Missing lang attribute | `<html>` without lang | Serious |
| Invalid code | lang="english" instead of "en" | Serious |

**Proper declaration:**

```html
<!DOCTYPE html>
<html lang="en">
<!-- for multilingual content -->
<p lang="es">Este párrafo está en español.</p>
```

### ARIA (WCAG 4.1.2)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Invalid role | role="none" on interactive element | Serious |
| Missing aria-label | Element with role but no name | Moderate |
| aria-hidden on focusable | Hidden element accessible by keyboard | Critical |

### Keyboard (WCAG 2.1.1)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Negative tabindex | tabindex < 0 on interactive element | Serious |
| High tabindex | tabindex > 0 (disrupts natural flow) | Moderate |
| onclick on div | Clickable elements without keyboard support | Serious |

### Color Contrast (WCAG 1.4.3)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| Low text contrast | Ratio < 4.5:1 for small text | Serious |
| Low large text contrast | Ratio < 3:1 for text ≥18px | Moderate |

**Required ratios:**

- Small text (< 18px): **4.5:1**
- Large text (≥ 18px bold or ≥ 24px): **3:1**

### Text Resizing (WCAG 1.4.4)

Checked elements:

| Check | Description | Impact |
|-------|-------------|--------|
| font-size in px | Text in absolute units | Moderate |
| !important on font-size | Blocks user resizing | Moderate |

**Proper units:**

```css
/* ❌ Wrong */
body { font-size: 16px; }
h1 { font-size: 32px !important; }

/* ✅ Correct */
body { font-size: 1rem; }
h1 { font-size: 2rem; }
```

## Audit Results

### Accessibility Score

The extension calculates an accessibility score (0-100) based on:

- **Critical** - 25 points per issue
- **Serious** - 15 points
- **Moderate** - 5 points
- **Minor** - 1 point

### Filtering Results

You can filter issues by:

- **Category** - images, links, forms
- **Impact** - critical, serious, moderate, minor
- **WCAG criterion** - 1.1.1, 2.4.4, etc.

## Report Export

Audit results are included in PDF export:

- Accessibility section in the report
- List of issues with descriptions
- WCAG references
- Fix recommendations

## What Automated Audit WON'T Check?

Automated tools detect about 30-40% of accessibility issues. Manual checking is needed for:

- **Alt text relevance** - do they describe the image content?
- **Navigation logic** - is focus intuitive?
- **Audio/video content** - are there captions/transcripts?
- **Understandability** - is the language simple?
- **Consistency** - is navigation consistent?

## Summary

Accessibility audit in UPER SEO Auditor is a quick way to:

- **Detect common issues** - WCAG 2.2 Level A/AA
- **Categorize problems** by impact
- **Understand context** - what to fix and where
- **Export results** to PDF report

It's a good starting point before a detailed expert audit. To understand how accessibility fits into the bigger picture of technical SEO and Google rankings, see our [guide to web technologies and SEO in 2026](/en/blog/web-technologies-seo-google-rankings/).

Try [UPER SEO Auditor](https://chromewebstore.google.com/detail/uper-seo-auditor/khhpbeckpphaoiemjdijhbfpjnendage) and check your website's accessibility.

## Sources

1. **WCAG 2.2 - W3C**
[https://www.w3.org/TR/WCAG22/](https://www.w3.org/TR/WCAG22/)

2. **Understanding WCAG 2.2**
[https://www.w3.org/WAI/WCAG22/Understanding/](https://www.w3.org/WAI/WCAG22/Understanding/)

3. **European Accessibility Act**
[https://ec.europa.eu/social/main.jsp?catId=1202](https://ec.europa.eu/social/main.jsp?catId=1202)

4. **Web Accessibility Initiative (WAI)**
[https://www.w3.org/WAI/](https://www.w3.org/WAI/)