Barrierefreies Design Inklusion als Grundprinzip

Anbieter zum Thema

Fsas Technologies GmbH

netfiles GmbH

Hyland Software Germany GmbH

Warum ist barrierefreies Design wichtig? Allein schon, weil eine Milliarde Menschen aufgrund von Einschränkungen Probleme bei der Wahrnehmung oder Bedienung digitaler Lösungen haben. Aber wie gelingt barrierefreies Design?

Barrierefreiheit bedeutet, dass Menschen mit unterschiedlichen Fähigkeiten eine Website, ein Produkt oder eine Dienstleistung finden, navigieren und nutzen können. Einerseits legt Barrierefreiheit einen großen Wert darauf, den Bedürfnissen von Menschen mit Behinderungen gerecht zu werden, andererseits beinhaltet das Prinzip aber auch ein besseres Design und eine bessere Funktionalität für alle User.

Die Integration von Funktionen, die Menschen mit Behinderungen dienen, kommt auch Nutzerinnen und Nutzern ohne Einschränkungen zugute. So haben beispielsweise 80 Prozent der Menschen, die in Großbritannien Untertitel verwenden, keine Hörbehinderung. Screenreader-Funktionen wiederum können ein E-Book zum Hörbuch machen. Zugängliche Inhalte betreffen also letztlich alle Anwender und Anwenderinnen.

Barrierefreies Design und gutes Design sind Synonyme: Barrierefreiheit überschneidet sich von Natur aus mit bewährten Praktiken wie mobilem Webdesign, Geräteunabhängigkeit, multimodaler Interaktion, Nutzungsfreundlichkeit und Design für SEO. Indem Unternehmen Maßnahmen ergreifen, um Barrierefreiheit in ihrem Design einzubauen, verbessern sie die Qualität ihres Designs also insgesamt.

Die Vorschriften zur Barrierefreiheit werden zudem immer strenger, weshalb Unternehmen mit teuren Nacharbeiten rechnen müssen, wenn sie sich nicht jetzt schon an die Vorgaben halten. Beispielsweise verlangt die EU-Richtlinie zur Barrierefreiheit von Websites und mobilen Anwendungen von öffentlichen Stellen und Unternehmen, ihre Websites barrierefrei zu gestalten.

Unternehmen, die diese Anforderungen nicht erfüllen, können mit rechtlichen Konsequenzen wie Geldstrafen oder Klagen konfrontiert werden. In Deutschland sind beispielsweise seit dem Inkrafttreten des Behindertengleichstellungsgesetzes (BGG) alle öffentlichen Stellen und Unternehmen dazu verpflichtet, ihre Websites barrierefrei zu gestalten.

Welche Einschränkungen gibt es und wie wirken sie sich auf den Zugang zum Web aus?

Es gibt viele verschiedene Einschränkungen, die den Zugang zum Web beeinträchtigen. Menschen mit Sehverlust können Schwierigkeiten haben, Texte und Bilder auf Websites zu lesen. Hörbehinderte Menschen benötigen möglicherweise Untertitel oder Transkriptionen, um Audio- und Videoinhalte zu verstehen. Menschen mit motorischen Behinderungen können wiederum Schwierigkeiten bei der Bedienung von Maus oder Tastatur haben, während Menschen mit kognitiven Schwierigkeiten unter Umständen Schwierigkeiten haben, komplexe Informationen zu verstehen.

Wie kann die Gestaltung von Nutzeroberflächen zugänglicher gemacht werden?

Die Grundlage für barrierefreies Design bilden die Farbe, der Kontrast und der Inhalt. Folgende Aspekte gilt es, dabei zu berücksichtigen:

Farbkontrast

Um einen guten Kontrast zu gewährleisten, sollten Designer als Faustregel für normalen Text ein Kontrastverhältnis von 4,5:1 verwenden. Menschen, die Schwierigkeiten haben, Farben zu unterscheiden, können den Text womöglich sonst nicht lesen. Ebenso wenig können sie Informationen aufnehmen, die in einem schlechten Farbkontrast dargestellt sind. Für Bilder und interaktive Inhalte können Designer Tools zur Überprüfung des Farbkontrasts verwenden, wie zum Beispiel Adobe Color oder Stark (auch als Figma-Plugin verfügbar).

Anklickbare Bereiche / Call-to-Actions

