search

IHK-GfI / lux-components

Other
16 stars 5 forks source link

Barrierefreiheit: Text soll auf 200% vergrößerbar sein #362

Closed patrowe closed 7 months ago

patrowe commented 1 year ago

Laut WCAG-Kriterium "1.4.4 Resize text Level AA" soll Text ohne Assistenztechnologie (z.B. Bildschirmlupe) auf 200% vergrößert werden können.

Technisch lässt sich das umsetzen, indem Schriftgrößen statt mit px mit rem angegeben werden.

Es ist zu prüfen, bei welchen Komponenten dieser Schritt weitere Anpassungen erfordert, z.B. der Button muss evlt mit der Schrift "mitwachsen" oder es der vergrößerte Text bricht nicht um und wird am Rand abgeschnitten.

patrowe commented 7 months ago

Im ersten Schritt sollen die Schriftgrößen für Headlines h1,..., h6, p, div, small sollen in rem definiert werden. Die Werte wurden mit hilfe des Type-Scaling-Systems "Major-Second" bestimmt.

Ebenso soll der Wert für die Variable $form-control-size in rem definiert werden. Im Stepper-large soll die Schrift der Nav-Items für das Theme Authentic verkleinert werden.

patrowe commented 7 months ago

Die Anforderungen wurden umgesetzt. @DSeifer bitte Testen.

patrowe commented 7 months ago

Test

  1. Testvorbedingungen:

    • die Angehängten Zweige für die Lux-components und das Lux-Components-theme herunterladen
    • das Theme lokal bauen und lokal mit den Components verlinken
    • die Demo-Anwendung starten
    • unter Windows Einstellungen>Erleichterte Bedienung>Bildschirm die Einstellungen für die Textgröße auf 200% setzen udn auf Anwenden klicken image

  2. Testdurchführung: Die einzelnen Seiten der Demoanwendungen auf abgeschnittene Texte oder Fehlerhafte Anzeigen überprüfen.

DSeifer commented 7 months ago

Unter Windows 10 Enterprise 22H2 (19045.4046) und MacOS 14.3.1 mit den jeweils aktuellen Browserversionen und in beiden Themes getestet:

MacOS: Safari -> OK

Windows: Edge -> OK