Customer Impact

Website & Entwicklung

Barrierefreiheit Website: So machen Sie Ihre Website barrierefrei

Für KI kopieren

Barrierefreiheit bei einer Website bedeutet, dass möglichst alle Menschen sie nutzen können, auch wer schlecht sieht, keine Maus verwendet oder mit einem Screenreader surft. Eine bestehende Website machen Sie nicht durch einen Neubau barrierefrei, sondern indem Sie gezielt eine Reihe konkreter Probleme auf den vorhandenen Seiten beheben: erst erfassen, wo Besucher hängen bleiben, dann die größten Hürden zuerst abbauen, das Ergebnis testen und es in einer Erklärung festhalten. In diesem Artikel finden Sie einen praktischen Fahrplan für eine Live-Website und erfahren, wie Sie Barrierefreiheit dauerhaft in Design, CMS und Prozesse einbauen.

Was bedeutet Barrierefreiheit bei einer Website?

Eine barrierefreie Website ist für möglichst viele Menschen nutzbar, unabhängig von Einschränkungen und Hilfsmitteln. Der internationale Bezugsrahmen sind die Web Content Accessibility Guidelines (WCAG) des W3C mit vier Prinzipien: wahrnehmbar, bedienbar, verständlich und robust. In der Praxis gilt meist Stufe AA als Ziel, die mittlere von drei Konformitätsstufen. Das W3C bietet eine verständliche Einführung in die Barrierefreiheit im Web mit Beispielen für verschiedene Einschränkungen.

Wichtig: Barrierefreiheit ist fast immer gute Nutzerführung für alle. Besserer Kontrast hilft auch bei Sonnenlicht auf dem Smartphone. Klare Schaltflächentexte helfen auch eiligen Besuchern. Und weil ausgeschlossene Besucher nie Kunden werden, wirkt sich Barrierefreiheit direkt auf Ihre Conversion aus. Wer Ihr Formular nicht ausfüllen kann, füllt es nicht aus. Den Begriff erklärt auch unser Wiki-Eintrag zur Barrierefreiheit.

Muss Ihr Unternehmen eine barrierefreie Website haben?

Für viele Unternehmen lautet die Antwort: möglicherweise teilweise, lassen Sie es rechtlich prüfen. Seit dem 28. Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz (BFSG), die deutsche Umsetzung der europäischen Richtlinie (EU) 2019/882. Es verpflichtet unter anderem Onlineshops, Bankdienstleistungen, E-Books und Telekommunikationsdienste für Verbraucher zur Barrierefreiheit. Als technischer Maßstab gilt die Norm EN 301 549, die WCAG 2.1 Stufe AA übernimmt.

Nicht jedes Unternehmen ist gleich betroffen. Kleinstunternehmen mit weniger als zehn Beschäftigten, die bestimmte Umsatz- oder Bilanzgrenzen nicht überschreiten, sind bei Dienstleistungen ausgenommen, und eine reine B2B-Website ohne Verbrauchergeschäft fällt in der Regel nicht darunter. Wer betroffen ist und welche Pflichten gelten, lesen Sie in unserem Beitrag zum Barrierefreiheitsstärkungsgesetz. Klar ist: Barrierefreiheit wird von “schön zu haben” zu “wird erwartet”, und die Schritte unten bringen Sie in jedem Fall in die richtige Richtung.

Wie machen Sie eine bestehende Website barrierefrei?

Die gute Nachricht: Ein Neubau ist selten nötig. Die meisten Fehler sind gezielte Anpassungen an vorhandenen Seiten. Arbeiten Sie in dieser Reihenfolge, dann sehen Sie schnell Fortschritte, ohne sich in Details zu verlieren.

Schritt 1: Probleme erfassen

Beginnen Sie mit einem eigenen Schnelltest. Gehen Sie die Website nur mit der Tastatur durch (Tab, Enter, Leertaste) und prüfen Sie, ob Sie jede Schaltfläche und jedes Formular mit sichtbarem Fokus erreichen. Ergänzen Sie das mit einem automatischen Test: Unser Test zur Barrierefreiheit Ihrer Website zeigt in einer Minute automatisch erkennbare Fehler auf Startseite, Produktseite und Formular. Automatische Werkzeuge finden aber nur einen Teil der Probleme, der Handtest bleibt nötig.

