Barrierefreiheit sorgt dafür, dass alle Menschen – unabhängig von ihren Fähigkeiten – mit deinen Inhalten interagieren können. Es geht darum, digitale Erlebnisse zu gestalten, die inklusiv und für alle nutzbar sind – auch für Menschen, die auf Screenreader, Tastaturnavigation oder andere unterstützende Technologien angewiesen sind.
Mit dem Inkrafttreten des European Accessibility Act (EAA) bzw. Barrierefreiheitsstärkungsgesetz (BFSG) am 28. Juni 2025 ist Barrierefreiheit nicht mehr nur eine Best Practice – für viele Unternehmen in der EU wird sie zur gesetzlichen Pflicht. Unabhängig von rechtlichen Anforderungen verbessert ein barrierefreies Design jedoch die Benutzerfreundlichkeit für alle, erweitert deine Zielgruppe und unterstreicht dein Engagement für Inklusion.
Dieser Artikel stellt zentrale Prinzipien der Barrierefreiheit sowie praktische Tipps vor, um deine Flows benutzerfreundlich und regelkonform zu gestalten. Der Fokus liegt auf dem EAA, aber die Empfehlungen orientieren sich auch an internationalen Standards wie den Web Content Accessibility Guidelines (WCAG) und dem Americans with Disabilities Act (ADA).
❗Hinweis: Dieser Artikel dient nur zu Informationszwecken und stellt keine Rechtsberatung dar. Heyflow ist kein juristischer Berater. Du bist selbst dafür verantwortlich, sicherzustellen, dass deine Flows den geltenden Barrierefreiheitsanforderungen entsprechen. Die folgenden Themen sind eine Auswahl und keine vollständige Liste aller Anforderungen.
Was Heyflow übernimmt
Viele technische Aspekte der Barrierefreiheit werden von uns im Hintergrund automatisch berücksichtigt:
Tastaturnavigation
Die meisten Blöcke unterstützen die Bedienung per Tastatur (z. B. Buttons und Formularfelder).
💡 Bald verfügbar: Verbesserte Navigation für Blöcke wie „Telefon“, „Multiple Choice“ und „Bildauswahl“.
Barrierefreier HTML-Code
Deine Seiten enthalten notwendige HTML-Elemente wie
<title>
und<html lang="">
.
❗Hinweis: Wenn du benutzerdefinierten Code in deinem Flow verwendest, können wir die Barrierefreiheit nicht garantieren – bitte teste gründlich.
Was in deiner Verantwortung liegt
Wir sorgen für die technische Grundlage – du gestaltest Inhalte und Layout. Diese haben großen Einfluss auf die Barrierefreiheit. Hier findest du einige Beispiele, wie du die Barrierefreiheit verbessern kannst:
Beschriftungen
Alle Formularfelder müssen klar und eindeutig beschriftet sein.
Beschriftungen helfen allen Nutzern – besonders denen, die Screenreader verwenden – die abgefragten Informationen zu verstehen.
Füge die Beschriftungen direkt im Label des Eingabeblocks in Heyflow hinzu.
💡 Bald verfügbar: Unterstützung für Rich Text-Beschriftungen und Option zum Ausblenden von Labels.
Nicht-textliche Inhalte
Alle nicht-textlichen Inhalte wie Bilder benötigen aussagekräftige Alternativtexte (Alt-Texte).
Alt-Texte helfen Screenreader-Nutzern, den Zweck oder Inhalt eines Bildes zu verstehen.
In Heyflow kannst du diesen Text im Feld „Alt-Text“ für jedes Bild hinterlegen.
Unsere Icons haben bereits automatisch ein Alt-Text inkludiert.
Farben und Kontraste
Text muss ausreichend Kontrast zum Hintergrund haben.
Verwende Tools wie den Coolors Contrast Checker, um dein Design zu überprüfen.
Schriftarten und Überschriften
Nutze gut lesbare Schriftgrößen – vermeide sehr kleine Texte.
Pro Seite sollte nur eine
<h1>
-Überschrift verwendet werden.
💡 Wenn du deinen Flow in eine Webseite mit bestehender <h1>
einbindest, entferne sie aus dem Flow, um doppelte Elemente zu vermeiden.
Tools zur Barrierefreiheitsprüfung
Diese kostenlosen Tools helfen dir, die Barrierefreiheit deines Flows zu überprüfen: