Zugänglichkeit (Basis) · Sergey Sukharevsky

Zugänglichkeit ist die Qualität von Schlüsselszenarien für Menschen mit dauerhaften, zeitlichen und situativen Einschränkungen. Berücksichtigen Sie es von Anfang an in die Definition von Fertig- und Design-System: Die Festlegung von Semantik, Fokus und Struktur nach der Veröffentlichung ist in der Regel teurer als die frühzeitige Überprüfung.

Was ist Zugänglichkeit und warum ist sie notwendig?

Verfügbarkeit in UX – Definition

Zugänglichkeit ist ein Ansatz zur Gestaltung digitaler Produkte, bei dem möglichst viele Menschen sie nutzen können, unabhängig von ihren physischen, kognitiven oder sensorischen Eigenschaften. Zugänglichkeit ist ein Teil der breiteren Disziplin, die als inklusives Design bezeichnet wird, aber nicht darauf beschränkt ist.

Warum es für UX wichtig ist

Schlecht gestaltete Zugänglichkeit ruiniert die Benutzererfahrung für alle. Beispiel: Zu kleine Schriften stören nicht nur Menschen mit Sehbehinderungen, sondern auch solche, die einfach müde sind. Der Kontrast wird gesenkt – jeder Benutzer unter der Sonne oder in der Nacht riskiert, den Button nicht zu sehen. Die meisten UX-Guides verbinden Zugänglichkeit mit einer allgemeineren Nutzungsqualität.

Beispiel: Lost Audience Segment

Die Anwendung bietet keine Kontrolle über Tasten und Tasten. Menschen mit einer Handverletzung und jeder, der keine Maus nehmen möchte, wird einfach zu einem Konkurrenten gehen. Der Verlust der Reichweite ist das Hauptgeschäftshindernis, um die Zugänglichkeit zu ignorieren.

Grundprinzipien der Zugänglichkeit

Kontrast und Lesbarkeit

Um die WCAG 2.2 auf Stufe AA zu erfüllen, muss Klartext einen Kontrast von mindestens 4,5:1 und großer Text einen Kontrast von 3:1 aufweisen; Logos, dekorativer und inaktiver Text haben Ausnahmen. Schriftgröße, Zeilenlänge und Intervalle werden mit Sprache und Skript ausgewertet, nicht mit einer einzigen universellen Zahl. Die aktuellen Kriterien werden in WCAG 2.2 gesammelt.

Nicht jeder benutzt eine Maus. Alle Funktionen sollten von der Tastatur aus zugänglich sein, die Reihenfolge der Fokussierung sollte der Logik der Benutzeroberfläche entsprechen und der Benutzer sollte nicht in die “Falle” fallen. Tab verschiebt normalerweise den Fokus zwischen Elementen, wobei Pfeile innerhalb von Komponenten wie Menüs, Tabs und Funkgruppen entsprechend ihrem Muster verlaufen.

Beispiel

Genehmigungsformular: Wenn der Fokus nach dem Öffnen des Eingabeaufforderungs- oder Modalfensters nicht von der Tastatur zurückgegeben werden kann, kann der Benutzer das Login nicht abschließen. Überprüfen Sie nicht nur den Übergang nach vorne auf der Registerkarte, sondern auch die umgekehrte Reihenfolge, Sichtbarkeit des Fokus, Flucht und Rückkehr des Fokus zu dem Element, das das Fenster geöffnet hat.

Alternative Texte und Beschreibungen

Ein informatives Bild braucht eine textuelle Alternative, die ihren Zweck im aktuellen Kontext vermittelt. Das dekorative Bild hingegen sollte vor unterstützenden Technologien verborgen bleiben, wie z. B. das Freilassen des alt="". Das Button-Bild sollte einen verfügbaren Namen haben, der die Aktion beschreibt, nicht das Aussehen.

Universale Sprache und Einfachheit

UX Copywriting sollte kurz und nicht mit Geschwindigkeit überlastet sein. Dies ist wichtig für Menschen mit kognitiven Behinderungen sowie für diejenigen, die eine zweite oder dritte Sprache lesen. Klare Anweisungen, kurze Markierungen und vorhersehbare Aktionen sparen Zeit für alle, nicht nur für die Gruppen mit geringer Mobilität.

Reaktionsfähigkeit und Skalierbarkeit

Gemäß dem Kriterium Resize Text Level AA sollte Text auf 200 Prozent erhöht werden, ohne dass Inhalt und Funktionalität verloren gehen. Überprüfen Sie den Reflow separat im schmalen Viewport: Abgesehen von Elementen, die wirklich ein zweidimensionales Layout benötigen, muss der Benutzer die Seite nicht ständig in zwei Richtungen scrollen.

