Webdesign
October 1, 2025
6 Minuten

Barrierefreie Websites:

Was sich ab 2025 ändert und warum es alle was angeht

Stell dir vor, du kommst in ein neues Café. Die Tür ist schmal, es gibt nur eine Treppe nach oben, die Speisekarte hängt in winziger Schrift an der Wand. Viele Gäste können das Café genießen, aber nicht alle. So ähnlich ist es mit vielen Websites heute: Für die meisten funktionieren sie gut, aber für Menschen mit Einschränkungen stellen sie oft unüberwindbare Hürden dar. Damit soll Schluss sein. Seit dem 28. Juni 2025 gilt in Deutschland das Barrierefreiheitsstärkungsgesetz (BFSG), das digitale Angebote verpflichtend barrierefrei macht.
Illustration einer großen orangefarbenen „Tab“-Taste, umgeben von kleineren grünen und rosa Tasten mit Pfeilen, auf blauem Hintergrund.

Was bedeutet das neue Gesetz?

Das Barrierefreiheitsstärkungsgesetz (BFSG) setzt die EU-Richtlinie „European Accessibility Act“ um. Ziel ist, dass digitale Produkte und Dienstleistungen für alle Menschen nutzbar sind, auch für Personen mit Seh-, Hör-, motorischen oder kognitiven Einschränkungen. Für Websites bedeutet das:

  • Ab dem 28. Juni 2025 müssen Online-Shops, Buchungsplattformen, digitale Services und viele weitere Angebote barrierefrei zugänglich sein.
  • Wer sich nicht daran hält, riskiert Bußgelder oder andere Auflagen.
  • Kleinstunternehmen mit weniger als 10 Beschäftigten oder unter 2 Mio. Euro Jahresumsatz sind oft ausgenommen, trotzdem lohnt sich Barrierefreiheit auch hier.

Betroffen sind damit fast alle, die digitale Dienstleistungen anbieten, also Onlineshops, Terminbuchungssysteme oder Kontakt- und Anmeldeformulare. Reine „Visitenkarten“-Seiten ohne Interaktion fallen in der Regel nicht darunter. Wichtig: Auch wenn du externe Tools oder Plugins einbindest, bleibst du als Betreiber verantwortlich. Du musst sicherstellen, dass diese barrierefrei nutzbar sind oder eine gleichwertige Alternative angeboten wird.

Hand-drawn blue chicken facing left, with a red comb, next to an orange speech bubble reading “alt-text: chicken looks left.”

Barrierefreiheit im Web funktioniert wie ein Puzzle: Erst wenn alle Elemente ineinandergreifen und jedes Teil für sich durchdacht ist, entsteht ein stimmiges und nutzbares Ganzes.

Illustration von vier ineinandergreifenden Puzzleteilen in Blau, Orange, Rosa und Hellgrün.

Worauf kommt es bei Barrierefreiheit an?

Die gute Nachricht: Es gibt klare Standards, an denen man sich orientieren kann. Vor allem die WCAG (Web Content Accessibility Guidelines). Dahinter stecken vier Grundprinzipien:

  • Wahrnehmbar – Inhalte müssen erkennbar sein, z. B. durch Alternativtexte für Bilder oder Untertitel für Videos.
  • Bedienbar Die Seite muss auch ohne Maus nutzbar sein (z. B. per Tastatur).
  • Verständlich Navigation, Sprache und Feedback müssen klar sein.
  • Robust Inhalte müssen mit Hilfsmitteln wie Screenreadern funktionieren.

Klingt abstrakt? Hier ein paar ganz konkrete Punkte:

  • Texte müssen genug Kontrast haben. Hellgrau auf weiß ist passé.
  • Alle Funktionen müssen per Tastatur steuerbar sein – Tabulator lässt grüßen.
  • Formulare brauchen klare Fehlermeldungen („Bitte geben Sie Ihre E-Mail-Adresse ein“ statt „Error 302“).
  • Bilder brauchen Alt-Texte.
  • Videos brauchen Untertitel.
  • Bewegte Inhalte müssen an- und ausschaltbar sein.
Illustration eines Farbkontrast-Prüf-Interfaces mit Hintergrundfarbe #f3ffaf (hellgelb) und Vordergrundfarbe #000000 (schwarz), Kontrastwert 19,73, alle WCAG-Level bestehen.

Wie testet man Barrierefreiheit?

