Bei der Gestaltung von Apps und Software steht der Mensch im Mittelpunkt. Orientierung, verständliche Inhalte und – mühelose Bedienbarkeit sind wichtige Eckpfeiler.
Neben UX Research oder Konzeption, spielen demnach auch Nachhaltigkeit und ein barrierefreies Designsystem eine Rolle. Um diese Elemente von Beginn an implementieren zu können, ist es wichtig zu verstehen für welche Nutzergruppen und Situationen das barrierefreie Design relevant ist.
Menschen
Situationen
Die Gestaltung von barrierefreien Anwendungen ist also nicht nur für Personengruppen mit visuellen Einschränkungen essentiell, sondern ebenfalls für bestimmte Nutzungssituationen in denen die Erfassung von Inhalten beeinträchtigt ist.
Um für möglichst viele Gruppen ein gutes Nutzererlebnis zu ermöglichen, achten wir bereits bei der Erstellung von Design-Systemen auf die folgenden Punkte:
In diesem Artikel möchten wir uns besonders auf die letzten beiden Punkte konzentrieren. Der Zusammenhang von einer angemessenen Schriftgröße steht nämlich ebenfalls in Korrelation zu den Kontrasten. So sollte z.B. bei einer kleinen Schriftart ein stärker Kontrast zum Hintergrund verwendet werden.
Die Auswahl von geeigneten Kontrasten, lässt sich übrigens sehr leicht durch unterschiedliche Tools überprüfen, wie zum Beispiel dem Stark Plugin für Figma.
Das Stark Plugin für Figma bietet die Möglichkeit Accessibilty Probleme frühzeitig zu testen und zu beheben. Grundlage sind die Web Content Accessibilty Guidelines (WCAG), die Anforderungen an die Kontrastverhältnisse für verschiedenen Stufen der Barrierefreiheit (nach WCAG 3.0: “Bronze”, “Silber” und “Gold” vgl. www.bfit-bund.de, oder nach WCAG 2.x: A / AA / AAA) vorgeben (https://www.a11yproject.com/checklist/).
Mit dem Tool lässt sich das Kontrastverhältnis zwischen zwei Farbtönen bestimmen. Wenn ein Kontrast als nicht ausreichend eingestuft wird, kann beispielsweise aus den vorgeschlagenen Farbempfehlungen ein geeigneter Farbton ausgewählt werden. Auch die Art der Schriftschnitte spielt für den Kontrast eine Rolle. Dicke Schriftschnitte wirken automatisch kontrastreicher als dünner.
Für Menschen mit Sehbehinderungen oder anderen visuellen Einschränkungen kann es schwierig sein, bestimmte Farben oder Helligkeitsstufen voneinander zu unterscheiden. Deshalb ist es wichtig:
Gerne wird Text auch mal über Bilder gelegt, beispielsweise auf Websitebannern. Hierbei ist es wichtig, darauf zu achten, dass sich der Text deutlich vom Hintergrund abhebt, um gut lesbar zu sein. Bei “ruhigeren” Bildern, also Aufnahmen oder Grafiken, die weitestgehend in einem Farbton / einer Helligkeitsstufe gehalten sind, kann es hierbei schon ausreichen eine entsprechende Schriftfarbe zu wählen. Wenn es sich jedoch um ein komplexeres Motiv handelt, empfiehlt es sich, den Text mit einem Kasten einer entsprechenden Farbe zu hinterlegen, um zu gewährleisten, dass der Text immer lesbar bleibt.
Ihr wollt mehr zum Thema Accessibility und Barrierefreiheit erfahren?
Schreibt uns einfach.