Technical Mode / Delivery View

Your Agency

Accessibility
Audit Report

https://demo-webshop.eu

Score

Critical

Major

Minor

Prepared by Your Agency

5 April 2026

Prepared for stakeholder review, implementation planning, and secure team sharing.

Executive Summary

Technical mode is active. This version includes the full implementation appendix alongside the executive readout.

This paid audit sample shows how AccessiGuard turns automated scan findings into a client-ready implementation plan. The highest risk barriers in this demo affect browsing, checkout completion, and link clarity across multiple templates, which means the work should start at shared component level rather than page by page.

Scope

8 pages

Key pages included in this audit scope.

Issue Load

5 open

Distinct issue groups across all severities.

Highest Risk Area

Images

1 issue in the most affected category.

Issue Mix

Mostly systemic

4 of 4 top findings point to reusable templates or shared components, so the fastest path is to fix patterns once and verify them everywhere.

Estimated Effort

2-4 developer days

A practical delivery range for the current scope.

Visual Proof

4 captures

Screenshot-backed evidence is included for the highest-impact findings.

Critical

Major

Minor

Main Risk Areas

Images is a leading risk area with 1 critical finding across 5 pages.

Forms is a leading risk area with 1 critical finding across 1 page.

Color is a leading risk area with 1 major finding across 5 pages.

Likely Quick Wins

Checkout form inputs missing labels can likely be closed quickly by design system on 1 page.

Insufficient colour contrast on price labels can likely be closed quickly by design system on 5 pages.

Links without accessible names can likely be closed quickly by design system on 3 pages.

Likely Affected Journeys

Navigation and discoveryCheckout and formsContent consumption

Likely Repeated Components

product-card

critical

2 issues across 6 pages suggest this is a repeated implementation pattern worth fixing at source and rechecking once.

2 issues6 pages

hero-banner

critical

1 issue across 5 pages suggest this is a repeated implementation pattern worth fixing at source and rechecking once.

1 issue5 pages

input[name="card_number"]

critical

1 issue across 1 page suggest this is a repeated implementation pattern worth fixing at source and rechecking once.

1 issue1 page

input[name="expiry"]

critical

1 issue across 1 page suggest this is a repeated implementation pattern worth fixing at source and rechecking once.

1 issue1 page

Highest-Impact Findings

#1critical

Product images missing alternative text

Shared componentContent publishing workflow gapContentNavigation and discoveryContent consumption

5 pages affected / 34 instances

Blind users navigating the product catalogue cannot identify what any product image shows. This makes the entire shopping experience unusable with a screen reader because users cannot browse, compare, or select products.

Automated evidenceAI-assisted explanation

#2critical

Checkout form inputs missing labels

Repeated templateTemplate-level implementation gapDesign SystemCheckout and forms

1 page affected / 6 instances

Users relying on assistive technology cannot complete purchases because the checkout form fields have no programmatic labels. Screen readers announce these inputs without enough context to know what to enter.

Automated evidenceAI-assisted explanation

#3major

Insufficient colour contrast on price labels

Shared componentDesign system token or interaction patternDesign SystemCheckout and formsNavigation and discovery

5 pages affected / 18 instances

Price labels are difficult to read for users with low vision or colour deficiency. At a 2.8:1 ratio, the text fails WCAG AA requirements on a high-value conversion path.

Automated evidenceAI-assisted explanation

Screenshot-Backed Proof

Captured during the paid audit scan

Navigation and discoveryContent

Product images missing alternative text

/products

Checkout and formsDesign System

Checkout form inputs missing labels

/checkout

Checkout and formsDesign System

Insufficient colour contrast on price labels

Price labels are difficult to read for users with low vision or colour deficiency. At a 2.8:1 ratio, the text fails WCAG AA requirements on a high-value conversion path.

/products

Under the European Accessibility Act (effective June 28, 2025), e-commerce services provided to EU consumers are required to meet accessibility standards. The issues identified in this report represent both a compliance risk and usability barriers for an estimated 15-20% of potential visitors.

Methodology

Standards

WCAG 2.1 AA automated checks
European Accessibility Act readiness review
Cross-template issue clustering for prioritization

