WCAG 2.1 Level AA Compliance Report
Project: DigComp 3.0 Explorer Date: December 2025 Standard: WCAG 2.1 Level AA
Executive Summary
The DigComp 3.0 Explorer web application has been developed to meet WCAG 2.1 Level AA conformance, the accessibility standard required by the European Accessibility Act (EAA), US Section 508, and UK accessibility regulations.
Compliance by Principle
1. Perceivable
| Criterion | Status | Implementation |
|---|---|---|
| 1.1.1 Non-text Content | Pass | All icons have aria-hidden="true" when decorative, or aria-label when functional |
| 1.3.1 Info and Relationships | Pass | Semantic HTML (<nav>, <main>, <header>, <footer>), proper heading hierarchy |
| 1.3.2 Meaningful Sequence | Pass | DOM order matches visual order |
| 1.4.1 Use of Color | Pass | Information not conveyed by color alone (badges include text labels) |
| 1.4.3 Contrast (Minimum) | Pass | Text meets 4.5:1 ratio using Tailwind CSS defaults |
| 1.4.4 Resize Text | Pass | Responsive typography scales to 200% without loss |
| 1.4.10 Reflow | Pass | Content reflows at 320px viewport width |
| 1.4.11 Non-text Contrast | Pass | UI components meet 3:1 contrast ratio |
2. Operable
| Criterion | Status | Implementation |
|---|---|---|
| 2.1.1 Keyboard | Pass | All functionality accessible via keyboard |
| 2.1.2 No Keyboard Trap | Pass | Focus can be moved away from all components |
| 2.4.1 Bypass Blocks | Pass | Skip navigation link: "Skip to main content" |
| 2.4.2 Page Titled | Pass | Each page has descriptive <title> |
| 2.4.3 Focus Order | Pass | Tab order follows logical reading sequence |
| 2.4.4 Link Purpose | Pass | Link text describes destination |
| 2.4.6 Headings and Labels | Pass | Descriptive headings throughout |
| 2.4.7 Focus Visible | Pass | focus-within:ring-2 on all interactive elements |
| 2.5.3 Label in Name | Pass | Visible labels match accessible names |
3. Understandable
| Criterion | Status | Implementation |
|---|---|---|
| 3.1.1 Language of Page | Pass | lang attribute set on <html> element |
| 3.1.2 Language of Parts | Pass | Language switches handled via i18n context |
| 3.2.1 On Focus | Pass | No unexpected context changes on focus |
| 3.2.2 On Input | Pass | No unexpected context changes on input |
| 3.3.1 Error Identification | Pass | Form errors clearly identified |
| 3.3.2 Labels or Instructions | Pass | All inputs have visible labels or aria-label |
4. Robust
| Criterion | Status | Implementation |
|---|---|---|
| 4.1.1 Parsing | Pass | Valid HTML, no duplicate IDs |
| 4.1.2 Name, Role, Value | Pass | Custom components use appropriate ARIA attributes |
| 4.1.3 Status Messages | Pass | aria-live="polite" for search results and filter counts |
Key Accessibility Features
Skip Navigation
<a href="#main-content" class="sr-only focus:not-sr-only ...">
Skip to main content
</a>
Allows keyboard users to bypass repetitive navigation.
Landmark Regions
<header role="banner">- Site header<main id="main-content" role="main">- Primary content<footer role="contentinfo">- Site footer<nav aria-label="...">- Labeled navigation regions
Live Regions for Dynamic Content
<div aria-live="polite" aria-atomic="true">
21 results found
</div>
Screen readers announce search results and filter changes.
Focus Management
- Visible focus indicators on all interactive elements
focus-within:ring-2on card components containing links- High-contrast focus styling meets WCAG requirements
Mobile Accessibility
- Touch targets minimum 44x44px
- Responsive layouts adapt to all viewport sizes
- Tabs stack vertically on mobile for readability
Testing Methodology
| Tool | Purpose |
|---|---|
| Keyboard navigation | Manual testing of all interactive elements |
| Screen reader (VoiceOver) | Verified announcements and navigation |
| Browser DevTools | Contrast ratio verification |
| Responsive testing | Mobile and tablet viewport testing |
Supported Languages
| Language | Status |
|---|---|
| German (de) | Fully translated |
| English (en) | Fully translated |
All accessibility strings (labels, announcements) are translated in both languages.
Recommendations for Ongoing Compliance
- Test new features with keyboard and screen reader before deployment
- Maintain color contrast when updating theme colors
- Add
aria-labelto any new icon-only buttons - Use
aria-livefor any new dynamic content updates - Run automated checks with axe-core or Lighthouse periodically
Certification
This report certifies that the DigComp 3.0 Explorer application meets WCAG 2.1 Level AA conformance requirements as of the date above.
Report generated as part of accessibility compliance review.