Das WCAG-Kriterium im Überblick
Das WCAG-Erfolgskriterium 1.4.4 «Textgrösse ändern» legt fest, dass Text ohne Hilfstechnologien auf 200% vergrössert werden können muss, ohne dass Inhalte oder Funktionen verloren gehen.
Weshalb ist das so wichtig?
Im Folgenden nennen wir beispielhaft einige Lebenssituationen, die verdeutlichen, weshalb die Einhaltung dieses Kriteriums unbedingt erforderlich ist:
- Menschen mit Makuladegeneration verlieren die zentrale Sehschärfe und können Details schwer erkennen.
- Bei grauem Star wird das Sehen diffus und verschwommen.
- Diabetische Retinopathie führt zu Sehschärfeverlust.
- Weitsichtigkeit im Alter erschwert das Lesen.
Bei all diesen Beispielen ermöglicht die Vergrösserung, dass Text dennoch gelesen werden kann.
Wie wird das Kriterium praktisch umgesetzt?
Die Umsetzung der Kriteriums-Anforderungen erfolgt anhand von:
- relativen Einheiten (em, rem, Prozent) – passen sich Bildschirmdimensionen sowie Browser-, bzw. User-Einstellungen an, sodass Text per Zoom oder in den Systemeinstellungen ohne Layout-Brüche vergrössert werden kann.
- flexiblen Container-Grössen – ermöglichen, dass sich Textblöcke beim Vergrössern mit dem Inhalt ausdehnen, anstatt abgeschnitten oder überlappend dargestellt zu werden.
- Responsive Design – reagiert auf unterschiedliche Bildschirmdimensionen und Zoomstufen, sodass Text lesbar bleibt.
- Text statt Bilder von Text – Text lässt sich skalieren, vorlesen und umformatieren, während Bilder, die Text enthalten, beim Vergrössern oft verpixelt werden und ohne Alternativtext für Screenreader unzugänglich sind.
Und wie testet man die Umsetzungen?
Das Vorgehen zum Testen der Einhaltung des Kriteriums unterscheidet sich je nach Plattform, auf der sich das zu testende System befindet. Im Folgenden haben wir für Sie für unterschiedliche Plattformen Schritt-für-Schritt-Anleitungen mit Screenshots zusammengestellt.
Apps auf dem Smartphone
iOS
- App und Kontrollzentrum öffnen
- «Nur [App-Name]» (Nr. 1 im nächsten Screenshot) wählen
- Schieberegler auf 190% stellen (Nr. 2 im Screenshot)
- Kontrollzentrum schliessen
- App öffnen und testen: Bleibt alles lesbar und funktional?
- Textgrösse-Symbol (AA – grüner Pfeil im Screenshot) wählen (das Steuerelement muss davor im Kontrollzentrum hinzugefügt werden)
Android (ab Version 15)
- Einstellungen > Bedienungshilfen > Anzeigegrösse und Text (Pfeil im Screenshot) öffnen
- Schieberegler «Anzeigegrösse» ganz nach rechts schieben (Pfeil im Screenshot)
- Einstellungen schliessen
- App öffnen und testen: Bleibt alles lesbar und funktional?
Nach dem Testen: Sowohl auf iOS als auch Android können Sie den Text anhand derselben jeweiligen Schritte in umgekehrter Reihenfolge auf die ursprüngliche Grösse zurückstellen.
Websites
Den Text mithilfe des Browserzooms auf 200% vergrössern und testen. Im Firefox-Browser können Sie den Zoom auf 200% stellen, indem Sie sechsmal Ctrl+Shift+1 (auf Windows), bzw. Cmd+Shift+1 (auf Mac) drücken (mit Ctrl+-, bzw. Cmd+- können Sie den Zoom wieder verringern).
In Google Chrome gibt es im Menü (über die drei vertikalen Punkte rechts oben zu erreichen) den Eintrag «Zoom», den Sie mit einem Plus-, bzw. Minus-Schalter einstellen können.
Unter folgendem Link finden Sie den WCAG-Text zum Erfolgskriterium 1.4.4: https://www.w3.org/WAI/WCAG22/Understanding/resize-text.html
Beitragsfoto: Agence Olloweb/Unsplash
