Dieses Kriterium verlangt, dass auf einer Webseite sämtlicher Text (außer Bildtexten und Untertiteln) ohne zusätzliche Hilfsmittel – also nur mittels Browserzoom oder Textskalierung – bis zu 200 % vergrößert werden kann, ohne dass Inhalte verloren gehen oder die Funktionalität eingeschränkt wird. Das Ziel ist, Menschen Seheinschränkung das Lesen zu erleichtern, indem die Seite flexibel reagiert und keine Elemente abgeschnitten, überlagert oder unleserlich werden.
Tipps und Infos zur Umsetzung des WCAG-Kriterium 1.4.4
Hier kommen von uns noch ein paar Tipps und Infos zur Umsetzung des WCAG-Kriterium 1.4.4:
- Verwende relative Maßeinheiten wie em, % oder rem für Schriftgrößen und Layout („liquid layout“) – so passt sich alles proportional an.
- Stelle sicher, dass Container mitwachsen, also z. B. Formulare, Navigationen oder Buttons sich ebenfalls vergrößern, statt Text abzuschneiden.
- Vermeide Viewport-Einheiten wie vh/vw für Schrift – die führen oft dazu, dass Text bei Zoom statisch bleibt und damit das Kriterium verletzt.
- Setze auf flüssige Layouts, etwa Flexbox oder Grid, damit Texte bei Zoom nicht über den Bildschirm hinauslaufen oder horizontal gescrollt werden müssen.
- Teste aktiv: Überprüfe deine Seite bei 200 % Zoom in verschiedenen Browsern, um sicherzugehen, dass kein Inhalt verloren geht und alle Bedienelemente funktionieren. Im Zoom der Darstellung sollten die Inhalte nicht horizontal gescrollt werden müssen (Ausnahme sind komplexe Tabellen und Grafiken) und es sollten alle Inhalte und Funktionen verfügbar ein.
- Schau dir auch das WCAG-Kriterium 1.4.10 Umfluss (Reflow) an, bei dem es auch um das Verhalten von Webseiten-Elementen bei Veränderung der Darstellung geht.
Bei Fragen beraten wir dich gerne. Mehr Infos zu diesem Kriterium findest du auch auf der folgenden englischen WAI-Seite zum WCAG-Kriterium 1.4.4 Textgröße ändern.