Es sollten Call-to-Actions oder Eingabefelder mit barrierefreier Ausrichtung erstellt werden. Bei diesen Call-to-Actions oder anklickbaren Bereichen beziehungsweise Eingabefeldern handelt es sich um alle Bereiche, mit denen die User manuell interagieren. Für Menschen mit einer Behinderung können sie eine besondere Herausforderung darstellen, sofern sie nicht barrierefrei gestaltet sind.

Fokuszustände integrieren

Nutzer und Nutzerinnen, die eine Tastaturnavigation oder ein Bildschirmlesegerät verwenden, sind auf Umrisse, die um Links, Schaltflächen und Eingabefelder herum erscheinen, angewiesen, um angezeigt zu bekommen, wo sie sich auf der Seite befinden. Unternehmen sollten diese sogenannten Fokuszustände in ihre Websites und Anwendungen integrieren, um Personen mit eingeschränkter Mobilität und solchen, die eine alternative Navigation bevorzugen, entgegenzukommen.

Hover-Effekt

Beim sogenannten Hover-Effekt werden den Usern zusätzliche Informationen angezeigt, wenn sie den Mauszeiger über einen Teil des Bildschirms halten. Tooltips und Hinweise können dann erscheinen und Text anzeigen, damit die Anwender und Anwenderinnen verstehen, welche Aktion sie durchführen können oder warum ihnen etwas angezeigt wird. Bei Prozessen, die mehrere Schritte umfassen, ist der Hover-Effekt für Nutzer:innen mit kognitiven Einschränkungen von Vorteil.

Beschriftungen und Anweisungen

Damit die Nutzer:innen Informationen verstehen und sich nahtlos durch die Abläufe bewegen können, brauchen sie sichtbare Beschriftungen und Anweisungen. Insofern sollte der Text in die Formate H1, H2 und H3 und mit festen Aktionsschaltflächen und chronologisch geordneten Schritten gegliedert sein.

Optimierte Typografie

Um den Inhalt für die Nutzer:innen zugänglicher zu machen, ist die Art der Textdarstellung ebenfalls von Bedeutung. Dementsprechend sollte der Text links- oder rechtsbündig und nicht im Blocksatz ausgerichtet sein – dies kann auf Websites schlecht wiedergegeben werden und den Text schwer lesbar machen. Darüber hinaus sollte der Zeilenabstand das 1,5-fache der Schriftgröße betragen, und der Absatzabstand sollte mindestens das 1,5-fache des Zeilenabstands betragen. Zudem sollte jeder Absatz bei der Arbeit mit chinesischen, japanischen und koreanischen Schriftzeichen nicht mehr als achtzig Wörter bzw. 40 Wörter enthalten.

Unterstützung für Tastenkombinationen

Tastenkombinationen sind sowohl für Personen, die sich mit der Tastatur durch eine Seite bewegen, als auch für Personen mit eingeschränkter Mobilität gedacht. Die Tabulatortaste sollte aktiviert werden, damit die Nutzer:innen zum nächsten Element der Nutzeroberfläche springen können. Mit „CMD + S“ oder „STRG + S“ können Nutzer:innen Änderungen speichern, und mit „ESC“ können Nutzer:innen Aktionen abbrechen oder die aktuelle Phase verlassen.

Responsive Design

Responsive Design bezeichnet einen Gestaltungsansatz, der auf der Anpassung an das Verhalten der Nutzer und den Kontext der Nutzung basiert. Dazu gehört beispielsweise die verwendete Bildschirmgröße, die Plattform und die Ausrichtung. Da die User zwischen verschiedenen Geräten wechseln, müssen Websites und Anwendungen hinsichtlich Bildgröße, Auflösung und Skript Fähigkeiten entsprechend angepasst werden. Vor allem aber sollte das Design automatisch die Präferenzen der Nutzer:innen berücksichtigen.

Fazit

Barrierefreies Design ist ein Muss für eine inklusive digitale Landschaft. Es geht darum, sicherzustellen, dass alle Menschen auf Informationen und Dienstleistungen im Internet zugreifen können, unabhängig von ihren Fähigkeiten und Einschränkungen.

Unternehmen und Organisationen sollten sicherstellen, dass ihre Websites barrierefrei sind, um eine breitere Zielgruppe zu erreichen, die Kundenbindung zu erhöhen und gesetzlichen Anforderungen zu entsprechen. Durch die Umsetzung von barrierefreiem Webdesign kann eine inklusive digitale Landschaft geschaffen werden, die für alle zugänglich und nutzbar ist.

* Stefan Bickelmann ist Design Director und Leiter der globalen Product Design Practice bei intive, einem globalen Technologieunternehmen mit Hauptsitz in München.

(ID:49662274)