Beispielbericht · Demodaten

Wissen, was zuerst wichtig ist.

So sieht eine Prüfung an unserem fiktiven Demo-Shop aus. Die Befunde wurden tatsächlich gemessen; die Fehler haben wir für das Beispiel absichtlich eingebaut.

Eigene Startseite prüfen

Beispiel, keine echte Kundenprüfung. Der Musterbericht zeigt Aufbau und Sprache des Produkts. Ergebnisse hängen von der tatsächlich geprüften Website ab.

01 / Überblick · Demodaten

Fiktiver Demo-Shop

1 Seite · Desktop & Mobil · 15. November 2026

Automatische Barrierefreiheitsprüfung einer lokalen HTML-Vorlage.

Dringend
3
Wichtig
1
Hinweise
0

Was jetzt wichtig ist

Fehlende Namen und Beschriftungen zuerst ergänzen, anschließend den Textkontrast verbessern.

  1. Bilder ohne Beschreibung (Alternativtext)
    Dringend · ca. 10 Min. (Schätzung)
  2. Schaltflächen ohne erkennbaren Namen
    Dringend · ca. 30 Min. (Schätzung)
  3. Formularfelder ohne Beschriftung
    Dringend · ca. 30 Min. (Schätzung)
  4. Text zu blass für den Hintergrund (Kontrast)
    Wichtig · ca. 45 Min. (Schätzung)

Reihenfolge aus der vorhandenen Bewertung: Schweregrad und Verbreitung im Verhältnis zum geschätzten Aufwand. Gleich wichtige Befunde können gemeinsam bearbeitet werden.

Einordnung der Punktzahl

63 / 100 Ausbaufähig

Ein technischer Orientierungswert für diese eine Seite und die eingesetzten automatischen Regeln. Keine Prozentangabe zur Barrierefreiheit der Website.

Die Bewertung startet bei 100. Befunde verringern die verbleibenden Punkte abhängig von Schweregrad, Verbreitung und Anzahl. Kritische Befunde verhindern die Note „Gut“.

Geprüft · Befunde vorhanden
Eine Demo-Seite, zwei Ansichten, vier Regeln mit Befund.
Nicht geprüft
Weitere Seiten, Netzwerk, Crawler, CMS-Erkennung und manuelle Bedienbarkeit.
Nicht erreichbar
Kein Erreichbarkeitstest im Demo-Lauf; dazu liegt kein Ergebnis vor.
Kein Befund gefunden
Nur für die erneute automatische Prüfung der korrigierten Demo dokumentiert. Kein Nachweis für ungeprüfte Bereiche.

Priorisierte Befunde

4 Demo-Befunde

Befund 01 / 04 · Demo

Dringend

Bilder ohne Beschreibung (Alternativtext)

Dringend: Fehlende Informationen können die Nutzung mit Hilfsmitteln verhindern. Die Reihenfolge berücksichtigt Schweregrad, Verbreitung und geschätzten Aufwand.

Beobachtung

Die automatische Prüfung meldet die Regel image-alt an 1 Stelle auf der Demo-Startseite. Selektor: img.

Warum ist das relevant?

Bilder brauchen einen kurzen Text, der sagt, was darauf zu sehen ist. Fehlt er, bleibt das Bild für manche Menschen unsichtbar – oder der Screenreader liest den Dateinamen vor („IMG_4711“).

Demo-Fundstelle für „Bilder ohne Beschreibung (Alternativtext)“, orange markiert.
Originalausschnitt aus dem Demo-Lauf. Zum Vergrößern öffnen. Die Markierung zeigt den Fundort; der technische Befund folgt aus der Regelprüfung, nicht allein aus dem Bild.

Vermutete Ursache

Möglicherweise fehlt eine Inhaltspflege oder eine passende Gestaltungseinstellung. Die verantwortliche Quelldatei und das CMS wurden in dieser Demo nicht ermittelt.

Wen betrifft das?

Blinde und stark sehbehinderte Menschen, die sich Seiten mit einem Screenreader vorlesen lassen. Suchmaschinen, die Ihre Inhalte dadurch besser verstehen.

Empfohlene Schritte

  1. Beschreiben Sie in wenigen Worten, was zu sehen ist, z. B. „Blauer Kaffeebecher aus Steingut, 300 ml“.
  2. Rein dekorative Bilder (Muster, Trennlinien) bekommen einen leeren Alternativtext – dann überspringt der Screenreader sie.
  3. Nicht „Bild von …“ schreiben, das sagt der Screenreader schon selbst.