Schritt 2: Die einfachen Fehler zuerst

Ein großer Teil des Gewinns steckt in einer Handvoll Grundfehler, die auf fast jeder Website vorkommen:

  • Alternativtexte: Geben Sie inhaltlichen Bildern einen beschreibenden Alternativtext und dekorativen Bildern ein leeres alt="", damit ein Screenreader sie überspringt.
  • Farbkontrast: Normaler Text braucht mindestens 4,5:1, großer Text mindestens 3:1 (W3C). Prüfen Sie vor allem Schaltflächen und Formulare.
  • Tastaturbedienung: Alles Klickbare muss per Tab erreichbar sein, mit sichtbarem Fokus und einem “Zum Inhalt springen”-Link oben auf jeder Seite.
  • Formularbeschriftungen: Verknüpfen Sie jedes Feld mit einem sichtbaren <label>. Platzhaltertext reicht nicht, Screenreader überspringen ihn oft.

Weil Formulare Ihr Anfragekanal sind, lohnt es sich, sie zuerst fehlerfrei zu machen. Das passt zu jeder Arbeit an conversionorientiertem Webdesign.

Schritt 3: Die strukturellen Punkte

Danach kommen die tieferen Themen. Geben Sie Ihren Seiten eine logische Überschriftenstruktur (eine h1, darunter saubere h2 und h3), damit ein Screenreader die Seite wie ein Inhaltsverzeichnis durchgehen kann. Schreiben Sie Linktexte, die sagen, wohin sie führen, statt “hier klicken”. Halten Sie Tabellen einfach und korrekt ausgezeichnet. Und sorgen Sie dafür, dass dynamische Elemente wie Menüs, Pop-ups und Meldungen auch mit Tastatur und Screenreader funktionieren. Hier lohnt es sich, die Entwicklung einzubeziehen.

Schritt 4: Mit Werkzeugen und echten Menschen testen

Prüfen Sie Ihre Korrekturen erneut mit Ihren Werkzeugen, verlassen Sie sich aber nicht allein darauf. Am wertvollsten ist es, jemanden Ihre Website mit Screenreader oder nur mit Tastatur nutzen zu lassen. Sie sehen dann in Minuten, was kein Scan findet. Achten Sie auch auf die technische Basis: Eine Website, die auf dem Smartphone zerfällt, ist selbst eine Hürde. Responsives Webdesign und Barrierefreiheit verstärken sich gegenseitig.

Wie bauen Sie Barrierefreiheit dauerhaft ein?

Eine Aufräumaktion behebt die Fehler von heute. Damit neue Seiten von selbst barrierefrei sind, verankern Sie Barrierefreiheit an drei Stellen: im Design, im CMS und im Veröffentlichungsprozess.

EbeneWas Sie festlegenWas es verhindert
DesignsystemFarbpaare, die den Kontrast erreichen, ein fester Fokusstil, Mindestgröße für Klickziele, Schriftgrößen in relativen EinheitenKampagnenfarben und neue Schaltflächen, die unbemerkt unter die Norm rutschen
KomponentenMenü, Akkordeon, Slider, Pop-up und Formular einmal korrekt gebaut und überall wiederverwendetDerselbe Tastatur- und Screenreader-Fehler auf hunderten Seiten
CMSPflichtfeld für Alternativtexte bei inhaltlichen Bildern, Überschriftenebenen als Auswahlliste, kein Text in BildernRedakteure, die unwissentlich Fehler veröffentlichen
InhaltKlare Linktexte, kurze Sätze, Untertitel bei Videos, barrierefreie PDFs oder HTML statt PDFInhalte, die technisch stimmen, aber unbrauchbar bleiben
ProzessBarrierefreiheitsprüfung als Teil der Abnahme jeder Veröffentlichung und KampagneRückschritte nach jedem Update oder Plug-in

Der größte Hebel liegt bei den Komponenten. Eine Website besteht meist aus einigen Dutzend Bausteinen. Bauen Sie diese einmal richtig, erben alle Seiten diese Qualität. Reparieren Sie Seite für Seite, beginnen Sie bei jeder neuen Landingpage von vorn. Welche Kriterien welche Rolle im Team betreffen, zeigt unser Beitrag zu WCAG 2.1 AA.

Die Barrierefreiheitserklärung

