Tipps für die Barrierefreiheit von Websites

Antje Fabel in Wissen 02.06.2022

So unterschiedlich die Fähigkeiten von Menschen sind, so vielseitig sind die Anforderungen an Barrierefreiheit. Fehlende Videountertitel, schlechte Nutzerführung oder schlecht erkennbare Schaltflächen auf einer Website werden schnell zum Hindernis. Ca. 30 % der Bevölkerung werden ausgeschlossen, wenn bei der Planung einer Website Barrierefreiheit nicht beachtet wird. Online sein reicht nicht aus, um alle via Internet zu erreichen.

Was meint Barrierefreiheit?

Die Begriffe „Barrierefreiheit“, „Barrierearmut“ und auch „Zugänglichkeit“ werden meist synonym verwendet. Durchgesetzt hat sich aktuell Barrierefreiheit, um sich der Frage zu widmen: Werden möglichst alle Menschen eingeschlossen oder eben nicht? Das ist auch für Onlineservices wie Websites, Online-Wissensportale und Onlineshops ein Problem: Können alle das Onlineangebot uneingeschränkt nutzen?

Nach der „WCAG-Richtlinie für barrierefreie Webinhalte“ gilt eine Website als barrierearm, wenn sich Einschränkungen beim Sehen, Hören, Bewegen oder beim Verarbeiten von Informationen nicht negativ auf die Nutzung von Onlineservices auswirken.

Für wen ist Barrierefreiheit nötig und sinnvoll?

Oft ist die Vorstellung nur vage, welche Einschränkungen bereits zu Barrieren, Fehlbenutzung und schließlich Nutzungsabbrüchen führen können. Blindheit, Sehbehinderungen wie Farbfehlsichtigkeit, Schwerhörigkeit, Gehörlosigkeit, motorische Beeinträchtigungen, Lese-Rechtschreibschwäche, Lern- und geistige Behinderungen führen zu Barrieren im Internet.

Für 10 % unerlässlich

Für 10 % der Bevölkerung sind beispielsweise Tastatursteuerung, Sprachausgabe oder Joysticks notwendig, um Onlineangebote nutzen zu können.

Für 30 % - 40 % notwendig

Leicht bedienbare Websites mit Texten in einfacher Sprache helfen Menschen mit motorischen Einschränkungen oder einer Sehschwäche. Aber auch älteren Menschen, Nicht-Muttersprachler und Menschen mit einer Konzentrationsschwäche können unterstützt werden.

Für 100 % eine Erleichterung

Wir alle können Informationen schneller erfassen und Onlineservices leichter bedienen, wenn sie nutzerfreundlich aufbereitet sind. Ein weiterer Vorteil für die mobile Nutzung von Webseiten sind hohe Kontraste. Damit werden Texte auf dem Smartphone auch bei starkem Sonnenlicht besser lesbar.

Wer muss barrierefreie Onlineangebot zur Verfügung stellen?

Barrierefreie Websites sind für Bund, Länder, Gemeinden sowie für juristische Personen des öffentlichen und privaten Rechts bereits Pflicht.

Gut zu wissen und rechtzeitig einplanen: Ab 2025 müssen alle Unternehmen mit über 2 Mio. Bilanzsumme nach den Kriterien der „EU-Richtlinie 2102“ barrierefreie Internetangebote zur Verfügung stellen.

Vorteilhaft ist, wenn Barrierefreiheit von Anfang an im Konzept eingearbeitet wurde. Dann sind laufende Anpassungen möglich und die Kosten werden im Rahmen gehalten.

Servicetipp: Ein weiterer günstiger Einstiegspunkt für Barrierefreiheit ist ein Relaunch einer Website oder eines Onlineshops. Wird geplant, Inhalte und Design zu überarbeiten, können Anforderungen für Barrierefreiheit berücksichtigt werden und fließen im gesamten Überarbeitungsprozess mit ein und bleiben dauerhaft verankert. Damit werden große Einmal-Aktionen nicht mehr nötig, was die Kosten senkt.

Gute Gründe für ein barrierefreies Webangebot für die Betreibenden

Reichweite erhöhen durch besseres Ranking

Durch Nutzerfreundlichkeit und leichte Zugänglichkeit werden Websites besser gefunden. Dabei helfen Alternativtexte bei Bildern, die den Vorlese-Programmen für Sehbehinderte und Blinde dienen. Diese Bildbeschreibungen werden von Suchmaschinen wie Google ausgewertet und ins Ranking einbezogen.

Mehr Menschen erreichen und zufriedene Kundschaft gewinnen

Durch barrierefreie Webinhalte werden mehr Menschen erreicht, die durch kundenorientierte Benutzerführung Webservice erfolgreich nutzen können. Abbrüche im Bestellvorgang können damit umgangen werden.

Laut einer Umfrage der Europäischen Union von 2013 wären rund zwei Drittel der Menschen mit und ohne Behinderung dazu bereit, mehr für barrierefreie Produkte zu bezahlen.

6 Lösungen für häufige Barrieren bei der Benutzung von Websites

Nutzerfreundlichkeit (UX)

Das Design der Website muss die Inhalte gut vermitteln und den Besuchenden in sinnvolle Richtungen lenken, um das Verständnis zu fördern. Links und Formularfelder müssen beispielsweise ausreichend groß und eindeutig als solche gestaltet und erkennbar sein, damit sie korrekt benutzt werden können.

Bedienbarkeit

Mehrere Bedienkonzepte wie die Maus-, Joystick-, Tastatursteuerung oder Sprachausgabe müssen ermöglicht werden. Auch die Touchbedienung am Bildschirm wie auf dem Smartphone bei der mobilen Nutzung sind zu berücksichtigen.

Kontraste

