Barrierefreie Websites Barriefreies Webdesign

Barrierefreiheit für alle – Ihr Vorteil und Ihre Verantwortung

Barrierefreie Internetauftritte gewinnen immer mehr an Bedeutung – nicht nur durch gesetzliche Vorgaben wie das Barrierefreiheitsstärkungsgesetz (BFSG), sondern auch durch den Anspruch, allen Menschen ein uneingeschränktes Nutzererlebnis zu bieten. Mit einer barrierefreien Website schaffen Sie Vertrauen, erweitern Ihre Zielgruppe und sichern sich langfristig Wettbewerbsvorteile.

Verbessertes Nutzererlebnis
Höhere Reichweite
Rechtliche Sicherheit
Schnelles Angebot
Google Bewertungen
Monitor der zwei Menschen beim Coaching zeigt
Stichtag 28. Juni 2025

Wann muss meine Website barrierefrei sein?

Nach dem Barrierefreiheitsstärkungsgesetz (BFSG) müssen viele Unternehmen ihre Websites spätestens zum 28. Juni 2025 barrierefrei gestalten. Das betrifft vor allem Firmen, die digitale Dienstleistungen für Verbraucher*innen anbieten, wie zum Beispiel Online-Shops, Finanzservices, Buchungsportale oder Telekommunikationsangebote.

Was ist mit Kontakt- oder Buchungsformularen?

Grundsätzlich gilt: Sobald Ihre Seite Funktionen anbietet, die Menschen aktiv zur Kommunikation oder Transaktion nutzen (z. B. Kontaktformulare, Terminbuchungen, Anfragen), fällt sie eher in den Bereich der barrierefreiheitsrelevanten Angebote. Auch Termin-Buchungssysteme für Friseursalons, Arztpraxen oder Restaurants können unter das Gesetz fallen, wenn sie öffentlich zugänglich und für Verbraucher*innen gedacht sind.

Für wen gibt es Ausnahmen?

Kleinstunternehmen (weniger als 10 Mitarbeitende und unter 2 Millionen Euro Jahresumsatz) können in der Regel ausgenommen sein, wenn die Umsetzung für sie eine unverhältnismäßige Belastung darstellt.

Mittlere Unternehmen (weniger als 50 Mitarbeitende und unter 10 Millionen Euro Jahresumsatz) können bei Nachweis einer unverhältnismäßigen Belastung ebenfalls einige Anforderungen umgehen, müssen dies aber begründet erklären.

Einen schnellen „Betroffenheits-Check“ können Sie hier durchführen:
bfsg-gesetz.de/check/

Empfehlung: elbst wenn eine Ausnahme greift, lohnt sich Barrierefreiheit aus Nutzerfreundlichkeits-, Image- und SEO-Gründen für (fast) jedes Unternehmen.

Marco Bosse
Marco Bosse, Mediengestalter, Medienfachwirt (IHK), 20 Jahre Erfahrung
Ich berate Sie gern.

Beispiele aus der Praxis

Friseurbetrieb

  • 5 Mitarbeitende:
    Bietet zwar eine Online-Terminbuchung an, fällt aber unter die Grenze von 10 Mitarbeitenden und unter 2 Mio. Euro Umsatz. Daher nicht verpflichtet, die Webseite barrierefrei zu gestalten (theoretisch möglich, aber gesetzlich nicht vorgeschrieben).
  • 12 Mitarbeitende:
    Gleicher Service (Terminbuchung), jedoch mehr als 10 Mitarbeitende. Hier muss die Webseite barrierefrei sein.

Online-Shop

  • Kleines Unternehmen
    (unter 10 Mitarbeitende, Umsatz <2 Mio. Euro): Keine Pflicht zur Barrierefreiheit, sofern eine unverhältnismäßige Belastung plausibel gemacht werden kann.
  • Wachsender Online-Shop
    (z. B. 15 Mitarbeitende, Umsatz >2 Mio. Euro): Barrierefreie Gestaltung ist Pflicht, damit alle Kund*innen ohne Einschränkungen einkaufen können.

Restaurant mit Reservierungssystem

  • Kleiner Familienbetrieb
    (8 Mitarbeitende, Umsatz <2 Mio. Euro): Muss im Normalfall keine barrierefreie Website anbieten, solange es sich nicht um eine große Plattform handelt oder branchenspezifische Regeln greifen.
  • Größeres Lokal
    (25 Mitarbeitende, Jahresumsatz deutlich über 2 Mio. Euro): Das Online-Reservierungssystem muss barrierefrei aufgebaut sein (z. B. gut zugängliche Formulare, ausreichende Kontraste).
Richtlinien