„Einfach nur ‘Augen zu und durch’ funktioniert hier nicht. Barrierefreiheit braucht eine Kombination aus Technik und Praxis. Automatisierte Tools erkennen viele Probleme, aber echte Sicherheit gibt es nur durch manuelle Tests und Feedback. Konkret heißt das:

  • Automatisierte Tests mit Tools wie Lighthouse, WAVE oder axe – gut für schnelle Checks.
  • Tastaturbedienung ausprobieren – lässt sich die Seite komplett ohne Maus steuern?
  • Screenreader testen – zum Beispiel mit NVDA (Windows) oder VoiceOver (Mac/iPhone).
  • Zoom- und Skalierbarkeit prüfen – funktioniert die Seite auch bei 200 % Vergrößerung noch sauber?
  • Farb- und Kontrasttests – z. B. mit einfachen Online-Checkern.
  • Echte Nutzer:innen einbeziehen – Barrieren fallen im Alltag oft stärker auf als in der Theorie.

Dazu gehört auch die verpflichtende Erklärung zur Barrierefreiheit, in der du dokumentierst, welche Maßnahmen umgesetzt wurden, welche Barrieren noch bestehen und wie Nutzer:innen Probleme melden können. So wird Barrierefreiheit zu einem kontinuierlichen Prozess statt zu einer einmaligen Aufgabe.

Barrierefreiheit ist mehr als Pflicht. Sie macht deine Website für alle nutzbar, erweitert deine Reichweite, reduziert rechtliche Risiken und zeigt Verantwortung.

Barrierefreiheit beginnt jetzt

Barrierefreiheit im Web ist längst kein „nice to have“ mehr, sondern Pflicht. Seit Juni 2025 müssen viele Websites die gesetzlichen Anforderungen erfüllen. Wer erst spät damit beginnt, steht schnell unter Druck. Deshalb lohnt es sich, frühzeitig zu handeln: Barrierefreiheit gehört von Anfang an ins Design und in den Code, sie muss regelmäßig getestet und offen kommuniziert werden. Bei studio tülü, unserem Designstudio aus Hamburg und Dortmund, gehört dieser Anspruch längst selbstverständlich zum Gestaltungsprozess, weil gutes Design immer für alle nutzbar sein sollte. Am Ende geht es nicht nur um Gesetze und Fristen, sondern darum, dass wirklich alle Menschen das Internet nutzen können.

let’s talk about ...

Arrow Icon to the left in white
Arrow Icon to the right in white
Muster aus bunten Visitenkarten mit dem geprägten Logo „studio tülü“ auf pastelligen Hintergründen.
5 Minuten

Rebranding bei studio tülü - warum wir uns selbst neu erfunden haben

2024 sind wir mit einem spontanen, verspielten Branding gestartet. Ein Jahr später haben wir gemerkt: Wir sind unserem eigenen Auftritt entwachsen. Mit dem Rebranding haben wir uns ein Fundament geschaffen, das zu uns passt – klar, flexibel und erwachsen.
Arrow Icon to the right in black
Read the Article
3D-generierter surrealer quadratischer Tunnel aus Gras und Blumen mit einer schwebenden Suchleiste „A square shaped grass tunnel in sky“.
8 Minuten

Designer:in im Zeitalter der KI – ersetzt, überflüssig oder wertvoller denn je?

Design wird von KI verändert. Die entscheidende Frage lautet: Wie bleiben wir einzigartig in einer automatisierten Welt?
Arrow Icon to the right in black
Read the Article
Illustration einer großen orangefarbenen „Tab“-Taste, umgeben von kleineren grünen und rosa Tasten mit Pfeilen, auf blauem Hintergrund.
6 Minuten

Barrierefreie Websites: Was sich ab 2025 ändert und warum es alle angeht

Barrierefreies Webdesign ist längst kein Extra mehr, sondern der Maßstab für jede professionelle Website.
Arrow Icon to the right in black
Read the Article
Großes Werbeplakat auf einer Wiese mit dem Text „Can you make the logo bigger?“ in fetten schwarzen Buchstaben.
4 Minuten

Ein Logo allein macht noch keine Marke

Ein Logo ist nur der Anfang. Eine starke Marke braucht ein Fundament aus Strategie, Design und Kommunikation.
Arrow Icon to the right in black
Read the Article

Wir freuen uns, von dir zu hören.
Fülle  die Felder aus, damit wir mehr über dein Projekt erfahren können:

Hi, mein Name ist
und ich melde mich bezüglich
und ich melde mich bezüglich
einem
Projekt.
Ihr erreicht mich unter:
.
Hier noch ein paar weitere Details zu dem, was ich mir vorstelle:
Danke! Wir haben deine Nachricht erhalten.
Hoppla! Beim Absenden des Formulars ist etwas schief gelaufen.