Barrierefreiheit für Websites: Das ist ab 2025 Gesetz + Checkliste

Level:
Ergebnis anschauen
Icon für einen externen Link
Im Webflow Designer öffnen und klonen
Icon für einen externen Link
Im Webflow Designer öffnen und klonen
Icon für einen externen Link

In diesem Video erhältst du einen Überblick zum neuen Barrierefreiheitsstärkungsgesetz, das ab dem 28. Juni 2025 viele Unternehmen zur barrierefreien Gestaltung ihrer Websites, Apps und Onlineshops verpflichtet. Wir schauen uns an, wen das konkret betrifft, wie Klein- und Kleinstunternehmen damit umgehen sollten und warum barrierefreies Webdesign nicht nur Pflicht, sondern auch eine Chance ist. Außerdem erfährst du, welche Rolle Webflow spielen kann und worauf du als Webdesigner besonders achten solltest – von Kontrasten über Alt-Texte bis hin zur semantischen Struktur.

Barrierefreiheitsstärkungsgesetz: Was bedeutet das für dich?

Das neue Barrierefreiheitsstärkungsgesetz verpflichtet viele Unternehmen ab dem 28. Juni 2025, ihre digitalen Angebote barrierefrei zu gestalten. Das betrifft insbesondere größere Firmen mit mehr als zehn Mitarbeiterinnen und Mitarbeitern oder einem Jahresumsatz über zwei Millionen Euro. Kleinstunternehmen sind von dieser Pflicht ausgenommen, solange sie keine Produkte oder Dienstleistungen anbieten, die explizit vom Gesetz erfasst sind (z. B. Hardware-Terminals oder bestimmte E-Commerce-Dienste).

Mehr dazu findest du auf der IHK Seite von München.

Warum ist Barrierefreiheit wichtig?

Barrierefreies Webdesign bedeutet, Websites, Onlineshops und Apps so zu gestalten, dass sie Menschen mit Einschränkungen (z. B. Seh- oder Motorik-Einschränkungen) gleichermaßen nutzen können. Kontrastreiche Texte, Alt-Texte für Bilder und eine gute Tastaturbedienbarkeit sind nur einige Beispiele. Davon profitieren letztlich auch User ohne Einschränkungen, denn eine barrierearme Seite ist meist übersichtlicher und nutzerfreundlicher.

Wer muss sich jetzt kümmern?

Größere Unternehmen oder Firmen, die bestimmte betroffene Produkte und Services anbieten, sollten sich dringend damit befassen, wie sie ihre digitalen Angebote anpassen. Kleinere Betriebe mit weniger als zehn Beschäftigten oder unter zwei Millionen Euro Jahresumsatz fallen zwar laut Gesetz meist raus, doch Barrierefreiheit kann ein Qualitäts- und Wettbewerbsmerkmal sein – selbst wenn sie nicht verpflichtet sind.

Was solltest du als Webdesigner beachten?

Viele Aspekte der Barrierefreiheit lassen sich bereits standardmäßig in Webflow umsetzen. Das beginnt bei ausreichenden Kontrasten und semantischem HTML-Code und reicht bis zu Aria-Labels für Screenreader. Wenn du deine Projekte von Anfang an darauf ausrichtest, sicherst du dir nicht nur zufriedene Kunden, sondern beugst auch möglichen Abmahnungen oder Nachrüstungen vor.

Checkliste für Barrierefreiheit nach WCAG 2.1 AA (und teilweise AAA)

Diese Punkte geben dir einen klaren Leitfaden, um Websites barrierearm zu gestalten:

🔹 Wahrnehmbarkeit (Perceivable)

  • ✅ ALT-Texte für alle relevanten Bilder & Icons
  • ✅ Guter Text-Kontrast (mind. 4.5:1 für normalen Text, 3:1 für große Schrift)
  • ✅ Responsives Design & Zoom-Kompatibilität (bis 200% ohne Layout-Probleme)
  • ✅ Untertitel & Transkripte für Videos und Audios
  • ✅ Keine Texte in Bildern (ausgenommen Logo)

🔹 Bedienbarkeit (Operable)

  • ✅ Tastatur-Navigation möglich (Tab-Reihenfolge beachten)
  • ✅ Fokus-Indikatoren sichtbar (:focus für Buttons, Links, Formulare)
  • ✅ Keine „Hover-only“-Funktionen (Dropdowns auch per Tastatur bedienbar)
  • ✅ Klare Formular-Labels & Fehlermeldungen (keine Placeholder als Labels)
  • ✅ Keine Auto-Animationen oder Blinke-Effekte (max. 3 Blinks pro Sekunde)

🔹 Verständlichkeit (Understandable)

  • ✅ Einfache, klare Sprache (keine unnötig komplizierten Begriffe)
  • ✅ Konsistente Navigation & Design (Menüs, Buttons an gewohntem Platz)
  • ✅ Lesbare Schriftgrößen (mind. 16px, Zeilenhöhe ≥ 1.5em)
  • ✅ Eindeutige Button-Beschriftungen (statt „Hier klicken“ besser „Jetzt anmelden“)

🔹 Robustheit (Robust)

  • ✅ Semantisches HTML verwenden (h2, button, nav, etc. korrekt nutzen)
  • ✅ ARIA-Attribute nur wenn nötig (aria-label, role="alert")
  • ✅ Screenreader-Kompatibilität testen (NVDA, VoiceOver)
  • ✅ Formulare & Buttons ohne JavaScript nutzbar machen

So hilft dir das bei Formburg

Auf Formburg biete ich Kurse und Produkte rund um Webflow an, die dir dabei helfen, Barrierefreiheit effizient in deine Projekte zu integrieren. Wenn du dich an den WCAG 2.1 AA-Standards orientierst, sparst du dir aufwendige Nachbesserungen und sorgst gleichzeitig für ein hochwertiges Nutzererlebnis.

Deine nächsten Schritte

Wenn du für Kundinnen und Kunden Websites mit E-Commerce- oder Online-Diensten erstellst, lohnt sich ein genauer Blick auf die rechtlichen Anforderungen. So bist du schon jetzt gerüstet, wenn das Barrierefreiheitsstärkungsgesetz in Kraft tritt.