Texte müssen sich ausreichend vom Hintergrund abheben, damit sie von Menschen mit einer Sehbehinderung gelesen werden können.

Videos

Videos benötigen Untertitel z. B. durch Video-Transkription, damit sie auch Gehörlose oder schwerhörige Menschen konsumieren können.

Alternativtexte

Bilder, Formulare und Schaltflächen müssen mit Alternativtexten versehen werden, damit Programme für blinde Menschen diese richtig erfassen und vorlesen können. Nur so kann die Website zielführend genutzt werden.

Textverständlichkeit

Leichte Sprache unterstützt alle Menschen, den Inhalt schnell und korrekt erfassen zu können, ist aber auch in Hinblick auf Barrierefreiheit essenziell.

Wie so etwas in der Umsetzung aussehen kann, sehen Sie in unseren Projekten ...

Webseiten im Schnelltest auf Barrierefreiheit prüfen

Lighthouse-Prüfung im Chrome-Browser

Für einen groben Überblick können Sie mit dem Tool „Lighthouse“ prüfen, was Google vorschlägt, um die Barrierefreiheit zu verbessern.

  1. Öffnen Sie dafür Ihre Website im Internetbrowser Chrome und rufen Sie die Unterseite auf, die Sie überprüfen möchten.

  2. Klicken Sie auf die rechte Maustaste und wählen Sie „Untersuchen“. Es öffnet sich ein Bereich, der hauptsächlich für Entwickler gedacht ist, um eine Webseite zu prüfen usw.

  3. Im oberen Bereich finden Sie Schaltflächen, um bestimmte Funktionsbereiche zu öffnen. Klicken Sie auf den Reiter „Lighthouse“, um diesen Bereich zu öffnen.

  4. Auf Wunsch können Sie alle Kategorien unter Lighthouse prüfen lassen. Die Kategorie „Accessibility“ überprüft die Barrierefreiheit. Klick auf „Generate report“ startet die Prüfung der geöffneten Webseite.
    Nach wenigen Augenblicken wird das Ergebnis angezeigt.

  5. Die Prüfung kann auf jeder Unterseite Ihres Onlineauftritts wiederholt werden.

Die Startseite von tyclipso.net wird im Internetbrowser Chrome angezeigt. Im unteren Bereich ist das Entwicklertool Lighthouse geöffnet. Die Seite wurde auf Barrierefreiheit überprüft und mit dem Ergebnis 97 von 100 bewertet.

Das Prüfergebnis für tyclipso.net in der Kategorie Barrierefreiheit

Kontrast checken

Überprüfen Sie Elemente Ihrer Website auf ausreichende Kontraste. Beispielsweise auf der Website contrastchecker.com. Geben Sie dazu die Vorder- und Hintergrundfarbe eines Elements oder eines Textbereiches ein, die Sie testen möchten.

Bei größerer Schrift ist ein Kontrastverhältnis von 3:1 Minimum. Erforderlich sind im Allgemeinen 4,5:1 bei Schriftgrößen ab 18 pt.

Tastaturbedienbarkeit checken

Testen Sie mit folgenden Tasten Ihrer Tastatur, ob Ihre Website ohne Maus zu bedienen ist:

  • Pfeiltasten: Auf der Seite nach oben/unten bzw. rechts/links scrollen.

  • Tab-Taste: Zu interaktiven Elementen wie Links und Eingabefeldern springen.

  • Umschalt/Shift + Tab springt zum vorherigen interaktiven Element zurück.

  • Eingabe/Enter: Der angesteuerte Link wird geöffnet.

  • Leertaste: Checkboxen aktivieren/deaktivieren.

  • Dropdown-Menüs können über die Leertaste geöffnet werden, über die Pfeiltasten kann innerhalb des Menüs navigiert werden. Eingabe folgt dem Menüpunkt.

Vergrößerung der Webseite möglich?

Überprüfen Sie, ob die Inhalte Ihrer Website problemlos und verlustfrei vergrößert werden können.

  1. Öffnen Sie Ihre Website.

  2. Halten Sie die Strg-Taste gehalten und scrollen Sie mit dem Mausrad.
    Damit zoomen Sie in eine Webseite bzw. wieder heraus.

  3. Stellen Sie die Vergrößerung auf 200 % und überprüfen Sie, ob Sie noch alle Inhalte sehen können.

Barrierefreiheit zum allgemeinen Standard werden lassen

Barrierefreiheit kann als Qualitätsmerkmal betrachtet werden, doch es sollte viel mehr als Standard angesehen werden. Alle sollten die gleichen Zugangsbedingungen zu einem Onlineservice erhalten, unabhängig von individuellen Fähigkeiten.

“Digitale Teilhabe ist für alle Menschen wichtig. Alle Menschen sollten ganz selbstverständlich überall dabei sein. Auch bei der Digitalisierung. Das ist Inklusion. Inklusion und digitale Teilhabe sorgen dafür, dass alle Menschen gut für die Zukunft vorbereitet sind.” Aktion Mensch, Digitale Teilhabe.

Und nicht zu vergessen: Wir alle werden älter und das Seh- und Hörvermögen kann nachlassen. Irgendwann werden auch wir dankbar für verständliche und bedienbare Webangebote sein, die uns teilhaben lassen.


Quellen

www.aktion-mensch.de

www.w3.org

www.dzblesen.de

www.einfach-fuer-alle.de

Albrecht Mauersberger kümmert sich um einen gelungenen Projektauftakt

Für alle erreichbar sein

Sie planen eine umfassende Überarbeitung Ihres Webangebots und wollen durch Barrierefreiheit mehr Menschen erreichen?

Wir unterstützen Sie dabei.

KONTAKT AUFNEHMEN