Zum Inhalt springen

Barrierefreiheit selbst prüfen: der Schnelltest für Ihre Website

Vier Durchgänge mit Tastatur, Zoom, Prüfwerkzeug und Formular – so erkennen Sie die größten Barrieren, auch mit Blick auf das BFSG

  • Barrierefreiheit

Ob eine Website barrierefrei ist, zeigt kein Knopfdruck. Einen ehrlichen ersten Eindruck verschaffen Sie sich aber selbst – ohne Fachwissen, mit Browser, Tastatur und Smartphone. Dieser Schnelltest führt Sie in vier Durchgängen durch die wichtigsten Prüfpunkte. Rechnen Sie mit etwa einer halben Stunde.

Für viele Unternehmen in Deutschland ist das Thema längst keine Kür mehr: Seit dem 28. Juni 2025 verlangt das Barrierefreiheitsstärkungsgesetz (BFSG), dass zahlreiche Online-Shops und andere Websites, über die Verbraucher Verträge abschließen, barrierefrei sind. Wen das betrifft, erklärt unser Beitrag BFSG: Was das Barrierefreiheitsstärkungsgesetz für Ihre Website bedeutet. Und auch ohne Pflicht lohnt es sich: Laut Statistischem Bundesamt hat fast jede zehnte Person in Deutschland eine anerkannte Schwerbehinderung, dazu kommen viele Menschen mit leichteren oder vorübergehenden Einschränkungen.

Vorbereitung: drei Seiten und ein Notizblatt

Wählen Sie drei Seiten aus: die Startseite, eine typische Inhaltsseite und die Seite, auf der Ihre Kundschaft aktiv wird, etwa das Kontaktformular. Verkaufen Sie online oder nehmen Sie Buchungen an, gehen Sie zusätzlich den ganzen Weg bis zur Bestellbestätigung durch. Notieren Sie zu jedem Fund kurz Seite, Problem und am besten einen Screenshot.

Durchgang 1: Maus weglegen

Viele Menschen bedienen Websites nur mit der Tastatur, etwa wegen motorischer Einschränkungen oder weil sie einen Screenreader nutzen. Legen Sie die Maus beiseite und klicken Sie einmal in die Adresszeile. Mit der Tab-Taste springen Sie vorwärts, mit Umschalt + Tab zurück. Die Eingabetaste öffnet Links, die Leertaste löst Schaltflächen aus und setzt Häkchen.

  • Alles erreichbar? Navigation, Suche, Schaltflächen, Formularfelder und Footer: Was mit der Maus geht, muss auch mit der Tastatur gehen.
  • Fokus sichtbar? Sie müssen jederzeit sehen, wo Sie gerade sind. Achten Sie auch darauf, ob ein fixierter Kopfbereich oder ein Banner das ausgewählte Element komplett verdeckt.
  • Kein Festhängen? Sie dürfen nirgends steckenbleiben, etwa in einer eingebetteten Karte oder einem Video-Player.
  • Banner und Dialoge? Lässt sich das Cookie-Banner per Tastatur bedienen? Lassen sich Pop-ups öffnen und wieder schließen?
  • Logische Reihenfolge? Der Fokus sollte der Lesereihenfolge folgen und nicht kreuz und quer springen.

Tipp für den Mac: Safari hebt mit Tab standardmäßig nur Textfelder und Auswahlmenüs hervor. Aktivieren Sie in den Safari-Einstellungen unter „Erweitert“ die Option, mit Tab jedes Objekt einer Webseite hervorzuheben.

