Was ist Ally und wieso geht es uns alle an?

"Ally" nutzen wir als Kurzform des englischen Begriffs "Accessibility". Auf deutsch: Barrierefreiheit.

Barrierefreiheit - der Begriff sagt fast jedem etwas. Gemeint sind breitere Parkplätze, Rampen, Fahrstühle und Markierungen an Haltestellen, oder?
Auch - in unserem Falle aber nicht ganz.

Tastatur für Menschen mit fehlendem Sehvermögen

Barrierefreiheit im Internet

Wir meinen an dieser Stelle die Barrierefreiheit im Internet. Deren Ziel ist es, Anwendungen und Webseiten so zu gestalten, dass sie von wirklich allen Nutzer*innen auch genutzt werden können.

Alle Nutzer*innen, meint also nicht nur die Anwender*innen, die alle Sinne uneingeschränkt einsetzen können, sondern umfasst auch Personen, die körperlich oder geistig eingeschränkt sind.

Eine weitere Schreibweise ist auch "a11y". Die Zahl 11 bezieht sich hierbei auf die Anzahl der mittleren Buchstaben des Wortes "Accessibility". Es folgt damit einer Konvention aus der Informations- und Kommunkationstechnologie, in der wiederkehrende wichtige Begrifflichkeiten nach diesem Schema abgekürzt werden. Ein weiteres Beispiel ist der Begriff "Internationalisierung" mit "i18n".

Wenn die Benutzung anstrengend wird

Betroffen sind viele von uns - einige mehr und andere weniger.

Ein paar Beispiele:

  • Eine Freundin empfiehlt uns einen Blog, der sich mit veganer Ernährung befasst. Begeistert klicken wir auf den Link, nur um dann festzustellen, dass alles in weißer Schrift auf hell beigem Hintergrund verfasst wurde. Nach ein paar Minuten bekommen wir Kopfschmerzen und verlassen die Seite. Das Lesen hat angestrengt.
  • Wir möchten die nächste Bahnreise buchen und stellen erfreut fest, dass es wenige Tickets zu einem reduzierten Preis gibt. Bei dem Versuch schnell zu sein, klicken wir aus Versehen auf die Zugverbindung da drunter. Die Buttons liegen aber auch eng beieinander! Frustriert warten wir, bis sich die Seite aufgebaut hat und klicken zurück. „Das Formular kann nicht erneut gesendet werden“. Argh! Dann suchen wir eben neu - nur um festzustellen, dass die vergünstigte Verbindung nicht mehr verfügbar ist.
  • Unser Großvater reicht uns sein Handy: „Was steht da? Das ist viel zu klein geschrieben.“ Ein Zoomen ist nicht möglich und die Schriftgröße lässt sich auch nicht einstellen.
  • Auf einer Webseite, zu der wir zu Recherche-Zwecken unterwegs sind, öffnen sich immer wieder nervige Popup-Fenster. Auch beim Verlassen der Seite öffnet sich wieder Werbung.

Wir alle kennen solche und ähnliche Situationen aus unserem Alltag, die vermeidbar wären, wenn zum Beispiel Kontraste von Schriften richtig gesetzt oder Buttons weit genug auseinander liegen würden.

Die wenigsten von uns können nachvollziehen wie es ist, aufgrund einer körperlichen Einschränkung, die Maus nicht nutzen zu können.

Durch fehlende Feinmotorik nicht dort zu klicken, wo man eigentlich hin wollte.

Oder sich von einem Screenreader alle Inhalte vorlesen zu lassen.

Beispiele für Barrieren:

Physiologische Barrieren

Physiologische Barrieren treten auf, wenn die Motorik eines Menschen gestört ist. Zu unterscheiden ist zwischen fehlender Feinmotorik, also der Schwierigkeit auf kleine Links und Buttons zu klicken und einer körperlichen Beeinträchtigung. Letzteres kann dazu führen, dass zum Beispiel die Maus und/ oder die Tastatur nicht benutzt werden kann.

Auditive Barrieren

Eine weitere Barriere ist das eingeschränkte oder fehlende Hörvermögen. Videos und Audiospuren können dann nicht einfach abgespielt und verstanden werden. Auch Benachrichtigungstöne können nicht wahrgenommen werden.