Halten Sie das Ergebnis in einer ehrlichen Barrierefreiheitserklärung fest: für welche Website sie gilt, welche Norm Sie anwenden (in der Regel WCAG 2.1 Stufe AA), wie weit Sie sie erfüllen, was noch nicht funktioniert und bis wann, wie Sie geprüft haben, ein Datum und ein Kontakt, über den Nutzer Barrieren melden. Unternehmen unter dem BFSG nennen zusätzlich die zuständige Marktüberwachungsbehörde. Eine vollständige Vorlage finden Sie in unserem Beitrag zur Barrierefreiheitserklärung. Verlinken Sie die Erklärung im Footer und aktualisieren Sie sie nach jeder größeren Änderung. Eine Erklärung, die nicht mehr stimmt, ist schlimmer als keine.

Wie halten Sie Ihre Website barrierefrei?

Behandeln Sie Barrierefreiheit nicht als einmalige Aktion, sondern als festen Teil Ihrer Arbeit. Jede neue Seite, Kampagne oder Erweiterung kann neue Hürden einführen. Planen Sie eine leichte Nachprüfung zu festen Zeitpunkten, etwa quartalsweise oder bei jedem größeren Release, und denken Sie Barrierefreiheit bei einem Relaunch von Anfang an mit. Sie gehört auch zur laufenden Website-Wartung.

Bei uns gehört Barrierefreiheit zu jedem ernsthaften Projekt, in dem wir eine Website erstellen lassen begleiten, nicht als nachträgliche Ergänzung. Unsere Leitfrage bleibt dieselbe: Bringt Ihre Website mehr nutzbare Seiten und mehr Anfragen?

Häufige Fragen

Wie lange dauert es, eine bestehende Website barrierefrei zu machen?

Das hängt von Umfang und Bauweise ab. Die einfachen Fehler (Alternativtexte, Kontrast, Beschriftungen) sind oft in wenigen Tagen behoben. Strukturelle Fehler in Menüs, Formularen oder einem veralteten Theme brauchen mehr Zeit, weil sie in den Vorlagen stecken.

Muss ich meine Website neu bauen?

Selten. Die meisten Fehler sind gezielte Anpassungen an Vorlagen und Inhalten. Ein Neubau ist erst sinnvoll, wenn das Theme oder der Page-Builder selbst unzugänglichen Code erzeugt, den Sie nicht ändern können.

Reicht ein Barrierefreiheits-Plug-in?

Nein. Plug-ins und Overlays ändern den zugrunde liegenden Code nicht und lösen strukturelle Probleme selten. Sie können Hilfsmittel sogar stören. Nutzen Sie Werkzeuge, um Fehler zu finden, und beheben Sie sie in Code und Inhalt.

Mit welchen Seiten fange ich an?

Mit den Seiten, auf denen Besucher etwas tun: Kontakt- oder Angebotsformular, die wichtigsten Leistungs- oder Produktseiten und die Navigation. Dort kostet jede Hürde direkt Anfragen oder Verkäufe.

Kurz zusammengefasst

Eine barrierefreie Website entsteht nicht durch einen Neubau, sondern auf einem gezielten Weg: Probleme erfassen, zuerst die Grundlagen beheben (Alternativtexte, Kontrast, Tastatur, Formularbeschriftungen), dann die strukturellen Punkte, und mit echten Menschen testen. Verankern Sie Barrierefreiheit in Designsystem, Komponenten, CMS und Prozess, halten Sie das Ergebnis in einer ehrlichen Erklärung fest und prüfen Sie bei jeder Änderung erneut. So erfüllen Sie nicht nur die Erwartungen rund um das BFSG, sondern gewinnen auch Besucher, die Sie heute still verlieren. Möchten Sie diesen Weg nicht allein gehen? Auf unserer Seite Website barrierefrei machen lesen Sie, wie wir Prüfung, Behebung und Erklärung übernehmen.

Nehmen Sie Kontakt auf

Kostenloser Website-Scan

Geben Sie Ihre Website ein und erhalten Sie innerhalb weniger Minuten eine automatische Analyse mit konkreten technischen und SEO-Verbesserungen. Ohne Verkaufsgespräch.

Wohin dürfen wir Ihren Bericht schicken?

Wir verwenden Ihre Daten ausschließlich für Ihren Scan. Kein Spam, Abmeldung jederzeit möglich.