Sei ein Teil der APP VISION 2026! Zur Umfrage

Logo der App Agentur Hybrid Heroes
Logo der App Agentur Hybrid Heroes

Barrierefreie App-Entwicklung – Inklusive Apps für alle Nutzer entwickeln

Das Ziel von barrierefreier App-Entwicklung ist es, digitale Anwendungen zu erstellen, die für alle Menschen zugänglich sind – unabhängig von Behinderung, Alter oder körperlichen Einschränkungen. In unserer mobilen Welt ist Accessibility kein „nice-to-have“ mehr, sondern ein Muss. Nicht nur aus ethischen Gründen – jeder Nutzer verdient ein hervorragendes Erlebnis – sondern auch aufgrund gesetzlicher Vorgaben wie dem European Accessibility Act 2025.

Partner und Partnerinnen die uns vertrauen
Helios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz LogoHelios LogoBomag LogoImmocloud LogoKieback&Peter LogoPhywe LogoSpringer Medizin LogoStrabag Logorbb LogoLeasingMarkt.de LogoSchweizerisches Rotes Kreuz LogoMalteser LogoSpar LogoSternburg LogoUZH Zurich LogoTU Berlin LogoADAC LogoFreie Universität Berlin LogoInsiders LogoCharite LogoSwecon LogoTaz Logo

Warum ist Barrierefreiheit bei Apps wichtig?

Laut einer Schätzung von Eurostat leben 27% aller Europäer über 16 Jahren mit einer Behinderung (Quelle). Dies entspricht einer Gruppe von ca. 101 Millionen Menschen. Hierzu zählen z.B. blinde oder sehbehinderte Personen, Gehörlose, Menschen mit motorischen Einschränkungen oder kognitiven Beeinträchtigungen. 

Es handelt sich also nicht um eine Randgruppe, die berücksichtigt werden sollte, um das Image einer Firma aufzubessern, sondern es macht auch aus handfesten wirtschaftlichen Gründen absolut Sinn, Barrierefreiheit als einen zentralen Pfeiler bei der App-Entwicklung zu betrachten. 

Auch gilt zu bedenken, dass letztendlich alle App-Nutzer von einem barrierefreien App Entwicklungsansatz profitieren: eine bessere Usability, ein intuitives und klares App UX/UI Design und die Unterstützung von Bedienungshilfen kommen auch Nutzer:innen ohne Behinderung zugute. Die Möglichkeit, Untertitel in lauter Umgebung optional in ein Video einblenden zu können, oder die Schriftgrößen einer App flexibel anpassen zu können, sind auch für nicht beeinträchtigte Nutzer von Vorteil.

 

People ignore design that ignores people.
Frank Chimero

Rechtliche Vorgaben zur Barrierefreiheit von digitalen Produkten für öffentliche Einrichtungen und Behörden

In Deutschland und der EU ist digitale Barrierefreiheit gesetzlich verankert. In Deutschland verpflichtet das Behindertengleichstellungsgesetz (BGG) öffentliche Stellen und Einrichtungen, ihre Websites und Apps barrierefrei zu gestalten. Konkretisiert wird dies durch die Barrierefreie-Informationstechnik-Verordnung (BITV 2.0), die für Behörden bindende Kriterien (basierend auf WCAG 2.1 AA) festlegt.

Das Europäische Barrierefreiheitsstärkungsgesetz: Was ab Juni 2025 auf private Unternehmen zukommt

Für private Unternehmen und Start-ups in Deutschland und innerhalb der EU ändert sich die Rechtslage in diesem Jahr: Am 28. Juni 2025 tritt das Europäische Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft. Dieses Gesetz setzt die EU-Richtlinie (European Accessibility Act) um und schreibt vor, dass: Apps und Websites, die Dienstleistungen in Bereichen wie E-Commerce, Reisedienste, Verkehr, Banking, oder visuelle Medien anbieten und die mehr als 2 Mio. Euro Umsatz machen und mehr als 10 Mitarbeiter:innen haben, zwingend barrierefrei sein müssen (WCAG 2.1 AA-konform). Verstöße können zu erheblichen Bußgeldern von bis zu 100.000 € führen.

Person verwendet eine barrierefreie App

Was Sie jetzt tun können um sicherzustellen dass Ihre App Barrierefrei ist

Bei Hybrid Heroes haben wir die Barrierefreiheit schon immer als Teil unseres UX/UI-Designprozesses betrachtet. Wir orientieren uns an den WCAG-Richtlinien und streben für jede digitale Anwendung das AA-Niveau an, das ab 2025 obligatorisch sein wird.

Durch unsere Erfahrung mit der Gestaltung und Entwicklung barrierefreier Produkte können wir Ihnen helfen, sicherzustellen, dass Ihr Dienst die Zugänglichkeitsstandards erfüllt. 