Visuelle Barrieren

Es gibt eine Vielzahl an visuellen Barrieren. So gibt es Menschen, die an einer Rot-Grün Sehschwäche leiden und Inhalte auf Webseiten anders wahrnehmen. Menschen mit Farbenblindheit sehen Grafiken und Bilder anders. Menschen mit fehlendem Sehvermögen benutzen Screenreader, um durch das Internet zu navigieren und sich Inhalte vorlesen zu lassen.

Zusammenarbeit

Wie sieht eigentlich der Status quo aus?

Laut einer Untersuchung von Aktion Mensch ist Barrierefreiheit im Internet für 30% aller Menschen nötig. Hierzu zählen Menschen mit motorischen Einschränkungen, Sehschwächen, Höreinschränkungen, Nicht-Muttersprachler*innen und Menschen mit Konzentrationsschwächen.
Für 10% aller Internetnutzer*innen ist ein barrierefreies Internet unerlässlich.

Ein barrierefreies Internet - davon sind wir leider noch weit entfernt, wenn man sich aktuelle Statistiken anschaut.

Die gemeinnützige Organisation namens "WebAIM" hat es sich zur Aufgabe gemacht, Webseiten auf Barrierefreiheiten zu überprüfen. Das Ergebnis ist bedrückend - lediglich 2% der getesteten Webseiten (Majestic Million-Liste) hat den Test ohne Mängel bestanden und kann als "Barrierefrei" tituliert werden.

Die häufigsten Fehler lagen bei einem zu schwachen Kontrast zwischen Text und Hintergrund, fehlenden Alternativtexten, fehlerhaften Links und fehlenden Steuerelementen und Schaltflächen.

Vorteile barrierefreier Webseiten für Unternehmen

Barrierefreiheit bedeutet hohe Benutzerfreundlichkeit - sie schadet also in keinem Fall.

  • Breitere Zielgruppe
  • Gute Usability für alle Nutzer*innen
  • Geringere Bounce Rate
  • Höhere Reichweite
  • Besseres Ranking in Suchmaschinen
  • Verbessern der digitalen Teilhabe
  • Vorbildfunktion und jetzt schon mit gutem Beispiel voran gehen (nicht auf eine Pflicht im Jahr 2025 warten)

Der European Accessibility Act

Der "European Accessibility Act" (deutsch: "Europäischer Rechtsakt zur Barrierefreiheit") wurde im Frühjahr 2019 als EU-Richtlinie 2019/882 verabschiedet.

Ziel des Vorhabens: Barrieren für beeinträchtigte Personengruppen reduzieren und ihnen ein gleichwertiges Nutzererlebnis ermöglichen. Das bedeutet, dass jede Webseite auch für beeinträchtigte Nutzergruppen zugänglich sein muss.

Am 22. Juli 2021 wurde passend dazu das Gesetz zur Umsetzung (Barrierefreiheitsstärkungsgesetz - BFSG) - im Bundesgesetzblatt, also auf nationaler Ebene, veröffentlicht.

So müssen ab dem Jahr 2025 viele Produkte (wie Internet-Router, Computer, Laptops, Fernseher mit Internetzugang) und Dienstleistungen (Messenger-Dienste, Webseiten, Apps) barrierefrei angeboten werden.

Von dem Gesetz befreit sind lediglich Kleinstunternehmen mit weniger als zehn Beschäftigten und einem Jahresumsatz von maximal 2 Millionen Euro.

Kleinstunternehmen, die Produkte in Umlauf bringen, fallen trotzdem unter das BFSG.

Grafik, die eine Gegenüberstellung von Dos und Donts für ein barrierefreies Internet zeigt

" Von einem sauberen Quellcode profitieren am Ende nicht nur Benutzer*innen eines Screenreaders, sondern auch die Webseite selbst mit einem verbesserten Ranking in den Suchergebnissen. "

Welche Anpassungen kann mein Unternehmen jetzt schon umsetzen

Es gibt viele Optionen, die eigene Webseite oder App möglichst barrierefrei zu gestalten. Möchten Sie es richtig angehen, steht zu aller erst ein Test der eigenen Seite an. Darauf folgt eine individuelle Beratung mit geschulten UX-Designer*innen und einem a11y-Team.

