BarrierFree Online: Barrierefreiheit mit einem Klick – so machst du deine Website in 2 Minuten deutlich zugänglicher

Geschätzte Lesezeit: 4 Minuten

Digitale Barrierefreiheit ist längst kein „Nice-to-have“ mehr. Sie verbessert die Nutzererfahrung, erweitert deine Zielgruppe und hilft dabei, Anforderungen an eine moderne Website ernst zu nehmen. Genau hier setzt BarrierFree an: Ein Accessibility-Widget, das du per Script-Tag in deine Website einbindest und anschließend über ein Dashboard konfigurierst – schnell, unkompliziert und ohne tiefen Eingriff in dein System.

https://barrierfree.site

Was ist BarrierFree Online ?

BarrierFree ist ein Barrierefreiheits-Widget, das deiner Website automatisch hilfreiche Funktionen zur besseren Zugänglichkeit hinzufügt. Besucher können darüber direkt am Seitenrand Werkzeuge aktivieren, die Lesen, Navigieren und Interagieren deutlich erleichtern – besonders für Menschen mit Sehbeeinträchtigungen, motorischen Einschränkungen oder Leseschwierigkeiten.

Wichtig: Ein Widget kann Barrierefreiheit spürbar verbessern, ersetzt aber in der Regel keinen vollständigen Accessibility-Audit (z. B. nach WCAG/BITV/EN 301 549). Als pragmatischer Einstieg oder Ergänzung ist es jedoch oft sehr effektiv.

Die wichtigsten Funktionen im Überblick

BarrierFree bündelt viele typische Accessibility-Features in einem Bedienpanel:

  • Textgröße anpassen (z. B. 50% bis 200%)
  • Buchstabenabstand (bessere Lesbarkeit durch mehr „Luft“ im Text)
  • Kontrast & Farbfilter (hoher Kontrast, Graustufen, Farben invertieren)
  • Dyslexie-freundliche Schriftart (OpenDyslexic)
  • Links hervorheben (anklickbare Elemente visuell markieren/unterstreichen)
  • Zeilenlineal & Lesemaske (Fokus beim Lesen, weniger Ablenkung)
  • Vorlesen (Text-to-Speech) und markierten Text vorlesen
  • Großer Mauszeiger (bessere Sichtbarkeit)
  • Tastaturnavigation (Bedienung ohne Maus)
  • Screen-Reader-Support (ARIA-kompatibel)
  • MehrsprachigkeitDE, EN, FR, ES, IT, NL

Damit deckt BarrierFree genau die Features ab, die Nutzer in der Praxis am häufigsten brauchen – ohne dass du dafür jedes Detail deiner Website umbauen musst.

Installation: Ein Script-Tag reicht

Die Integration ist bewusst minimal gehalten. Du fügst vor dem schließenden </body>-Tag einfach dieses Script ein:

<script src="https://barrierfree.site/widget/widget.php?key=IHR_WIDGET_KEY" async></script>

Den Widget-Key bekommst du im BarrierFree-Dashboard.

Tipp für WordPress

Wenn du WordPress nutzt, kannst du das Script zum Beispiel über den Customizer (zusätzliche Scripts) einfügen oder über ein Plugin wie „Insert Headers and Footers“. So musst du keine Theme-Dateien anfassen.

Konfiguration im Dashboard: Position, Farbe, Größe, Features

Nach der Einbindung steuerst du das Widget komfortabel im Dashboard:

  • Position: unten rechts/links oder mittig rechts/links
  • Farbe: vordefiniert oder eigener HEX-Wert passend zum Corporate Design
  • Größe: klein (50px), mittel (60px), groß (70px)
  • Funktionen: einzelne Tools gezielt aktivieren/deaktivieren

Das ist praktisch, wenn du das Panel schlank halten willst oder bestimmte Funktionen für deine Zielgruppe priorisierst.

Analytics: Nutzung messen statt raten

Ein echtes Plus: BarrierFree bietet Analytics, mit denen du nachvollziehen kannst, wie Besucher das Widget verwenden. Das hilft dir bei Entscheidungen wie:

  • Welche Features werden wirklich genutzt?
  • Lohnt es sich, Kontraste und Typografie zusätzlich „nativ“ in der Website zu verbessern?
  • Gibt es Hinweise auf Probleme in bestimmten Bereichen (z. B. Navigation)?

So wird aus „wir sollten barrierefreier werden“ ein datenbasierter Verbesserungsprozess.

Optional: CSS-Anpassungen für perfektes Design-Fit

Wenn du das Erscheinungsbild feiner anpassen willst, kannst du Styles über CSS-Klassen überschreiben, z. B.:

  • .accessibility-toggle (Widget-Button)
  • .accessibility-tools (Panel)
  • .accessibility-button.bf-active (aktive Buttons)

Hinweis: Falls deine Website starke Styles setzt, kann es sinnvoll sein, mit !important zu arbeiten, damit deine Anpassungen greifen.

Preise: fair, flexibel, mit Testphase

BarrierFree arbeitet mit einer 5-tägigen kostenlosen Testphase (ohne Kreditkarte) und drei Modellen:

  • Start 2026 Angebot3,99 €/Monat (limitiertes Neujahrsangebot)
  • Monatlich8 €/Monat, jederzeit kündbar
  • Jährlich78 €/Jahr (entspricht 6,50 €/Monat)

Alle Pläne beinhalten laut Beschreibung:

  • unbegrenzte Widget-Nutzung
  • alle Barrierefreiheits-Features
  • Design-Konfigurator
  • Premium Support

Für wen lohnt sich BarrierFree besonders?

BarrierFree ist vor allem interessant für:

  • KMU-Websites, die schnell sichtbare Verbesserungen liefern wollen
  • Agenturen & Freelancer, die Accessibility als Zusatzleistung anbieten
  • Online-Shops, bei denen Lesbarkeit und Bedienbarkeit direkt Conversion beeinflussen
  • Content-Seiten/Blogs, wo Schriftgröße, Kontrast und Lesehilfen echten Mehrwert bringen

Fazit: Schneller Einstieg in bessere Zugänglichkeit

BarrierFree punktet mit einer extrem schnellen Integration, vielen praxisnahen Funktionen, Mehrsprachigkeit und einem Dashboard, das auch Nicht-Entwickler verstehen. Wenn du Barrierefreiheit sofort für Nutzer spürbar verbessern willst, ohne deine komplette Website umzubauen, ist ein solches Widget ein sinnvoller Schritt – idealerweise kombiniert mit einer langfristigen Optimierung der Website-Struktur, Kontraste, Tastaturführung und semantischen Auszeichnung.

Sei der Erste, der das kommentiert

Kommentare sind geschlossen, allerdings sind Trackbacks und Pingbacks möglich.