Häufige Fehler und Anti-Patterns

Erklärte Zugänglichkeit: alt für alt

Alt-Texte werden manchmal nur formal ergänzt. alt="Bild 1" oder ein Dateiname erklärt nichts; ein fehlendes Attribut kann dazu führen, dass ein Screenreader technische Details vorliest. Beschreiben Sie bei informativen Bildern die Bedeutung und verwenden Sie bei dekorativen Bildern ein leeres alt="".

Verwendung von nur Farben

Nur farbfehlermarker sind ein häufiges problem. Entweder ein Teil des Publikums unterscheidet keine Schattierungen oder die kitschige falsche Farbübertragung auf dem Bildschirm. Fügen Sie Piktogramme, Textsignaturen, Icons hinzu.

Unzureichende Konzentration auf Tests

Manuelle Zugänglichkeitsprüfungen und reale Tests funktionieren besser als automatische Checker. Ohne dies ist es schwierig, das Problem vollständig zu erkennen.

Tools und Ressourcen für die UX Accessibility Assessment

Mini-Set: Was man in der Praxis jeden nutzen kann

axe DevTools für schnelle Zugänglichkeitsprüfungen
WAVE visualisiert Probleme mit Farbe, alten Markern und Navigationsstruktur
Color Safe (https://colorsafe.co/) mit WCAG Kontrasttest

Kurzlehrgang

Fügen Sie ein paar Standardfragen zur Checkliste der ux-Checks hinzu:

Kann ich das Interface nur mit der Tastatur verwenden?
Lesen Sie den Text unter typischen Bedingungen?
Vermitteln Textalternativen die Bedeutung von informativen Bildern, während dekorative vor dem Bildschirmleser verborgen sind?
Ist die Logik der Übergänge und Hinweise für den Anfänger klar?

Vorteile von Tests in allen Phasen

Menschen mit unterschiedlichem Grad an digitaler Kompetenz und mit unterschiedlichen Geräten einbeziehen. Es wird oft gesehen, wie geringe Verfügbarkeit sogar digital versierte Benutzer abschreckt.

Zugänglichkeit und User Experience: die Auswirkungen auf das Geschäft

Metriken, die sinnvoll sind, um zu sehen

Die Auswirkungen der Zugänglichkeit hängen vom Publikum und dem Skript ab, also versprechen Sie kein universelles Retentions- oder Conversion-Wachstum. Messen Sie den Erfolg einer Schlüsselaufgabe mit einer Tastatur und einem Bildschirmleser, die Anzahl der Blockierfehler, Benutzeranforderungen und den Anteil der getesteten Komponenten.

Fälle aus der Praxis

Die Erhöhung der aktiven Fläche eines kleinen mobilen Buttons kann die Anzahl der Fehlschläge reduzieren, und die Korrektur des Kontrasts kann den Zustand bei hellem Licht und Sehschwäche verfügbar machen. Der Effekt wird durch fehlerhafte Klicks, den Erfolg des Skripts und Qualitätstests getestet, ohne dass eine Änderung der Gesamtkonvertierung einem einzigen visuellen Parameter zugeschrieben wird.

FAQ: Kurz zu den Hauptthemen

**Warum wird Barrierefreiheit als Teil von UX und nicht als separate Domain betrachtet? Zugänglichkeit ist in die User Experience integriert. Wenn ein Produkt für manche Menschen unangenehm ist, liegt UX unter der Baseline.

Welche Standards gibt es für digitale Zugänglichkeit? Befolgen Sie für Webinhalte die aktuelle WCAG 2.2 Empfehlung und die geltenden Anforderungen Ihres Marktes. Native Anwendungen werden von den Accessibility Guides und der API der Zielplattform weiter überprüft.

**Sind automatische Kontrollen ausreichend, um die Verfügbarkeit zu gewährleisten? Nope. Diese Werkzeuge fangen nicht alle Probleme. Manuelle Tests und Feedback von Live-Benutzern sind erforderlich.

**Wollen Sie das Produkt sofort so zugänglich wie möglich machen oder können Sie es in Etappen machen? Schritt für Schritt, akzeptable Praxis. Es ist wichtig, die wichtigsten Szenarien und kritischen Geschäftsstandorte zu priorisieren.

**Wie überprüfen Sie, ob ein schlechtes Design einen Teil des Publikums entmutigt? Verwenden Sie Daten aus ux-research, custdevs und Benutzerpfadanalyse. Achten Sie auf das Wachstum von Fehlern, Ablehnungen und wiederholten Beschwerden.

**Was sind die häufigsten Fehler, die die Verfügbarkeit der Schnittstelle beeinträchtigen? Das Ignorieren der Tastaturnavigation, geringer Kontrast, fehlende Textalternativen.