Die Handlungsempfehlungen sind dabei so individuell wie jede Anwendung selbst. Ein paar Wiederholungsfaktoren gibt es allerdings.

UX-Designer*innen müssen beim Erstellen einer Anwendung auf die Farben achten. Ein besonders kontrastreiches Design und eine gut leserliche Schriftgröße und -art, helfen bei der Lesbarkeit.

Bilder sollten immer mit ein einem ALT-Tag versehen werden. So können Screenreader sie erfassen und auslesen.

Bei Audiowiedergaben muss auf alternative Lösungen zum Ton gesetzt werden. Bei Videos kann ein Untertitel eingeblendet oder auf "Closed Captions", die erweiterte Form der Untertitel, zurückgegriffen werden. "Closed Captions" verschriftlichen nicht nur das gesprochene Wort, sonder auch andere Informationen wie Hintergrundgeräusche.

Motorisch eingeschränkte User*innen profitieren von gut klickbaren Flächen. Links und Buttons sollten dafür nicht zu eng beieinander liegen und auch nicht zu klein sein. Es geht darum die Klickfläche so groß zu halten, dass sie auch ohne feinmotorische Maus-Bewegungen getroffen werden kann. Auf Hover-Links sollte weitestgehend verzichtet werden.

Eine weitere Hilfe ist die Skalierbarkeit von Schriftgrößen. Ist diese einstellbar freuen sich Nutzer*innen mit einer Sehbeeinträchtigung. Positiver Sideeffect: Die Bounce Rate wird sich auch verringern.

Um Menschen die Nutzung einer Webseite zu erleichtern sind Tastaturkürzel von großer Bedeutung. Auch bei unbeschränkten Menschen kann die Tastaturbedienung die Usability erhöhen, da Interaktionen auf der Webseite auch für sie einfacher und zeitsparender werden können.

Good to know: a11y für besseres SEO

Barrierefreiheit ist nicht nur für Menschen bereichernd. Auch Suchmaschinen und ihre Crawler freuen sich über möglichst barrierefreie Webauftritte.

So kann eine klare inhaltliche Struktur einer Webseite mit Überschriften von H1 bis H6 und gelegentlichen fetten und kursiven Textpassagen die Crawler auf wichtige Inhalte aufmerksam machen.

Sind auf allen Seiten die Meta Descriptions, Title Tags und ALT-Tags gesetzt, können Inhalte besser eingeordnet und bewertet werden.

Von einem sauberen Quellcode profitieren am Ende nicht nur Benutzer*innen eines Screenreaders, sondern auch die Webseite selbst mit einem verbesserten Ranking in den Suchergebnissen.

Wir helfen bei der Umsetzung einer barrierefreien Anwendung

Sind Sie an einer Umsetzung auf Ihrer Webseite interessiert und planen Sie in nächster Zeit ein neues Projekt? Unsere ally-geschulten UX-Designer*innen und Entwickler*innen begleiten Sie gerne auf dem Weg. Unterstützt werden sie zusätzlich von unserem eigens gegründeten A11y-Squad.

Ob durch individuelle Beratung, Erstellung erster Mock-Ups oder die konkrete Umsetzung von Design und Entwicklung - wir sind der passende Partner.

Sprechen Sie uns an und vereinbaren Sie ein erstes unverbindliches Beratungsgespräch.



Weiterführende Links

https://www.bundesfachstelle-barrierefreiheit.de/DE/Fachwissen/Produkte-und-Dienstleistungen/European-Accessibility-Act/european-accessibility-act_node.html

https://www.bundesfachstelle-barrierefreiheit.de/DE/Fachwissen/Produkte-und-Dienstleistungen/Barrierefreiheitsstaerkungsgesetz/barrierefreiheitsstaerkungsgesetz_node.html#doc1240534bodyText1

https://www.aktion-mensch.de/inklusion/barrierefreiheit/barrierefreie-website

https://www.european-accessibility-act.de/

https://de.statista.com/infografik/23675/anteil-der-majestic-million-websites-der-wcag-fehler-aufweist/