Im Inhalt nachpflegen

Planungsschätzung: etwa 10 Minuten; Zuständigkeit voraussichtlich Inhaltspflege / Gestaltung. Vor Beauftragung bestätigen lassen.

Technische Vertiefung · Regel, Selektor und HTML
Prüfregel
image-alt
Selektor
img
HTML-Ausschnitt
<img src="data:image/svg+xml,%...">
Fundort
Demo-Startseite; die URL ist im gespeicherten Beispieldatensatz nicht enthalten.
Prüfumgebung
axe-core 4.14.0 · Browser 157.0.8103.52. Gesamtlauf: Desktop und Mobil; die Zuordnung dieses Bildes zur Ansicht fehlt im Export.

Ausgewählter Demo-Befund: Bilder ohne Beschreibung (Alternativtext)

03 / PDF & Prüfgrenzen

Ein Dokument für die Weiterarbeit.

01 / Orientierung

Website & Prüfauftrag

Datum, tatsächlicher Umfang und erklärte Punktzahl. Danach Zusammenfassung und Reihenfolge der Bearbeitung.

02 / Befundseiten

Ein Befund je Seitenanfang

Beobachtung, Bedeutung, Bildbeleg und Empfehlung zusammen. Längere Befunde dürfen auf Folgeseiten weiterlaufen.

03 / Nachschlagen

Prüfgrenzen & Technik

Manuelle Checkliste, Methodik und technische Fundstellen. Wiederkehrende Fußzeile mit Website, Datum und Seitenzahl.

Geprüft am 15. November 2026 mit axe-core 4.14.0. Die eigene HTML-Vorlage wurde lokal im Browser in beiden Ansichten untersucht. Crawler, Netzwerk und CMS-Erkennung wurden in diesem Demo-Lauf nicht getestet.

Beispiel-PDF ansehen

Zusätzliche Datenanforderungen für vollständigere Berichte

Im aktuellen Web-Beispielexport fehlen die URL je Fundstelle, die Ansicht des jeweiligen Screenshots, WCAG-Zuordnung und konkrete Messdetails wie Farbwerte und Kontrastverhältnis. Diese Angaben werden hier nicht ergänzt oder aus Bildern geschätzt.

Die Kunden-Ergebnisansicht benötigt für dieselbe Befundtiefe eine erweiterte Schnittstelle mit Befunden, Belegen, geprüften Bereichen sowie Seitenstatus und Ausfallgründen. Das ist ein Erweiterungsvorschlag, keine vorhandene Funktion.

Was zeigte die erneute Prüfung der Demo?

Wir haben einen Bildtext und eine Formularbeschriftung ergänzt, die leere Schaltfläche benannt und den Textkontrast erhöht. Danach wurde dieselbe Vorlage erneut mit denselben Regeln in beiden Ansichten geprüft.

100/100 Punkte · 0 automatisch gefundene Probleme

Dieser kontrollierte Vergleich zeigt die Wirkung dieser vier Korrekturen. Er belegt keine vollständige Barrierefreiheit. Im Komplett-Check ist ein kostenloser Nachtest enthalten, den Sie ab 30 Tagen im Kundenbereich starten können.

Welche Prüfungen bleiben für Menschen?

Auch bei 100 Punkten bleiben Aufgaben für Menschen. Die manuelle Checkliste im PDF unterstützt die Selbstprüfung.

  • Alles mit der Tastatur bedienbar?

    Viele Menschen können keine Maus benutzen. Ein automatischer Test sieht nicht, ob man z. B. das Menü, den Größenwähler oder den Warenkorb wirklich mit der Tastatur erreicht und bedienen kann.

  • Sinnvolle Reihenfolge beim Durchspringen?

    Springt der Fokus quer über die Seite, verlieren Tastatur-Nutzer die Orientierung.

  • Beschreiben die Bildtexte wirklich das Bild?

    Der Test erkennt, ob ein Alternativtext fehlt – nicht, ob er gut ist. „Bild1“ oder „Produktfoto“ hilft niemandem.

  • Verständliche Sprache und klare Linktexte?

    Fachbegriffe, verschachtelte Sätze und Links wie „hier klicken“ sind für viele Menschen eine Hürde – Screenreader-Nutzer lassen sich Links oft als Liste vorlesen, ohne Zusammenhang.