Tools

axe-core in a real browser context
Rendered markup evidence capture
AI-assisted prioritization and remediation drafting

Pages Scanned

https://demo-webshop.eu/

https://demo-webshop.eu/products

https://demo-webshop.eu/products/summer-dress

https://demo-webshop.eu/products/leather-jacket

https://demo-webshop.eu/cart

https://demo-webshop.eu/checkout

https://demo-webshop.eu/about

https://demo-webshop.eu/sale

Evidence Source

Findings in this version are grounded in automated browser scans of the URLs listed above and the captured HTML and screenshot evidence shown in the issue detail section.

AI-Assisted Sections

User-impact explanations and remediation guidance are generated from the captured evidence to speed up triage and planning.

Scope Boundary

This report supports prioritization and implementation planning. It is not a line-by-line manual conformance review of every flow.

This is a sample paid audit demonstrating the report format. Automated scanning detects approximately 30–40% of WCAG 2.1 AA issues; issues requiring manual evaluation are not captured. Remediation guidance is AI-assisted and intended for planning purposes only. This report does not constitute a conformance audit or legal certification.

Issue Overview

Categories Flagged

Distinct accessibility themes present in this audit.

Primary Concentration

Images

1 issue in the most affected category.

Critical Categories

Categories with at least one critical barrier.

Category	Critical	Major	Minor	Total
Images	1	-	-	1
Forms	1	-	-	1
Color	-	1	-	1
Navigation	-	1	-	1
Language	-	-	1	1
Total	2	2	1	5

Issue Mix by CategoryCriticalMajorMinor

Images1 total / 20%

Forms1 total / 20%

Color1 total / 20%

Navigation1 total / 20%

Language1 total / 20%

Prioritized Issue Details

Start with the highest-severity items and the patterns that appear across multiple pages. The notes below are structured so project leads can scope the work quickly while developers still have direct evidence and acceptance criteria.

Issue 1image-alt

Product images missing alternative text

critical

WCAG 1.1.1Images5 pages34 instancesRule guidance

Automated evidenceAI-assisted explanationOwner: ContentScope: Shared componentContent publishing workflow gapJourney: Navigation and discoveryJourney: Content consumption

Impact on Users

Sample Elements

2 samples

Sample 1//products

<img src="/uploads/dress-blue.jpg" class="product-card__image">

Selector: img.product-card__image

Fix any of the following: Element does not have an alt attribute. aria-label attribute does not exist or is empty.

Sample 2//

<img src="/banners/summer-sale.jpg" class="hero-banner__img" width="1200">

Selector: img.hero-banner__img

Fix any of the following: Element does not have an alt attribute.

Where It Appears

//products/products/summer-dress/products/leather-jacket/sale

Suggested Remediation

Add descriptive alt attributes to all product images. For product cards, use the product name: alt="Blue Summer Dress - EUR 49.90". For decorative banners, use alt="" with role="presentation".

Acceptance Criteria

All non-text content has a text alternative that serves the same purpose. Images with no informational value use empty alt="".

Delivery Notes

Suggested ownerContent

ScopeShared component

Primary journeyNavigation and discovery

Root cause pattern: Content publishing workflow gap

Repeated selectors: product-card / hero-banner / category-thumb

Estimated effortMedium (1-4 hours)

Provenance: Automated evidence / AI-assisted explanation

Best fixed at component, token, or template level first so the same barrier clears across the site in one pass.

Issue 2label

Checkout form inputs missing labels

critical

WCAG 1.3.1Forms1 page6 instancesRule guidance

Automated evidenceAI-assisted explanationOwner: Design SystemScope: Repeated templateTemplate-level implementation gapJourney: Checkout and forms

Impact on Users

Sample Element

1 sample

Sample 1//checkout

<input type="text" name="card_number" placeholder="Card number" class="checkout-input">

Selector: input[name="card_number"]

Fix any of the following: Element has no associated label. No aria-label or aria-labelledby attribute.

Where It Appears

/checkout

Suggested Remediation