Welchen Standard muss Ihre Website erfüllen?

WCAG-Richtlinien:

Die Web Content Accessibility Guidelines (WCAG) beschreiben, wie Webinhalte gestaltet werden müssen, damit alle Nutzer*innen – auch Menschen mit Seh- oder motorischen Einschränkungen – die Website problemlos bedienen können. Die WCAG 2.1 bestehen aus drei Konformitätsstufen: A, AA und AAA. In der Regel verlangen gesetzliche Vorgaben, etwa im Barrierefreiheitsstärkungsgesetz (BFSG), mindestens die Einhaltung der Stufe AA. Das bedeutet, dass sowohl die grundlegenden Anforderungen der Stufe A als auch die erweiterten Kriterien der Stufe AA erfüllt sein müssen.

EN 301 549:

Die europäische Norm EN 301 549 bildet den technischen Rahmen für barrierefreie digitale Produkte. Sie basiert zu großen Teilen auf den WCAG und konkretisiert zusätzliche Anforderungen für Software, Apps und weitere digitale Anwendungen.

Gesetzliche Vorgaben (BFSG):

Das Barrierefreiheitsstärkungsgesetz (BFSG) verweist auf die genannten Standards. Für Websites bedeutet dies konkret:

  • Die WCAG 2.1 müssen eingehalten werden, in der Regel mindestens auf Konformitätsstufe AA.
  • Es sind auch die zusätzlichen Anforderungen der EN 301 549 zu berücksichtigen, sofern diese über die WCAG hinausgehen.

Wichtig:

Die Einhaltung dieser 50 Regeln kann nicht allein durch Plugins oder automatisierte Tests erreicht werden – eine manuelle Überprüfung und Feinabstimmung sind unabdingbar.

Diese Kombination aus WCAG 2.1 (Stufe AA) und EN 301 549 gewährleistet, dass Ihre Website den wesentlichen Barrierefreiheitsanforderungen entspricht.

Zwei Menschen besprechen sich vor einem Computermonitor

Anforderungen umsetzen

Als Webdienstleister helfen ich Ihnen gerne dabei, diese Anforderungen zu erfüllen. Ich prüfe Ihre Website nach den WCAG-Kriterien, verbesser die Zugänglichkeit (z. B. durch klare Navigation, verständliche Texte, ausreichende Farbkontraste) und sorge dafür, dass alle technischen und gestalterischen Aspekte barrierefrei gestaltet sind. Auf diese Weise stellen wir sicher, dass Sie nicht nur gesetzlichen Vorgaben gerecht werden, sondern Ihren Kunden auch ein optimales Nutzungserlebnis bieten.

Barrierefreie Maßnahmen

Welche konkreten Maßnahmen machen meine Website barrierefrei?

Damit Ihre Website nicht nur gut aussieht, sondern auch von allen Menschen problemlos genutzt werden kann, sind einige technische und gestalterische Anpassungen nötig. Barrierefreie Maßnahmen sorgen dafür, dass Besucher mit unterschiedlichsten Bedürfnissen – z. B. bei eingeschränktem Sehen, Hören oder in der Motorik – ohne Hürden auf alle Inhalte und Funktionen zugreifen können. Hier sind die wichtigsten Schritte, um Ihre Website an die geltenden Anforderungen anzupassen und ein positives Nutzererlebnis für alle zu gewährleisten.

Ein Mann sitzt am Schreibtisch. Auf dem schreibtisch steht ein Computer. Der Mann hat eine dicke Brille auf.

Kontrastreiche Gestaltung

Farben und Schriftgrößen sollten so gewählt sein, dass Texte und Grafiken gut erkennbar sind und mindestens ein Kontrastverhältnis von 4,5:1 erreicht wird. So können auch Personen mit eingeschränktem Sehvermögen Inhalte problemlos wahrnehmen.

Alternativtexte für Bilder

Bilder und Grafiken sollten mit Alternativtexten (Alt-Texten) versehen sein, damit Screenreader die Inhalte wiedergeben können. Auf diese Weise stehen allen Nutzer*innen die gleichen Informationen zur Verfügung.

Tastaturbedienung sicherstellen

Alle Funktionen der Website müssen ohne Maus nutzbar sein. Das beinhaltet eine klare Fokus-Reihenfolge und gut sichtbare Markierungen, wenn über die Tastatur (z. B. Tab-Taste) zwischen Elementen navigiert wird.

Klare Struktur und Navigation

Überschriften, Absätze und Menüs sollten logisch und hierarchisch aufgebaut sein (H1, H2, H3 usw.), damit sich Besucher*innen schnell orientieren können. Eine konsistente Struktur erleichtert das Verständnis und die Bedienung.