Durchgang 2: Ansicht verändern

  • Zoom auf 200 %: Vergrößern Sie mit Strg und + (Mac: Cmd und +). Text muss lesbar bleiben, nichts darf abgeschnitten werden oder sich überlappen.
  • Zoom auf 400 %: Stellen Sie das Browserfenster auf etwa 1280 Pixel Breite und zoomen Sie auf 400 %. Die Inhalte sollten sich dann umbrechen wie auf einem Smartphone, ohne dass Sie zum Lesen seitlich scrollen müssen.
  • Kontrast: Normaler Text braucht ein Kontrastverhältnis von mindestens 4,5:1 zum Hintergrund, großer Text 3:1. Messen Sie verdächtige Farben wie hellgraue Schrift oder Text auf farbigen Buttons mit dem kostenlosen „Colour Contrast Analyser“. Auch Rahmen von Eingabefeldern und wichtige Symbole brauchen mindestens 3:1.
  • Nicht nur Farbe: Werden Fehler, Pflichtfelder oder Links nur über die Farbe kenntlich gemacht? Dann fehlt ein zweites Merkmal, etwa Text, ein Symbol oder eine Unterstreichung.
  • Bewegung: Slider, Animationen und Videos, die von selbst starten und länger als fünf Sekunden laufen, müssen sich anhalten lassen. Nichts sollte öfter als dreimal pro Sekunde aufblitzen.
  • Smartphone: Lässt sich alles bequem mit dem Daumen treffen? WCAG 2.2 nennt für Schaltflächen und Links als Mindestmaß 24 × 24 CSS-Pixel, mit Ausnahmen etwa für Links im Fließtext.

Durchgang 3: Inhalte und Struktur

Hier hilft eine kostenlose Browser-Erweiterung wie „WAVE“ für Chrome und Firefox. Sie markiert typische Fehler direkt auf der Seite und zeigt Alternativtexte und Überschriften als Liste.

  • Bilder: Hat jedes Bild, das eine Information trägt, einen passenden Alternativtext? Verlinkte Bilder und Logos sollten das Ziel nennen, rein dekorative Bilder einen leeren Alternativtext haben.
  • Überschriften: Ergibt die Liste der Überschriften ein sinnvolles Inhaltsverzeichnis, mit einer Hauptüberschrift und Abschnitten in logischer Reihenfolge?
  • Links: Ist jeder Linktext für sich verständlich? „Zu den Lieferbedingungen“ hilft, „hier“ oder „mehr“ nicht. Symbol-Links wie Social-Media-Icons brauchen einen Namen.
  • Sprache: Ist im Code die Sprache der Seite angegeben, für Deutsch etwa mit lang="de"? Sonst liest ein Screenreader den Text womöglich mit falscher Aussprache vor.
  • Videos und Audio: Gibt es Untertitel für Videos und eine Textfassung für reine Audiobeiträge?

Durchgang 4: Formulare und Abschluss

An Formularen scheitern Menschen oft endgültig, und bei Shops und Buchungen kommt genau hier der Vertrag zustande. Testen Sie diesen Teil besonders gründlich, auch mit der Tastatur aus Durchgang 1.

  • Beschriftung: Hat jedes Feld eine sichtbare Beschriftung, die beim Tippen stehen bleibt? Ein grauer Platzhalter im Feld reicht nicht.
  • Fehlermeldungen: Schicken Sie das Formular absichtlich unvollständig ab. Steht in Worten da, welches Feld betroffen ist und wie Sie den Fehler beheben?
  • Zeitlimits: Läuft im Warenkorb oder bei der Buchung eine Zeit ab? Dann sollten Sie vorher gewarnt werden und die Zeit verlängern können.
  • Anmeldung: Dürfen Sie Ihr Passwort einfügen oder einen Passwort-Manager nutzen? Gibt es eine Alternative, wenn Sie verzerrte Zeichen abtippen sollen?
  • Bis zum Ende: Gehen Sie, wenn möglich, bis zur Bestätigungsseite. Auch die Zahlungsseite eines externen Anbieters gehört für Ihre Kundschaft zum Ablauf.

Zum Schluss: fünf Minuten zuhören

Wer einmal einen Screenreader ausprobiert, versteht viele Prüfpunkte besser. Auf dem Mac ist VoiceOver eingebaut und lässt sich mit Cmd + F5 einschalten, für Windows gibt es den kostenlosen Screenreader NVDA. Lassen Sie sich Ihre Startseite vorlesen: Verstehen Sie, worum es geht und wie Sie weiterkommen?

Was automatische Werkzeuge leisten

WAVE oder die Lighthouse-Prüfung in den Entwicklertools von Chrome finden typische Fehler in Sekunden, etwa fehlende Alternativtexte oder schwache Kontraste. Ob ein Alternativtext passt oder das Menü per Tastatur funktioniert, beurteilen sie aber nicht. Die Web Accessibility Initiative des W3C hält fest, dass kein Werkzeug allein feststellen kann, ob eine Website die Standards erfüllt. Eine hohe Punktzahl ist ein gutes Zeichen, aber kein Nachweis.

