Full audit — WCAG 2.1 & 2.2 AA · EN 301 549
Web Accessibility Audit Report
This report records every accessibility barrier found on the site named below, what each one does to a real customer, and exactly how to fix it. It is written to be handed straight to a developer.
Audited website
shop.demostore-example.com
Site owner
Demo Store S.L. (sample)
Audit window
24–27 June 2026
Report issued
27 June 2026
Auditor
EAA Comply · eaacompliance.com
Scope
15 pages tested by hand across 6 templates (home, category, product, cart, checkout, account); 41 pages crawled with axe-core
Tested on
Desktop 1280 px and mobile 390 px · NVDA and VoiceOver · keyboard only · 200% zoom
Executive summary
shop.demostore-example.com does not currently meet Level AA. We found 37 distinct issues across the six templates in scope. Six of them are critical, which in this report means a customer using a keyboard or a screen reader cannot get past them without help.
Three of those six sit directly on the path to a sale. The cookie banner cannot be dismissed with a keyboard, so a keyboard-only visitor never reaches the shop at all. The cart and quantity controls are announced only as “button”, so a screen-reader user cannot tell “remove item” from “add one more”. And when checkout rejects an address, nothing is announced — the form simply appears not to respond.
None of this needs a redesign. The whole fix list is roughly 11–15 hours of developer time, and most of it is markup: labels, accessible names, focus handling and four colour values. The visual design does not change.
Fixing these 37 issues brings the audited scope to Level AA on the retest date. It does not make the site permanently conformant: accessibility breaks again with the next theme update or the next batch of product photos. That is what the monthly re-check is for.
Result summary
Not AA
Conformance level reached
61/100
Accessibility score
The score is EAA Comply’s own weighted composite of severity, frequency and where in the buying journey each issue sits. It exists to track progress between audits. It is not a standard measure — WCAG has no score, only pass or fail per criterion.
Issues by severity
| Severity | Count | What it means here |
|---|
| Critical | 6 | Blocks a task outright for at least one group of users. A purchase cannot be completed. |
| Serious | 14 | The task can be completed, but only with difficulty, guesswork or outside help. |
| Moderate | 12 | Noticeably harder or more confusing; most users get through in the end. |
| Minor | 5 | Blocks nothing, but fails a criterion and should be cleaned up. |
Conformance by success criterion (extract)
| WCAG | Success criterion | Level | Result |
|---|
| 1.1.1 | Non-text content (alternative text) | A | Fail |
| 1.3.1 | Info and relationships | A | Fail |
| 1.3.5 | Identify input purpose | AA | Fail |
| 1.4.1 | Use of colour | A | Fail |
| 1.4.3 | Contrast (minimum) 4.5:1 | AA | Fail |
| 1.4.10 | Reflow at 320 px | AA | Pass |
| 1.4.11 | Non-text contrast (controls) | AA | Fail |
| 2.1.1 | Keyboard operability | A | Fail |
| 2.1.2 | No keyboard trap | A | Fail |
| 2.4.1 | Bypass blocks (skip link) | A | Fail |
| 2.4.7 | Focus visible | AA | Pass |
| 2.5.8 | Target size (minimum) | AA | Fail |
| 3.3.1 | Error identification | A | Fail |
| 3.3.2 | Labels or instructions | A | Fail |
| 4.1.2 | Name, role, value | A | Fail |
| 4.1.3 | Status messages | AA | Fail |
The delivered report covers all 56 Level A and AA criteria of WCAG 2.1 and 2.2, each with the evidence behind the verdict and criteria marked not applicable where the site has no such content. This is a representative extract.
The fix plan, in the order we would do it
| Order | Issue | Effort |
|---|
| 1 | Critical F-01 — The cookie banner cannot be dismissed with a keyboard | 2-3 h |
| 2 | Critical F-02 — Icon-only buttons have no accessible name | 1 h |
| 3 | Critical F-03 — Checkout fields use placeholders instead of labels | 2 h |
| 4 | Serious F-04 — Validation errors are shown but never announced | 2 h |
| 5 | Serious F-05 — Prices and footer links fall below the minimum contrast ratio | 1 h |
| 6 | Serious F-06 — Product images use file names as alternative text | 3 h |
| 7 | The remaining 31 issues (moderate and minor) | 5–7 h |
Ordered by customer impact divided by effort, not by severity alone. F-02 is one hour of work that unblocks twelve controls, so it goes ahead of slower items of the same severity.
Findings in detail
Six of the 37 findings are reproduced below in the format the full report uses. Every issue is documented this way, with the corrected code written for your stack on the Guided fixes tier.
The cookie banner cannot be dismissed with a keyboard
F-01 CriticalWCAG: 2.1.2 · 2.4.3Level: Aaxe-core rule: not detectable automaticallyInstances: 41Effort: 2-3 h
Where
All 41 pages — the consent banner shown on the first visit.
Who it affects
Anyone browsing without a mouse: keyboard-only users, screen-reader users, switch and voice-control users.
Why it fails
The banner is a <div> with tabindex="-1" and the Accept control is a <span> with a click handler, so it is neither focusable nor announced as a button. The overlay covers the page, but Tab keeps moving through the content behind it and never reaches Accept. A mouse user clicks once and moves on; a keyboard user cannot dismiss the banner and cannot reach the shop at all. This fails 2.1.2 No Keyboard Trap and, because focus order no longer follows the visible order, 2.4.3 Focus Order.
Found on the site
<div class="cc-bar" tabindex="-1">
<span class="cc-ok" onclick="acceptAll()">Accept</span>
</div>
How to fix it
<div class="cc-bar" role="dialog" aria-modal="true"
aria-labelledby="cc-title">
<h2 id="cc-title">Cookies</h2>
<button type="button" class="cc-ok">Accept</button>
<button type="button" class="cc-no">Reject non-essential</button>
</div>
Icon-only buttons have no accessible name
F-02 CriticalWCAG: 4.1.2 · 1.1.1Level: Aaxe-core rule: button-nameInstances: 12Effort: 1 h
Where
Header cart and search, the wishlist control on every product card, and the quantity steppers on the cart and product templates — 12 controls.
Who it affects
Screen-reader users, and voice-control users who have no name to speak.
Why it fails
Each button contains only an SVG icon, with no text and no label, so it is announced as “button” and nothing else. On the cart page four of them sit in a row: increase, decrease, save for later, remove. Guessing which is which means guessing whether the order is about to be emptied.
Found on the site
<button class="qty-up">
<svg viewBox="0 0 16 16">...</svg>
</button>
How to fix it
<button type="button" class="qty-up" aria-label="Increase quantity">
<svg viewBox="0 0 16 16" aria-hidden="true" focusable="false">...</svg>
</button>
Checkout fields use placeholders instead of labels
F-03 CriticalWCAG: 3.3.2 · 1.3.1 · 1.3.5Level: A / AAaxe-core rule: labelInstances: 9Effort: 2 h
Where
Checkout step 1 (delivery address) and step 2 (payment) — 9 fields.
Who it affects
Screen-reader users, users with cognitive disabilities, and anyone interrupted halfway through a long form.
Why it fails
The fields have a placeholder and no <label>. A placeholder is not a label: it disappears as soon as the field has content, so a user who looks away cannot see what the field was for, and it is announced inconsistently across screen readers. The placeholder grey (#9aa4b2 on white) is also only 2.52:1, well under the 4.5:1 minimum.
Found on the site
<input type="text" name="postcode" placeholder="Postcode">
How to fix it
<label for="ship-post">Postcode</label>
<input type="text" id="ship-post" name="postcode"
autocomplete="postal-code">
Validation errors are shown but never announced
F-04 SeriousWCAG: 3.3.1 · 4.1.3 · 1.4.1Level: A / AAaxe-core rule: not detectable automaticallyInstances: 6Effort: 2 h
Where
Checkout, the newsletter sign-up and the contact form — 6 forms.
Who it affects
Screen-reader users above all, and anyone who does not notice a colour change.
Why it fails
Error text is written into a <div class="err"> that has no role, and the field is marked only with a red border. A screen-reader user presses Submit, hears nothing, and has no way to know the form did not go through. Marking the field by colour alone also fails 1.4.1 Use of Colour.
Found on the site
<div class="err"></div>
<input type="email" id="mail" class="is-error">
How to fix it
<input type="email" id="mail" aria-invalid="true"
aria-describedby="mail-err">
<div id="mail-err" class="err" role="alert">
Email address: enter an address in the form name@example.com.
</div>
Prices and footer links fall below the minimum contrast ratio
F-05 SeriousWCAG: 1.4.3Level: AAaxe-core rule: color-contrastInstances: 23Effort: 1 h
Where
Product cards, the price block on product pages, the sale badge and the footer links — 23 elements.
Who it affects
Users with low vision, and every user reading a phone screen outdoors.
Why it fails
The sale price is #e05c5c on white, a ratio of 3.59:1, and the footer links are #8b95a5 on #f6f9fc, a ratio of 2.86:1. Level AA requires 4.5:1 for normal-size text. The sale price is precisely the number the customer came to read.
Found on the site
.price--sale { color: #e05c5c; } /* 3.59:1 on white */
.site-foot a { color: #8b95a5; } /* 2.86:1 on #f6f9fc */
How to fix it
.price--sale { color: #c0392b; } /* 5.44:1 on white */
.site-foot a { color: #5a6678; } /* 5.51:1 on #f6f9fc */
Product images use file names as alternative text
F-06 SeriousWCAG: 1.1.1Level: Aaxe-core rule: not detectable automaticallyInstances: 38Effort: 3 h
Where
38 product images across the category and product templates.
Who it affects
Screen-reader users, and anyone whose images fail to load.
Why it fails
The alt text is the file name: alt="product-img-04.jpg". This is the most instructive finding in the report, because axe-core records it as a pass — the rule checks that an alt attribute exists and is not empty, and it is. Only a human reading the output notices that the customer is being told nothing at all about the product they are considering buying.
Found on the site
<img src="/img/product-img-04.jpg" alt="product-img-04.jpg">
How to fix it
<img src="/img/product-img-04.jpg"
alt="Navy wool scarf, folded, showing the ribbed weave">
About the accessibility overlay installed on this shop
The shop has an overlay widget installed. We ran the full audit twice, once with the widget active and once with it disabled, and the 37 issues are identical in both runs — the widget did not fix any of them. It also added one: its own launcher button has no accessible name, and it is counted in F-02 above. This is not a criticism of the decision to install it; it is what the testing showed.
What automated testing found, and what it did not
axe-core found 14 of the 37 issues. The other 23 came from testing by hand with a screen reader and a keyboard. That ratio is normal, and it is the reason a scan is not an audit: automated rules are good at what a machine can measure — a missing attribute, a contrast ratio, a duplicate id — and blind to whether a name is meaningful, whether focus can escape a dialog, or whether an error message actually helps. F-01 and F-06 are the clearest examples here: one is invisible to the scanner, the other is recorded by it as a pass.
Scope, limits and what we did not test
- •The payment step is a hosted iframe supplied by the shop’s payment provider. We verified that focus enters and leaves it correctly; its internal markup belongs to the provider and cannot be changed by the shop.
- •PDF invoices and the two marketing videos are outside the scope of this report. Both fall under the EAA and can be quoted separately.
- •The findings describe the site as it stood between 24 and 27 June 2026. Theme updates, new plugins and new product content can reintroduce issues after that date.
- •This is a technical assessment, not legal advice. EAA Comply is an independent audit service, not a public authority and not a certification body.
What happens next
- →Your developer works through the fix plan. All of it is markup, CSS and focus handling — nothing here needs a redesign.
- →Tell us when it is done and we retest the same scope. The retest is included.
- →Once the scope passes, the paid tiers issue the technical conformance certificate. For this fictional shop that is sample certificate EAAC-2026-0428-17A, which is the other half of this example.
- →Your accessibility statement is written from these findings and updated at every retest. An extract of the draft is below.
See the matching sample certificate →
Your accessibility statement (draft extract)
Commitment. Demo Store S.L. is committed to making shop.demostore-example.com accessible in accordance with Directive (EU) 2019/882 and the harmonised standard EN 301 549.
Compliance status. This website is partially conformant with WCAG 2.1 level AA. “Partially conformant” means that some parts of the content do not fully conform to the accessibility standard.
Non-accessible content. The consent banner cannot be operated by keyboard (WCAG 2.1.2). Several controls have no accessible name (WCAG 4.1.2). Form errors are not announced (WCAG 4.1.3). Planned resolution: 31 July 2026.
Feedback. If you find a barrier on this site, write to accessibility@demostore-example.com. We reply within 10 working days.
The delivered statement is complete, dated and ready to publish; this extract shows the parts that come out of the audit. It says “partially conformant” because on the day of the audit that was true. It is rewritten at the retest.
Sample document. shop.demostore-example.com, Demo Store S.L. and every finding, figure and date in this report are fictional and exist only to show the format of the report EAA Comply delivers. No real client, site or audit is depicted. EAA Comply is an independent technical audit service, not a public authority and not a certification body. A real report is produced against your live code, and its contents will differ.