Barrierefreie Formulare

Formulare sind mit eindeutigen Beschriftungen (Labels) sowie verständlichen Fehlermeldungen zu versehen. Dies ermöglicht eine einfache und intuitive Interaktion, unabhängig von technischen Hilfsmitteln.

Untertitel und Audiodeskriptionen

Videos sollten mit Untertiteln ausgestattet werden, damit Personen mit Hörbeeinträchtigungen den Inhalt verfolgen können. Bei reinen Audio-Inhalten (z. B. Podcasts) empfiehlt sich die Bereitstellung von Transkripten oder Zusammenfassungen.

Einfache und klare Sprache

Kurze Sätze, leicht verständliche Worte und der Verzicht auf unnötigen Fachjargon steigern die Lesbarkeit. Eine leicht zugängliche Sprache hilft, Inhalte schnell zu erfassen.

Responsive Design

Die Darstellung muss auf unterschiedlichen Endgeräten (Smartphone, Tablet, Desktop) übersichtlich bleiben. Buttons, Menüs und Schriften sollten sich flexibel anpassen, ohne an Bedienbarkeit zu verlieren.

Vermeidung von Barrieren bei Interaktionen

Captchas oder vergleichbare Überprüfungsmethoden können für Screenreader nicht lesbar sein. Barrierefreie Alternativen oder vereinfachte Methoden verhindern, dass Nutzer*innen ausgesperrt werden.

Regelmäßige Tests

Mithilfe automatisierter Prüftools (z. B. WAVE, Axe, Lighthouse) und Screenreader-Tests lässt sich der Barrierefreiheitsstatus messen. Feedback von Personen mit Behinderung bietet zudem praxisnahe Einblicke und hilft, eventuelle Schwachstellen zu erkennen.

Wie prüfen?

Wie lässt sich der Status einer Website bezüglich Barrierefreiheit überprüfen?

Automatisierte Tools bieten eine schnelle Übersicht und zeigen viele typische Barrieren.
Einige Aspekte, insbesondere die Nutzbarkeit mit Tastatur und Screenreader, müssen manuell getestet werden, um ein vollständiges Bild zu bekommen.

Automatische Prüfung
Empfehlenswerte Tools

WAVE (Web Accessibility Evaluation Tool)

  • https://wave.webaim.org/
  • Bietet eine Online-Version (wave.webaim.org) und Browser-Erweiterungen.
  • Zeigt Fehler und Warnungen direkt im Seitenlayout an, z. B. fehlende Alt-Texte oder Probleme mit Kontrasten.

axe (Deque Systems)

  • https://www.deque.com/axe/
  • Als Browser-Erweiterung (Chrome/Firefox) oder CLI-Tool verfügbar.
  • Prüft nach WCAG-Kriterien und kennzeichnet problematische Code-Stellen.

Lighthouse (Google)

Accessibility Insights (Microsoft)

  • https://accessibilityinsights.io/
  • Bietet sowohl schnelle Checks als auch Schritt-für-Schritt-Guides für ausführlichere Prüfungen.
  • Verfügbar als Browser-Erweiterung und Desktop-App.

Manuelle Überprüfungen –
ergänzend zu den Tools

Screenreader-Kompatibilität

  • Mithilfe von NVDA (Windows), VoiceOver (macOS/iOS) oder TalkBack (Android) testen, wie gut sich durch die Website navigieren lässt.
  • Prüfen, ob Überschriften, Links und Formularfelder sinnvoll beschriftet sind.

Tastaturbedienung

  • Ohne Maus per Tab-Taste durch die Seite navigieren und sicherstellen, dass jede Funktion erreichbar ist und die Fokusreihenfolge stimmt.
  • Überprüfen, ob sichtbare Fokusrahmen vorhanden sind und Buttons/Links eindeutig erkennbar bleiben.

Farben und Kontraste

  • Auch wenn Tools erste Hinweise geben, ist eine manuelle Sichtkontrolle sinnvoll. Dabei sollten Schrift- und Hintergrundfarben an verschiedenen Stellen (z. B. Buttons, Fließtext, Überschriften) überprüft werden.

Formularfelder und Fehlerhinweise

  • Felder ausfüllen, absichtlich fehlerhafte Eingaben tätigen und beobachten, wie Fehlermeldungen ausgegeben werden.
  • Prüfen, ob Labels und Hilfetexte verständlich sind und ob Screenreader sie korrekt ausgeben.

Alternative Inhalte

  • Durchsicht sämtlicher Bilder, Diagramme und Videos auf sinnvolle Alternativbeschreibungen.
  • Bei eingebetteten Videos oder Audiodateien sollte ein Untertitel oder Transkript vorhanden sein.

