web-dev-qa-db-de.com

Muss der Text der Hover-Statusschaltfläche den Richtlinien für Barrierefreiheit entsprechen?

Ich habe ein grundlegendes Verständnis der Barrierefreiheit und ihrer Anwendung auf visuelle Elemente Ihres Produkts und möchte Richtlinien so gut wie möglich anwenden.

Meine Frage ist, ob der Text der Schaltfläche für den Schwebezustand auch den Richtlinien für Barrierefreiheit sowie dem Normalzustand entsprechen muss.

3
D Smith

Nehmen wir das Beispiel einer Tabellenzeile, die beim Bewegen der Maus hervorgehoben wird. Wie von Sooraj MV erwähnt, erzwingt die WCAG ein Kontrastverhältnis von mindestens 4,5: 1 für die AA-Zugänglichkeit.

OK, aber Sie können argumentieren, dass der Farbkontrast gut ist, wenn Sie nicht über dem Element schweben/fokussieren. Das Problem ist, dass einige Menschen mit Sehbehinderung eine Bildschirmlupe verwenden und zum Beispiel zum Lesen der Tabellenzeile ihre Maus notwendigerweise auf dem Schwebeflug ist. Das heißt, jedes Mal, wenn sie eine Zeile lesen, lösen sie die Hover-Interaktion aus. In diesem Fall ist ein guter Farbkontrast obligatorisch.

Für den Kontrast eines fokussierten Elements scheint das Problem weniger offensichtlich zu sein, aber Benutzer konzentrieren sich im Allgemeinen auf ein Element (d. H. Eine Schaltfläche), kurz bevor sie die Interaktion auslösen. Wenn sie nicht lesen können, worauf es ankommt, wie sollen sie dann wissen, was die Aktion ist? Sie würden hin und her gehen müssen. Offensichtlich ist dies keine gute Benutzererfahrung.

Denken Sie daran, dass die Richtlinien zur Barrierefreiheit Ihnen beim Entwerfen barrierefreier Websites helfen sollen. Am Ende ist das einzige, was sagt, ob es zugänglich ist oder nicht, ein Benutzertest. Und Sie können eine sehr schlechte Benutzererfahrung bieten, während Sie WCAG AA respektieren ... Priorisieren Sie Benutzerfeedback vor Richtlinien

3
Leths

Ja natürlich. In WCAG 2.0 Version 1.4.3 wurde nichts Spezielles bezüglich der Farbänderung für Schaltflächentext in Schwebe-/Fokuszuständen erwähnt. Es ist davon auszugehen, dass der Schaltflächentext bei Schwebe-/Fokuszuständen ein Kontrastverhältnis von 4,5: 1 oder mehr beibehalten sollte, um die AA-Konformitätsstufe von WCAG 2.0 zu erreichen. Weitere Informationen finden Sie hier: https://webaim.org/articles/contrast/

Wenn Sie nach Richtlinien zur Barrierefreiheit für Inhalte zu Fokus-/Schwebezuständen im Allgemeinen suchen, werden diese in der neuesten Version der WCAG 2.1 2018-Version im Erfolgskriterium 1.4.13 https://www.w3.org/) klar erläutert. WAI/WCAG21/Understanding/content-on-hover-or-focus.html

2
Sooraj MV

Zunächst einmal wird Ihr Schwebezustand hoffentlich auch mit Tastaturfokus angezeigt. (Benutz einfach :hover und :focus in der gleichen Stildefinition).

Unabhängig davon, ob die Schaltfläche scharfgestellt ist oder schwebt oder nicht, muss der Text auf der Schaltfläche einen ausreichenden Kontrast zur Hintergrundfarbe aufweisen. Wenn dies nicht der Fall ist, verschwindet der Text möglicherweise, wenn er den Fokus/Hover erhält, und Sie wissen dann nicht, ob Sie die Schaltfläche auswählen sollten, da Sie den Text nicht sehen können.

Beachten Sie jedoch, dass 1.4.11 besagt, dass die Fokusfarbe oder Schwebefarbe keinen ausreichenden Kontrast zum Standardzustand benötigt. Wenn sich der Hintergrund Ihrer Schaltfläche zwischen Schwebeflug und Standardstatus geringfügig ändert, ist für diesen Farbunterschied keine Kontrastanforderung erforderlich.

2
slugolicious

Sie beschreiben eine weit verbreitete Denkweise über Barrierefreiheit.

Nehmen wir an, es handelt sich um ein Kontaktformular, und stellen Sie folgende Fragen:

  1. Muss der Schwebezustand zugänglich sein oder die gesamte Schaltfläche?
  2. Muss die Schaltfläche zugänglich sein oder wie kann das Formular gesendet werden?
  3. Muss das Formular zugänglich sein oder nur die Tatsache, dass Personen in der Lage sind, Sie zu kontaktieren?

Möglicherweise haben Sie Schwierigkeiten, ein Kontaktformular für behinderte Menschen zugänglich zu machen, und stellen dann fest, dass sie lieber telefonieren. Nur durch Hinzufügen einer Telefonnummer auf der Seite ist es für diese Personen viel zugänglicher, Sie zu kontaktieren. Dies ist zwar nur ein Beispiel, aber ich hoffe, es macht einen Punkt klar. Können alle Benutzer verstehen, was die Schaltfläche tut und wie sie sich im Kontext des Formulars verhält?

Konzentrieren Sie sich auf die Schaltfläche in ihrer Gesamtheit, nicht nur auf den Schwebezustand, und prüfen Sie, ob und wie der Schwebezustand die Zugänglichkeit der Schaltfläche verbessert oder verringert.

Übermittelt der Schwebezustand der Schaltfläche wichtige Informationen? Geben Sie diese Informationen auf andere Weise an. Wenn der Schwebezustand dieselbe Funktion wie der Fokusstatus für Tastaturbenutzer hat, sollte er zugänglich gemacht werden.

1
jazZRo

Ja tut es. Der Schwebezustand ist nur einer der Zustände eines UI-Steuerelements, sodass jede Anforderung anwendbar ist.

Nur der deaktivierte (inaktive) Status ist von den Anforderungen an den Farbkontrast ausgenommen.

Siehe Erfolgskriterium 1.4.3 Contrasstrong textt (Minimum) Incidental

1
Davyd Geyl