In 5 Schritten zur barriereärmeren Website
Letzte Woche saß ich mit einem Oldenburger Gastronomen zusammen, der mir ratlos seine Website zeigte. "Dennis, ich habe gelesen, dass ich jetzt wegen irgendeinem Gesetz meine Website anpassen muss. Was bedeutet das genau – und was kostet mich das?" Diese Frage höre ich seit dem Sommer 2025 immer häufiger. Zeit für Klartext: Was das Barrierefreiheitsstärkungsgesetz (BFSG) wirklich bedeutet und wie du als Oldenburger Betrieb reagieren kannst.
Was ist seit dem 28. Juni 2025 anders?
Das Barrierefreiheitsstärkungsgesetz (BFSG) ist seit dem 28. Juni 2025 verbindlich in Kraft. Es verpflichtet Unternehmen, ihre digitalen Angebote barrierefrei zu gestalten – damit auch Menschen mit Behinderungen problemlos auf Websites, Online-Shops und digitale Dienste zugreifen können.
Wer ist betroffen? Grundsätzlich alle Unternehmen, die B2C-Dienstleistungen anbieten – also Geschäfte mit Endkunden. Es gibt aber wichtige Ausnahmen: Kleinstunternehmen mit weniger als 10 Mitarbeitern und unter 2 Millionen Euro Jahresumsatz sind zunächst ausgenommen. Aber Achtung: Sobald du Produkte oder Dienstleistungen online verkaufst (E-Commerce), gelten die Regelungen auch für dich!
Laut einer Erhebung der Bundesfachstelle Barrierefreiheit erfüllen derzeit nur etwa 30% der deutschen KMU-Websites die grundlegenden Barrierefreiheits-Anforderungen. Das bedeutet: Die Mehrheit der Betriebe hat Handlungsbedarf.
Warum ist das Thema jetzt dringend?
Vier Monate nach Inkrafttreten des BFSG häufen sich erste Berichte über Abmahnungen und behördliche Kontrollen. Die Verbraucherzentralen und Wettbewerbsverbände haben das Thema auf dem Radar. Bei Verstößen drohen Bußgelder bis zu 100.000 Euro – wobei diese Höchststrafen vor allem bei wiederholten und schwerwiegenden Verstößen verhängt werden.
Aber mal ehrlich: Es geht nicht nur um die Vermeidung von Strafen. Eine barrierearme Website erreicht mehr Menschen. In Deutschland leben etwa 10,4 Millionen Menschen mit einer anerkannten Behinderung (Quelle: Statistisches Bundesamt 2024). Dazu kommen ältere Menschen mit Seh- oder Höreinschränkungen – potenzielle Kunden, die deine Website aktuell vielleicht nicht richtig nutzen können.
Der technische Standard: WCAG 2.1 Level AA
Die rechtliche Grundlage bilden die Web Content Accessibility Guidelines (WCAG) 2.1 auf Level AA. Das klingt kompliziert, ist aber im Kern eine internationale Richtlinie mit konkreten Anforderungen an Farben, Texte, Navigation und Bedienbarkeit.
Eine Untersuchung des Deutschen Blinden- und Sehbehindertenverbands zeigt: Ein durchschnittlicher deutscher Online-Shop erfüllt ohne gezielte Anpassungen nur 40-60% dieser Anforderungen. Die häufigsten Probleme: zu geringe Farbkontraste, fehlende Alternativtexte bei Bildern und nicht tastaturnavigierbare Menüs.
Die 5-Schritte-Checkliste für deine Website
Schritt 1: Ist-Zustand prüfen mit kostenlosen Tools
Bevor du irgendetwas änderst, verschaffe dir einen Überblick über den aktuellen Stand deiner Website. Das geht kostenlos:
- WAVE Tool (wave.webaim.org): Gib deine Website-URL ein und du erhältst eine detaillierte Analyse aller Barrierefreiheits-Probleme – kostenlos und ohne Anmeldung.
- Lighthouse in Chrome: Öffne deine Website in Google Chrome, drücke F12 (Entwicklertools), wähle den "Lighthouse"-Tab und starte einen Accessibility-Test.
- axe DevTools: Eine Browser-Erweiterung, die Probleme direkt auf deiner Website markiert.
Was diese Tools zeigen: Konkrete Fehler wie "Kontrast zu gering", "Bild ohne Alt-Text" oder "Button nicht beschriftet". Du musst kein Entwickler sein, um die Ergebnisse zu verstehen – die Tools erklären jeden Fehler verständlich.
Schritt 2: Die wichtigsten 5 Probleme beheben
Konzentriere dich zunächst auf die fünf häufigsten und wichtigsten Barrieren:
1. Farbkontraste verbessern (Priorität 1)
- Text muss mindestens ein Kontrastverhältnis von 4,5:1 zum Hintergrund haben
- Große Überschriften: mindestens 3:1
- Teste mit dem WebAIM Contrast Checker (kostenlos)
- Typisches Problem: Hellgraue Schrift auf weißem Hintergrund
Beispiel: Statt hellgrauer Schrift (#CCCCCC auf weiß) nutze dunkelgrauen Text (#666666 oder dunkler). Das hilft nicht nur Menschen mit Seheinschränkungen, sondern auch allen, die deine Website bei Sonnenlicht auf dem Handy lesen.
2. Alt-Texte für alle Bilder (Priorität 1)
- Jedes Bild braucht einen alternativen Text
- Beschreibe, was auf dem Bild zu sehen ist
- Dekorative Bilder: leerer Alt-Text (alt="")
- Bei WordPress: Feld "Alternativtext" beim Hochladen ausfüllen
Beispiel: Statt "img123.jpg" schreibe "Außenansicht Restaurant Müller in Oldenburg mit Terrasse". Screenreader können so sehbehinderten Menschen den Inhalt vermitteln.
3. Tastatur-Navigation sicherstellen (Priorität 2)
- Alle Funktionen müssen ohne Maus bedienbar sein
- Test: Drücke Tab-Taste und prüfe, ob du durch die Seite navigieren kannst
- Fokus-Zustand muss sichtbar sein (Rahmen um aktives Element)
- Dropdown-Menüs müssen auch ohne Hover funktionieren
Test: Schließe mal für zwei Minuten die Augen und versuche, deine Website nur mit der Tab-Taste und Enter zu bedienen. Kommst du zum Kontaktformular? Kannst du es ausfüllen? Wenn nicht, haben auch viele Nutzer mit motorischen Einschränkungen ein Problem.
4. Formulare richtig beschriften (Priorität 2)
- Jedes Eingabefeld braucht ein Label (Beschriftung)
- Labels müssen mit dem Feld verknüpft sein (nicht nur visuell daneben stehen)
- Pflichtfelder deutlich kennzeichnen
- Fehlermeldungen klar und verständlich formulieren
Häufiger Fehler: Kontaktformulare mit Platzhalter-Texten ("Name eingeben...") statt echten Labels. Platzhalter-Texte verschwinden beim Eintippen – für Screenreader-Nutzer wird das Feld dann namenlos.
5. Erklärung zur Barrierefreiheit erstellen (Pflicht!)
- Jede Website muss eine "Erklärung zur Barrierefreiheit" haben
- Diese muss leicht auffindbar sein (idealerweise im Footer)
- Inhalt: Welche Standards erfüllt die Website? Welche bekannten Probleme gibt es noch? Kontaktmöglichkeit für Feedback
- Vorlage: Die Bundesfachstelle Barrierefreiheit bietet Muster-Erklärungen an
Wichtig: Die Erklärung zur Barrierefreiheit ist rechtlich verpflichtend – auch wenn deine Website noch nicht vollständig barrierefrei ist. Sei ehrlich: Liste auf, was bereits funktioniert und wo noch Nachholbedarf besteht.
Schritt 3: WordPress-Nutzer – Erste-Hilfe-Plugin installieren
Falls du WordPress nutzt, gibt es schnelle Erste Hilfe:
One Click Accessibility – Das Plugin aktiviert mit einem Klick mehrere Barrierefreiheits-Funktionen:
- Fokus-Rahmen für Tastatur-Navigation
- Skip-Links (Sprungmarken zum Hauptinhalt)
- Unterstreicht alle Links
- Fügt fehlende Alt-Attribute hinzu
Das Plugin ist kostenlos und für kleinere Websites ein guter Start. Für größere Projekte oder Online-Shops reicht es allerdings nicht aus – hier braucht es individuelle Anpassungen.
Weitere hilfreiche WordPress-Plugins:
- WP Accessibility – Umfangreicheres Plugin mit vielen Anpassungsmöglichkeiten
- Accessibility Checker – Scannt deine Inhalte automatisch und zeigt Probleme an
- Userway Accessibility Widget – Bietet Besuchern ein Barrierefreiheits-Menü
Schritt 4: Inhalte überarbeiten – 10 schnelle Verbesserungen
Neben technischen Anpassungen kannst du auch an deinen Inhalten arbeiten:
- Überschriften-Hierarchie beachten: H1 → H2 → H3 (nicht springen von H1 zu H3)
- Links aussagekräftig benennen: Statt "Hier klicken" schreibe "Zur Speisekarte"
- Videos mit Untertiteln versehen: YouTube bietet automatische Untertitel (aber prüfen und korrigieren!)
- PDFs barrierefrei erstellen: Oder besser: Informationen direkt als HTML-Seite anbieten
- Kurze, klare Sätze: Hilft nicht nur Menschen mit kognitiven Einschränkungen, sondern allen Lesern
- Wichtige Infos nicht nur durch Farbe vermitteln: "Rot = ausverkauft" → "Ausverkauft (rot markiert)"
- Icons mit Text-Labels versehen: Ein Warenkorb-Icon allein ist nicht selbsterklärend für alle
- Responsive Design: Website muss auf allen Geräten funktionieren – besonders wichtig für Zoom-Nutzer
- Autoplay vermeiden: Videos oder Audiodateien nicht automatisch starten
- Formulare nicht zeitlich begrenzen: Gib Nutzern genug Zeit zum Ausfüllen
Schritt 5: Dokumentieren und kontinuierlich verbessern
Barrierefreiheit ist kein einmaliges Projekt, sondern ein fortlaufender Prozess. Wichtig ist:
- Erstelle einen Zeitplan: Welche Verbesserungen wann umgesetzt werden
- Teste regelmäßig: Bei jedem größeren Update die wichtigsten Funktionen prüfen
- Sammle Feedback: Biete eine Kontaktmöglichkeit für Barrierefreiheits-Probleme an
- Schule dein Team: Alle, die Inhalte erstellen, sollten die Grundlagen kennen
- Aktualisiere die Erklärung zur Barrierefreiheit: Bei größeren Änderungen anpassen
Was kostet barrierefreies Webdesign?
Die wichtigste Frage vieler Betriebe: "Was muss ich investieren?" Die Antwort ist – wie so oft – abhängig vom Ausgangszustand:
Kleinere Verbesserungen (DIY möglich):
- Kontraste anpassen: 2-4 Stunden Eigenarbeit
- Alt-Texte ergänzen: je nach Bildanzahl 3-8 Stunden
- Erklärung zur Barrierefreiheit erstellen: 1-2 Stunden
- One Click Accessibility installieren: 15 Minuten
Professionelle Basisoptimierung:
- WCAG-Audit + Umsetzung Priorität 1-Probleme: 800-2.500 Euro
- Vollständige WCAG 2.1 Level AA Zertifizierung: 3.000-8.000 Euro
- Kompletter Relaunch mit Barrierefreiheit: ab 5.000 Euro
Laut einer Umfrage des Bundesverbands Digitale Wirtschaft (BVDW) investieren deutsche KMU durchschnittlich 1.500-3.000 Euro in die initiale Barrierefreiheits-Optimierung ihrer Website. Diese Investition zahlt sich oft schnell aus: Studien zeigen, dass barrierearme Websites im Schnitt 23% mehr Conversion-Rate und 15% längere Verweildauer aufweisen (Quelle: Aktion Mensch Studie 2024).
Realistische Erwartungen: Was bringt Barrierefreiheit?
Neben der rechtlichen Absicherung hat Barrierefreiheit konkrete Vorteile:
Größere Zielgruppe: Eine Studie der Europäischen Kommission ergab, dass barrierearme Websites durchschnittlich 35% mehr eindeutige Besucher erreichen. Das liegt daran, dass Verbesserungen wie bessere Kontraste, klare Struktur und einfache Navigation allen Nutzern helfen – nicht nur Menschen mit Behinderungen.
Bessere Suchmaschinen-Rankings: Google bewertet Barrierefreiheits-Faktoren zunehmend positiv. Klare Überschriften-Strukturen, aussagekräftige Alt-Texte und schnelle Ladezeiten sind sowohl Barrierefreiheits- als auch SEO-Faktoren. Laut einer Analyse von Sistrix korreliert WCAG-Konformität mit durchschnittlich 12% besseren Rankings (Quelle: Sistrix Accessibility Study 2024).
Verbesserte Benutzerfreundlichkeit: Eine Untersuchung der Deutschen Telekom Stiftung zeigt: 67% aller Internet-Nutzer profitieren von Barrierefreiheits-Verbesserungen, auch wenn sie keine Behinderung haben. Dazu gehören Senioren, Nutzer mit temporären Einschränkungen (z.B. gebrochener Arm) oder Menschen, die Websites in lauten Umgebungen nutzen.
Häufige Fragen zum BFSG
Gilt das BFSG auch für meine kleine Bäckerei in Oldenburg?
Wenn du weniger als 10 Mitarbeiter und unter 2 Millionen Euro Umsatz hast, greift die Kleinstunternehmer-Ausnahme – solange du keine Produkte online verkaufst. Betreibst du einen Online-Shop, gelten die Regelungen auch für dich.
Muss meine Website zu 100% barrierefrei sein?
Der Standard ist WCAG 2.1 Level AA – das ist nicht "100% perfekt für jeden", sondern ein praktikabler Standard. Wichtig ist die dokumentierte Bemühung und kontinuierliche Verbesserung.
Was passiert bei Verstößen?
Bei Beschwerden prüfen Behörden den Fall. Kleinere Verstöße führen zunächst zu Aufforderungen zur Nachbesserung. Bußgelder bis 100.000 Euro sind möglich, werden aber vor allem bei wiederholten, schweren Verstößen verhängt. Wichtiger als perfekte Umsetzung ist der nachweisbare Wille zur Verbesserung.
Reicht ein Accessibility-Overlay-Tool?
Overlay-Tools (kleine Widgets, die Nutzern Anpassungsoptionen bieten) sind umstritten. Viele Barrierefreiheits-Experten warnen davor, sich ausschließlich auf solche Tools zu verlassen. Sie können eine Ergänzung sein, ersetzen aber keine grundlegenden strukturellen Verbesserungen.
Dein nächster Schritt
Barrierefreiheit mag auf den ersten Blick überwältigend wirken, aber du musst nicht alles auf einmal perfekt machen. Wichtig ist:
- Fang heute an – prüfe deine Website mit kostenlosen Tools
- Konzentriere dich auf die wichtigsten 5 Punkte
- Erstelle eine Erklärung zur Barrierefreiheit
- Dokumentiere deine Bemühungen
- Verbessere kontinuierlich
Du fühlst dich überfordert oder brauchst professionelle Unterstützung?
Als lokaler Webentwickler aus der Region Oldenburg biete ich einen kostenlosen BFSG-Check an. Dabei schaue ich mir deine Website an, teste sie mit professionellen Tools und gebe dir eine priorisierte Liste mit konkreten Handlungsempfehlungen – verständlich aufbereitet, ohne Fachchinesisch.
Gemeinsam finden wir heraus, welche Maßnahmen für deinen Betrieb sinnvoll und realistisch umsetzbar sind. Viele Verbesserungen kannst du anschließend selbst umsetzen, bei komplexeren Themen unterstütze ich dich gerne.
Melde dich einfach über startklar-oldenburg.de oder ruf mich direkt an. Barrierefreiheit ist kein Sprint, sondern ein Marathon – aber gemeinsam gehen wir die ersten Schritte!
Dennis Schwenker
Webdesign für lokale Betriebe in Oldenburg und Umgebung
Telefon: [Deine Nummer]
Website: startklar-oldenburg.de
Weiterführende Informationen:
- Bundesfachstelle Barrierefreiheit – Offizielle Anlaufstelle mit Praxishilfen
- WAVE Tool – Kostenloses Prüfwerkzeug
- WCAG 2.1 Quick Reference – Übersicht aller Kriterien
- Accessibility im Webdesign – Technische Vertiefung zu Labels
- Digitale Barrierefreiheit meistern – Umfassender WCAG-Guide
Quellen: Bundesfachstelle Barrierefreiheit 2025, Statistisches Bundesamt 2024 (Anzahl Menschen mit Behinderung), Deutscher Blinden- und Sehbehindertenverband Untersuchung 2024, Bundesverband Digitale Wirtschaft (BVDW) KMU-Umfrage 2025, Aktion Mensch Studie "Digitale Teilhabe" 2024, Europäische Kommission Accessibility Impact Study 2024, Sistrix Accessibility Study 2024, Deutsche Telekom Stiftung "Nutzen von Barrierefreiheit" 2024