Klare und einfache Sprache

Texte lesen und bewerten, ob Inhalte ohne Vorwissen verständlich sind. Fachbegriffe ggf. erklären oder sparsam einsetzen.

Vorteile

Welche Vorteile hat eine barrierefreie Homepage?

Erreichbarkeit für alle Nutzer*innen

Durch den Abbau von Hürden können auch Menschen mit Behinderungen oder temporären Einschränkungen (z. B. gebrochenem Arm, Sehhilfen) die Website nutzen. Das erhöht die Gesamtzahl potenzieller Besucher und Kunden.

Positiver Einfluss auf SEO

Eine saubere Struktur, verständliche Inhalte und sinnvolle Alternativtexte sorgen dafür, dass Suchmaschinen die Seite besser indexieren können. Barrierefreie Websites sind in der Regel technisch aufgeräumt und profitieren von einem besseren Ranking.

Verbesserte Nutzerfreundlichkeit

Klare Navigation, eindeutige Beschriftungen und gut lesbare Texte erleichtern allen Menschen den Umgang mit der Seite. Barrierefreie Maßnahmen steigern somit die allgemeine Benutzerfreundlichkeit – unabhängig von Behinderungen.

Imagegewinn und soziale Verantwortung

Ein barrierefreier Webauftritt zeigt, dass das Unternehmen sich um alle Nutzer kümmert. Das fördert ein positives Markenimage und ist ein klares Statement für Inklusion und Vielfalt.

Rechtssicherheit

Spätestens ab Juni 2025 (BFSG) sind viele Unternehmen gesetzlich verpflichtet, ihre Angebote barrierefrei zu gestalten. Wer frühzeitig reagiert, vermeidet potenzielle Bußgelder, rechtliche Konsequenzen und Abmahnungen.

Marco Bosse

Kontaktieren
Sie mich gerne

Frage oder Angebot?

Schnelle Rückmeldung

    Kontaktdaten:




    Nachricht:

    FAQ – Fragen zu barrierefreien Internetseiten

    Muss ich auch bestehende Dokumente (z. B. PDFs) barrierefrei gestalten?

    Ja, wenn Dokumente wie PDFs Teil des öffentlichen Angebots sind, sollten sie ebenfalls barrierefrei zugänglich sein. Das bedeutet unter anderem:

    • Sinnvolle Überschriftenstruktur und Lesereihenfolge.
    • Alternativtexte für Bilder oder Grafiken.
    • Eingebettete Schriftarten (Fonts) und beschreibende Links.

    Wer neu erstellt, sollte gleich auf Barrierefreiheit achten. Ältere Dokumente lassen sich oft mit speziellen Programmen oder einem Nachbearbeitungsprozess optimieren. Der Aufwand variiert je nach Dokumentenanzahl und -komplexität.

    Sind auch Videos und Audioinhalte betroffen?

    Ja, audiovisuelle Inhalte gehören ebenfalls dazu. Damit Menschen mit Hör- oder Sehbeeinträchtigungen die Inhalte vollumfänglich nutzen können, sind folgende Maßnahmen relevant:

    • Untertitel für Videos, damit Dialoge und relevante Geräusche verständlich sind.
    • Audiodeskriptionen für Personen mit Sehbeeinträchtigungen, zumindest für Videos mit wichtigen visuellen Informationen (z. B. bei Erklärvideos).
    • Transkripte oder Zusammenfassungen bei reinem Audiomaterial (z. B. Podcasts).

    Der Umfang der Anpassungen hängt vom Einsatzzweck und der Bedeutung der Inhalte ab. In manchen Fällen sind einfache Untertitel oder ein zusammenfassendes Textdokument ausreichend, in anderen Situationen wird eine ausführlichere Audiodeskription benötigt.

    Was kostet es, eine Website barrierefrei zu machen?

    Die Kosten hängen stark vom Umfang der Website und dem aktuellen Status ab. Eine kleine Seite mit wenigen Unterseiten lässt sich oft mit überschaubarem Aufwand anpassen (z. B. Farben, Kontraste, Alternativtexte). Bei größeren Portalen oder Webshops kann es nötig sein, umfassendere technische und inhaltliche Maßnahmen zu ergreifen (z. B. Umbau der Navigation, Überarbeitung von PDFs und Videos), was entsprechend mehr Zeit und Budget erfordert. Eine grobe Schätzung kann nur nach einer ersten Analyse der bestehenden Seite erfolgen.

    Schreiben Sie mich einfach an. Ich mach Ihnen ein passendes Angebot.