Commerce QA Checkliste

15 Prüfpunkte entlang der Kaufstrecke.

Eine fachlich nutzbare Checkliste für Commerce-Agenturen: Was kann automatisiert geprüft werden, was braucht Tastatur, Screenreader oder menschlichen Kontext — und warum ist es für den Kaufabschluss relevant?

AgenturPilot kostenlos testen Deep-Dive Musterreport ansehen

Kaufstrecke

Vom ersten Klick bis zur Bestellbestätigung.

Die Reihenfolge folgt einem typischen Commerce-Flow. Kritische Kaufbarrieren kommen zuerst.

01 EinstiegConsent, Orientierung, Fokus

02 ProduktBilder, Varianten, Filter

03 WarenkorbMenge, Preise, Aktionen

04 CheckoutFormulare, Fehler, Zahlung

Einstieg, Consent und Orientierung

3 Prüfpunkte

Consent-Banner vollständig per Tastatur bedienen

Alle Optionen müssen erreichbar sein; Fokus darf nicht verloren gehen oder unkontrolliert im Hintergrund landen.

WCAG 2.1.1 · 2.4.3Manuell prüfen

Tab-Reihenfolge und Escape testen
Fokus beim Öffnen und Schließen prüfen

Sichtbaren Fokus-Indikator erhalten

Interaktive Elemente brauchen einen klar erkennbaren Fokuszustand. Kein outline: none ohne Ersatz.

WCAG 2.4.7Teilweise automatisch

Buttons, Links, Inputs und Filter prüfen
Kontrast des Fokusrahmens beachten

Skiplink und Seitenstruktur bereitstellen

Tastatur- und Screenreader-Nutzer sollen Navigation überspringen und den Hauptinhalt direkt erreichen.

WCAG 2.4.1 · 1.3.1Automatisch prüfbar

Skiplink bei Fokus sichtbar
Hauptbereich semantisch markieren

Produkt, Varianten und Filter

4 Prüfpunkte

Produktbilder mit passenden Textalternativen

Produktbilder brauchen sinnvolle Alternativtexte; dekorative Bilder bleiben für Screenreader stumm.

WCAG 1.1.1Automatisch + manuell

Fehlende alt-Attribute erkennen
Sinnhaftigkeit redaktionell prüfen

Variantenwahl verständlich und bedienbar

Größe, Farbe und Material müssen mit Tastatur erreichbar sein; Zustandsänderungen müssen nachvollziehbar sein.

WCAG 4.1.2Manuell prüfen

Radio-/Select-Status mit Screenreader prüfen
Nicht nur Farbe als Unterscheidung nutzen

Filter und Facetten mit Status auszeichnen

Aktive Filter, Ergebnisse und Zurücksetzen müssen als Zustand verständlich sein.

WCAG 1.3.1 · 4.1.2Manuell prüfen

Filterstatus und Ergebnisänderung testen
Fokus nach Aktualisierung prüfen

Link- und Button-Namen eindeutig machen

„Mehr“, „Weiter“ oder reine Icons brauchen im Kontext einen eindeutigen zugänglichen Namen.

WCAG 2.4.4 · 4.1.2Automatisch prüfbar

Leere und generische Namen erfassen
Icon-Buttons mit accessible Name prüfen

Warenkorb und Checkout

5 Prüfpunkte

Mengensteuerung eindeutig beschriften

Mengenfelder, Plus-/Minus-Buttons und Entfernen-Aktionen benötigen Produktbezug und zugängliche Namen.

WCAG 4.1.2Automatisch prüfbar

Labels mit Input verbinden
Icon-Buttons beschreiben

Formularfelder mit echten Labels versehen

Platzhalter ersetzen keine Labels. Pflichtfelder, Hilfen und Fehler müssen mit dem Feld verknüpft sein.

WCAG 1.3.1 · 3.3.2Automatisch prüfbar

Label-/for-Verknüpfung prüfen
autocomplete-Werte ergänzen

Fehlermeldungen verständlich ankündigen

Nach Validierung müssen Fehler hörbar, konkret und beim betroffenen Feld nachvollziehbar sein.

WCAG 3.3.1 · 4.1.3Manuell prüfen

Screenreader-Ansage testen
Fehlerkorrektur ohne Kontextverlust prüfen

Zahlungsarten klar auswählen und erklären

Radio-Gruppen, externe Zahlungsoptionen und Zwischenschritte brauchen erkennbare Rollen und Namen.

WCAG 1.3.1 · 4.1.2Manuell prüfen

Auswahlstatus prüfen
Externe Provider im Scope markieren

Preis- und Versandänderungen ankündigen

Dynamische Preis-, Rabatt- oder Versandänderungen brauchen eine sinnvolle Statusmeldung.

WCAG 4.1.3Teilweise automatisch

Live-Regionen erkennen
Ansage nur bei relevanter Änderung

Abschluss, Mobilität und manuelle Qualität

3 Prüfpunkte

Zoom und mobile Bedienbarkeit prüfen

Bei 200 % und 400 % Zoom dürfen keine Inhalte verschwinden. Touch-Ziele müssen ausreichend groß sein.

WCAG 1.4.4 · 1.4.10Manuell prüfen

Horizontalen Scroll vermeiden
Buttons und Links auf Touch testen

Seitensprache und Eingabezwecke auszeichnen

Sprachattribute und standardisierte Eingabezwecke unterstützen Vorlesesprache und Autofill.

WCAG 3.1.1 · 1.3.5Automatisch prüfbar

lang auf Template prüfen
Adress-/Zahlungsfelder dokumentieren

Bestellung kognitiv verständlich abschließen

Reihenfolge, Zusammenfassung, Fehlervermeidung und verständliche Bestellbestätigung mit echten Nutzern prüfen.

WCAG 3.3.4Manuell prüfen

Zusammenfassung vor Absenden
Fehler vermeiden statt nur melden

Was der Scanner ergänzt — und was bei der Agentur bleibt

Der technische Scan hilft, maschinenprüfbare Muster und wiederkehrende Komponenten früh zu finden. Die manuelle Prüfung bleibt eine eigene Qualitätsleistung der Agentur.

Automatisiert: fehlende Labels, Kontrastwerte, ARIA-Fehler, technische Link-/Button-Namen, Sprachattribute
Manuell: Fokusabläufe, Screenreader-Verständnis, sinnvolle Inhalte, kognitive Belastung, externe Checkout-Grenzen

Grenzen dieser Checkliste

Die Liste ist eine QA-Arbeitsgrundlage, kein vollständiger Konformitätsnachweis.
Sie ersetzt keine manuelle Prüfung mit assistiven Technologien oder rechtliche Bewertung.
Bei größeren bezahlten Projekten wird der autorisierte Scope als konkrete Coverage dokumentiert, nicht pauschal behauptet.
Nur eigene Demo-Shops oder autorisierte Kunden-Shops prüfen.