Add <label> elements or aria-label attributes to all checkout inputs. Example: <label for="card_number">Card number</label> paired with id="card_number" on the input.

Acceptance Criteria

Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text.

Delivery Notes

Suggested ownerDesign System

ScopeRepeated template

Primary journeyCheckout and forms

Root cause pattern: Template-level implementation gap

Estimated effortQuick (under 1 hour)

Provenance: Automated evidence / AI-assisted explanation

Check the repeated page template or content block behind this issue before fixing one URL at a time.

Issue 3color-contrast

Insufficient colour contrast on price labels

major

WCAG 1.4.3Color5 pages18 instancesRule guidance

Automated evidenceAI-assisted explanationOwner: Design SystemScope: Shared componentDesign system token or interaction patternJourney: Checkout and formsJourney: Navigation and discovery

Impact on Users

Price labels are difficult to read for users with low vision or colour deficiency. At a 2.8:1 ratio, the text fails WCAG AA requirements on a high-value conversion path.

Sample Element

1 sample

Sample 1//products

<span class="price-tag" style="color: #999; font-size: 14px;">EUR 49.90</span>

Selector: .price-tag

Element has insufficient color contrast of 2.8:1 (foreground color: #999999, background color: #ffffff, expected ratio: 4.5:1).

Where It Appears

/products/products/summer-dress/cart/sale/checkout

Suggested Remediation

Darken the price text colour from #999 to at least #767676 to meet the 4.5:1 contrast ratio. Update the CSS custom property or design token used for price labels site-wide.

Acceptance Criteria

Text and images of text have a contrast ratio of at least 4.5:1 (3:1 for large text).

Delivery Notes

Suggested ownerDesign System

ScopeShared component

Primary journeyCheckout and forms

Root cause pattern: Design system token or interaction pattern

Repeated selectors: price-tag / sale-price / shipping-cost

Estimated effortQuick (under 1 hour)

Provenance: Automated evidence / AI-assisted explanation

Best fixed at component, token, or template level first so the same barrier clears across the site in one pass.

Issue 4link-name

Links without accessible names

major

WCAG 2.4.4Navigation3 pages12 instancesRule guidance

Automated evidenceAI-assisted explanationOwner: Design SystemScope: Shared componentReusable component implementation gapJourney: Navigation and discovery

Impact on Users

Screen reader users encounter links announced as 'link' with no description. They cannot tell where social media icon links lead or which product a card links to.

Sample Element

1 sample

Sample 1//

<a href="https://instagram.com/demo" class="social-icon"><svg>...</svg></a>

Selector: a.social-icon

Fix any of the following: Element is in tab order and does not have accessible text. Element does not have text that is visible to screen readers.

Where It Appears

//products/about

Suggested Remediation

Add aria-label to icon-only links: <a href="..." class="social-icon" aria-label="Follow us on Instagram">. For product card links, ensure the link text includes the product name.

Acceptance Criteria

The purpose of each link can be determined from the link text alone, or from the link text together with its programmatically determined context.

Delivery Notes

Suggested ownerDesign System

ScopeShared component

Primary journeyNavigation and discovery

Root cause pattern: Reusable component implementation gap

Repeated selectors: social-icon / product-card

Estimated effortQuick (under 1 hour)

Provenance: Automated evidence / AI-assisted explanation

Best fixed at component, token, or template level first so the same barrier clears across the site in one pass.

Minor Issues

Lower priority, but still recommended for full WCAG 2.1 AA coverage and cleaner long-term maintenance.

Issue	Category	Spread	Severity
HTML element missing lang attribute html-has-lang/WCAG 3.1.1	Language	5 pages 5 instances	minor

Remediation Guide

This condensed guide is meant for project managers, developers, and QA teams who need the fix plan in one place. Detailed evidence, acceptance criteria, and ownership notes remain in the issue detail section above.

Issue	Category	Spread	Severity	Remediation	Effort
Product images missing alternative text image-alt/WCAG 1.1.1	Images	5 pages 34 instances	critical	Add descriptive alt attributes to all product images.	Medium (1-4 hours)
Checkout form inputs missing labels label/WCAG 1.3.1	Forms	1 page 6 instances	critical	Add <label> elements or aria-label attributes to all checkout inputs.	Quick (under 1 hour)
Insufficient colour contrast on price labels color-contrast/WCAG 1.4.3	Color	5 pages 18 instances	major	Darken the price text colour from #999 to at least #767676 to meet the 4.5:1 contrast ratio.	Quick (under 1 hour)
Links without accessible names link-name/WCAG 2.4.4	Navigation	3 pages 12 instances	major	Add aria-label to icon-only links: <a href="..." class="social-icon" aria-label="Follow us on Instagram">.	Quick (under 1 hour)
HTML element missing lang attribute html-has-lang/WCAG 3.1.1	Language	5 pages 5 instances	minor	Add lang="en" (or the appropriate language code) to the <html> element in the page template.	Quick (under 1 hour)

Remediation Roadmap

Delivery Phases

A structured implementation sequence based on issue severity and effort.

Estimated Effort

2-4 developer days

A working range for the current scope, not a contractual estimate.

Recommended Start

Week 1

Phase 1: Checkout and browsing blockers

Week 1

Fix missing form labels and image alternatives so users can browse products and complete checkout with assistive technology.

Phase 2: Shared visual and navigation patterns

Week 2

Resolve low-contrast pricing and unnamed links at component level so the same issues do not keep spreading.

Phase 3: Template hardening and QA

Week 3

Close the remaining language-template issue and verify the earlier fixes across key page templates before release.

Why Accessibility Requires Ongoing Monitoring

Accessibility is not a one-time fix. New content, CMS updates, design changes, third-party widgets, and developer turnover all reintroduce issues. Without regular monitoring, today's compliant site can regress within weeks.

A new product-card component variant can silently reintroduce missing alt text across the catalogue.

Checkout integrations or marketing widgets often remove labels or focus states after routine frontend updates.

Design token updates can weaken text contrast site-wide if accessibility thresholds are not tested during QA.

We recommend monthly accessibility monitoring

Catch regressions before they accumulate. New content, CMS updates, and third-party widgets reintroduce issues within weeks.

Start Monthly MonitoringEUR 199/month / Up to 3 client sites

Save the recurring schedule now. Need portfolio pricing or a custom rollout? Talk it through.

About and Contact

Your Agency provides accessibility auditing and monitoring services for web agencies serving EU-facing businesses. We help agencies turn accessibility compliance into a repeatable, client-ready service.

Schedule a Follow-Up

To discuss the findings in this report or learn about our monthly monitoring plan, contact us at office@accesi-guard.com

AccessibilityAudit Report

Executive Summary

Main Risk Areas

Likely Quick Wins

Likely Affected Journeys

Likely Repeated Components

product-card

hero-banner

input[name="card_number"]

input[name="expiry"]

Highest-Impact Findings

Product images missing alternative text

Checkout form inputs missing labels

Insufficient colour contrast on price labels

Screenshot-Backed Proof

Product images missing alternative text

Checkout form inputs missing labels

Insufficient colour contrast on price labels

Methodology

Standards

Tools

Pages Scanned

Evidence Source

AI-Assisted Sections

Scope Boundary

Issue Overview

Prioritized Issue Details

Product images missing alternative text

Impact on Users

Sample Elements

Where It Appears

Suggested Remediation

Acceptance Criteria

Delivery Notes

Checkout form inputs missing labels

Impact on Users

Sample Element

Where It Appears

Suggested Remediation

Acceptance Criteria

Delivery Notes

Insufficient colour contrast on price labels

Impact on Users

Sample Element

Where It Appears

Suggested Remediation

Acceptance Criteria

Delivery Notes

Links without accessible names

Impact on Users

Sample Element

Where It Appears

Suggested Remediation

Acceptance Criteria

Delivery Notes

Minor Issues

Remediation Guide

Remediation Roadmap

Phase 1: Checkout and browsing blockers

Phase 2: Shared visual and navigation patterns

Phase 3: Template hardening and QA

Why Accessibility Requires Ongoing Monitoring

About and Contact

Schedule a Follow-Up

Accessibility
Audit Report