Unsere Leistungen im Überblick: 

  • Einschätzung des aktuellen Standes und des erforderlichen Handlungsbedarfs
  • Überprüfung der Barrierefreiheit Ihrer bestehenden App oder Website einschließlich aller Download Dateien, Videos und Audio-Dateien
  • Analyse Ihres Styleguides in Hinblick auf Barrierefreiheit
  • Erstellung eines Berichts mit den Prüfergebnissen und konkreten Empfehlungen
  • Begleitung bei der Umsetzung der Optimierungsmaßnahmen
  • Erarbeitung von Guidelines
  • Unterstützung bei der Schulung Ihrer Mitarbeiter:innen und Redakteur:innen

Was macht eine Mobile-App oder Web-App nach WCAG barrierefrei?

Wahrnehmbarkeit

Alt key
Alt key

Text-Alternative

Bereitstellung einer Textalternative für alle Nicht-Text-Inhalte.

Media Icon
Media Icon

Medien

Bereitstellung von Untertitel sowie Alternativen zu Video-/Audioinhalten.

Anpassungsfähigkeit Icon
Anpassungsfähigkeit Icon

Anpassungsfähig

Präsentation von Inhalten in einer sinnvollen Reihenfolge sowie die Verwendung von mehr als einem Sinn für Anweisungen.

Unterscheidbar Icon
Unterscheidbar Icon

Unterscheidbar

Audio und Animationen sollten nicht automatisch abgespielt werden. Texte und icons haben genügend Farbkontrast und können bis zu 200% vergrößert werden.

Bedienbarkeit

Keyboard Icon
Keyboard Icon

Tastaturzugänglichkeit

Web-Apps sollten mit Tastaturbefehle bedient werden können und Nutzer:innen nicht in eine Sackgasse geführen.

Uhr Icon
Uhr Icon

Ausreichend Zeit

Benutzungssteuerung für zeitlich begrenzte Inhalte bereitstellen.

Sicherstellung Icon
Sicherstellung Icon

Sicherstellung

Kein Inhalt blinkt mehr als 3 Mal pro Sekunde.

Navigierbar Icon
Navigierbar Icon

Navigierbar

Möglichkeit zum Überspringen von Inhalten und Unterstützung einer logischen Navigation und Reihenfolge.

Nachvollziehbarkeit und Stabilität

Lesbarkeit Icon
Lesbarkeit Icon

Lesbar

Angabe der Sprache von einzelnen Seiten.

Vorhersehbar Icon
Vorhersehbar Icon

Vorhersehbar

Elemente sollten sich nicht ändern wenn sie einen Fokus oder Einagben erhalten.

Barrierefreiheit Icon
Barrierefreiheit Icon

Unterstützung bei der Eingabe

Eingabefehler klar erkennen, bzw. Elemente beschriften und Anweisungen geben.

Entwicklung Icon
Entwicklung Icon

Kompatibel

Um die Erfolgskriterien zu erfüllen, werden nur Technologien genutzt, die barrierefrei sind.

FAQ – Barrierefeie App Entwicklung und Design

Falls Sie noch Fragen haben, finden Sie hier die wichtigsten Antworten zusammengefasst.

Was ist Barrierefreiheit in der App-Entwicklung?

plus
plus

Barrierefreiheit in der App-Entwicklung bedeutet, digitale Inhalte und Funktionen so zu gestalten, dass sie für alle Benutzer:innen zugänglich sind, einschließlich Menschen mit Behinderungen. Dies umfasst die Berücksichtigung von visuellen, auditiven, motorischen und kognitiven Einschränkungen, um eine gleichberechtigte Nutzung der App zu gewährleisten.

Warum ist Barrierefreiheit wichtig?

plus
plus

Barrierefreiheit ist wichtig, um allen Menschen, unabhängig von ihren körperlichen oder geistigen Fähigkeiten, den Zugang zu Informationen und Dienstleistungen zu ermöglichen. Es ist nicht nur eine ethische Verpflichtung, sondern kann auch gesetzlich vorgeschrieben sein. Darüber hinaus erweitert barrierefreie Gestaltung die potenzielle Nutzerbasis und verbessert das Gesamterlebnis für alle Benutzer:innen.

Welche Richtlinien gibt es für barrierefreies Design?

plus
plus

Die wichtigsten Richtlinien für barrierefreies Design sind in den Web Content Accessibility Guidelines (WCAG) zusammengefasst. Diese Richtlinien bieten einen umfassenden Rahmen für die Gestaltung zugänglicher Inhalte. Sie sind in drei Konformitätsstufen unterteilt: A, AA und AAA, wobei AA die empfohlene Stufe für die meisten Anwendungen darstellt.

Was sind einige grundlegende Prinzipien des barrierefreien Designs?

plus
plus

Einige grundlegende Prinzipien des barrierefreien Designs sind:

  • Wahrnehmbarkeit: Inhalte und Bedienelemente sollten für alle Sinne zugänglich sein.
  • Bedienbarkeit: Die Navigation und Interaktion mit der App sollte einfach und intuitiv sein.
  • Verständlichkeit: Die Informationen und das Design sollten klar und leicht verständlich sein.
  • Robustheit: Inhalte sollten auf einer Vielzahl von Geräten und Technologien, einschließlich Hilfstechnologien, zuverlässig funktionieren.