So werten Sie Ihre Notizen aus

Statt Punkte zu zählen, sortieren Sie Ihre Funde nach ihrer Wirkung:

  • Blockierend: Jemand kann eine Aufgabe gar nicht erledigen, etwa weil sich der Bestellbutton nicht per Tastatur auslösen lässt oder das Cookie-Banner die Seite sperrt. Diese Punkte haben Vorrang.
  • Erschwerend: Es geht, aber nur mit Mühe, zum Beispiel bei schwachem Kontrast oder unklaren Fehlermeldungen.
  • Kosmetisch: kleinere Unschönheiten, die Sie bei der nächsten Überarbeitung mitnehmen.

Viele Funde stecken in Vorlagen, die auf jeder Seite gleich sind, etwa Kontraste, Fokus-Rahmen oder das Menü. Einmal behoben, sind sie überall gelöst. Alternativtexte, Linktexte und Überschriften kann Ihre Redaktion dagegen oft selbst im Redaktionssystem verbessern.

Was der Schnelltest nicht ersetzt

Der Schnelltest deckt häufige Barrieren ab, aber nicht alle Kriterien der WCAG. Fällt Ihr Angebot unter das BFSG und brauchen Sie eine belastbare Grundlage für Ihre Barrierefreiheitserklärung, ist eine vollständige Prüfung nach WCAG 2.1 AA sinnvoll, besser gleich nach WCAG 2.2 AA. In Deutschland verbreitet ist zum Beispiel der BITV-Test, dessen Prüfschritte auf der europäischen Norm EN 301 549 beruhen.

Ihre Checkliste

  • Alles per Tastatur erreichbar, Fokus immer sichtbar
  • Bei 200 und 400 % Zoom lesbar, ohne seitliches Scrollen
  • Kontrast mindestens 4,5:1, großer Text 3:1
  • Informationen nicht nur über Farbe, Bewegung anhaltbar
  • Bilder mit passenden Alternativtexten
  • Logische Überschriften und verständliche Linktexte
  • Formulare beschriftet, Fehler in Worten erklärt
  • Kauf- oder Buchungsstrecke bis zum Ende bedienbar

Der nächste Schritt

Sie haben Barrieren gefunden oder möchten sichergehen, dass Ihnen nichts entgangen ist? Wir prüfen Ihre Website nach WCAG, von Hand und mit Prüfwerkzeugen, zeigen Ihnen, was am meisten bringt, und setzen die Verbesserungen auf Wunsch um. Mehr dazu auf unserer Seite zur Barrierefreiheit, oder rufen Sie uns an: 07551 839 91 30.

Der Schnelltest ist eine Orientierungshilfe, keine Konformitätsprüfung. Die Hinweise zum BFSG sind eine allgemeine Information, keine Rechtsberatung. Stand: Oktober 2026.

Häufige Fragen

Für einen ersten Eindruck ja. Mit der Tastatur, dem Browser-Zoom, einem Kontrast-Werkzeug und einer Erweiterung wie WAVE finden Sie viele typische Barrieren selbst. Eine vollständige Prüfung nach WCAG ersetzt das nicht, denn manche Kriterien lassen sich nur mit Fachwissen und Erfahrung beurteilen.

Nein. Automatische Werkzeuge erkennen nur einen Teil der Barrieren. Ob sich Ihr Bestellprozess per Tastatur bedienen lässt oder ob Alternativtexte passen, müssen Menschen prüfen. Für das BFSG zählt, ob Ihr Angebot die Anforderungen tatsächlich erfüllt, nicht die Punktzahl eines Werkzeugs. Allgemeine Information, keine Rechtsberatung.

Die Startseite, eine typische Inhaltsseite und die Seiten, auf denen Ihre Kundschaft handelt: Kontaktformular, Warenkorb, Buchung und Bezahlung. Bei Online-Shops und Buchungsstrecken ist der Weg bis zur Bestätigung am wichtigsten, denn dort kommt der Vertrag zustande.

Schlagwörter:
  • Barrierefreiheit