Wie können Farben und Kontraste barrierefrei gestaltet werden?

plus
plus

Für ein barrierefreies Design sollten ausreichende Kontrastverhältnisse zwischen Text und Hintergrund sichergestellt werden. WCAG empfiehlt ein Mindestkontrastverhältnis von 4,5:1 für normalen Text und 3:1 für großen Text. Farben sollten nicht die einzige Methode zur Informationsvermittlung sein, da Personen mit Farbsehschwächen Schwierigkeiten haben können, diese zu unterscheiden.

Welche Tools können helfen, die Barrierefreiheit einer App zu testen?

plus
plus

Es gibt verschiedene Tools, um die Barrierefreiheit zu testen, darunter:

  • Screenreader: Zum Testen der Bedienung durch sprachliche Wiedergabe, z.B. VoiceOver (iOS), TalkBack (Android).
  • Kontrastprüfer: Um die Kontrastverhältnisse zu überprüfen, z.B. WebAIM Contrast Checker.
  • Automatisierte Test-Tools: Tools wie WAVE oder Lighthouse können helfen, potenzielle Barrieren automatisch zu identifizieren.

Was sind gängige Barrieren in Apps und wie können sie vermieden werden?

plus
plus

Gängige Barrieren umfassen unzureichende Beschriftungen für Bedienelemente, fehlende Tastaturnavigation, unzureichender Farbkontrast und komplexe Navigationsstrukturen. Diese können vermieden werden, indem man von Anfang an barrierefreie Praktiken in den Entwicklungsprozess integriert, regelmäßige Tests durchführt und Feedback von Nutzer:innen mit Behinderungen einholt.

Wie kann man sicherstellen, dass eine App für Menschen mit Sehbehinderungen zugänglich ist?

plus
plus

Um eine App für Menschen mit Sehbehinderungen zugänglich zu machen, sollten Entwickler:innen:

  • Textalternativen für Bilder und grafische Inhalte bereitstellen.
  • Eine konsistente und verständliche Struktur sowie klare Beschriftungen verwenden.
  • Sicherstellen, dass die App vollständig mit Screenreadern kompatibel ist.
  • Visuelle Informationen auch auditiv oder durch haptisches Feedback vermitteln.

Was sollte bei der Gestaltung von Benutzeroberflächen für Menschen mit motorischen Einschränkungen beachtet werden?

plus
plus

Bei der Gestaltung von Benutzeroberflächen für Menschen mit motorischen Einschränkungen sollten größere, leicht zu treffende Interaktionselemente (Buttons, Links) verwendet werden. Es sollte auch eine alternative Navigation ohne Maus, z.B. über die Tastatur, möglich sein. Zeitliche Beschränkungen für Eingaben sollten vermieden oder anpassbar sein.

Wie kann man sicherstellen, dass eine App für Menschen mit Hörbehinderungen zugänglich ist?

plus
plus

Für Menschen mit Hörbehinderungen sollten alternative Darstellungsformen von Audioinhalten bereitgestellt werden, wie z.B. Untertitel für Videos und visuelle oder textuelle Hinweise für akustische Signale. Auch sollte darauf geachtet werden, dass wichtige Informationen nicht ausschließlich durch Audio vermittelt werden.

Ist Barrierefreiheit gesetzlich vorgeschrieben?

plus
plus

Ja, in vielen Ländern gibt es Gesetze und Verordnungen, die Barrierefreiheit vorschreiben, wie z.B. das Americans with Disabilities Act (ADA) in den USA, die EU-Richtlinie über den barrierefreien Zugang zu Websites und mobilen Anwendungen öffentlicher Stellen (BFSG), und das Behindertengleichstellungsgesetz (BGG) in Deutschland. Diese Gesetze erfordern, dass digitale Inhalte und Dienste zugänglich gestaltet werden.

Wie integriert man Barrierefreiheit in den Entwicklungsprozess?

plus
plus

Barrierefreiheit sollte von Anfang an Teil des Entwicklungsprozesses sein. Dazu gehören:

  • Die Schulung des Teams in Bezug auf Barrierefreiheit.
  • Die Einbeziehung von Nutzer:innen mit Behinderungen in den Testprozess.
  • Die kontinuierliche Überprüfung und Anpassung der App auf Barrierefreiheit.
  • Die Verwendung von Tools und Technologien, die die Implementierung und Prüfung von Barrierefreiheit unterstützen.
Kontakt aufnehmen

Wir sind gespannt auf Ihr Projekt!

Sie möchten mit Ihrem Unternehmen oder Ihrer Organisation neue digitale Welten erschließen? Schreiben Sie uns eine Nachricht oder rufen Sie uns an! Wir melden uns innerhalb weniger Stunden zurück.