WCAG 2.1 - 2.2.1
Timing Adjustable
Für jede Zeitgrenze, die durch den Inhalt festgelegt wird, ist mindestens eines der folgenden wahr:
Inhalt
Was steht in den Guidelines zum Success Criterium 2.2.1 - Timing Adjustable?Was Bedeutet das Success Criterium 2.2.1 - Timing Adjustable?Warum ist es so wichtig, das Success Criterium 2.2.1 - Timing Adjustable zu beachten?Was hat das Success Criterium 2.2.1 - Timing Adjustable mit dem BFSG zu tun?Lösungen für 2.2.1 - Timing Adjustable anhand von CodebeispielenWie löse ich Verstöße gegen das Success Criterium 2.2.1 - Timing Adjustable?Was steht in den Guidelines zum Success Criterium 2.2.1 - Timing Adjustable?
Implementationshinweise
- Turn off: Der Benutzer darf die Zeitbegrenzung ausschalten, bevor er ihr begegnet; oder
- Adjust: Der Benutzer darf die Zeitgrenze vor dem Eintreten über einen weiten Bereich anpassen, der mindestens das Zehnfache der Länge der Standardeinstellung beträgt; oder
- Extend: Der Benutzer wird gewarnt, bevor die Zeit abläuft, und erhält mindestens 20 Sekunden, um die Frist mit einer einfachen Aktion (zum Beispiel „drücken Sie die Leertaste“) zu verlängern, und der Benutzer darf die Frist mindestens zehnmal verlängern; oder
- Real-time Exception: Die Zeitgrenze ist ein erforderlicher Bestandteil eines Echtzeitevents (zum Beispiel einer Auktion), und es ist keine Alternative zur Zeitgrenze möglich; oder
- Essential Exception: Die Frist ist entscheidend, und eine Verlängerung würde die Aktivität ungültig machen; oder
- 20 Hour Exception: Die Zeitgrenze beträgt mehr als 20 Stunden.
Was Bedeutet das Success Criterium 2.2.1 - Timing Adjustable?
Websites und Webanwendungen stellen Nutzern manchmal für bestimmte Aufgaben eine begrenzte Zeit zur Verfügung – zum Beispiel bei Formularen, bei denen man sich nach kurzer Zeit automatisch abmelden muss, oder bei Quiz-/Testfunktionen. Das Success Criterion 2.2.1 fordert, dass für solche zeitabhängigen Abläufe mindestens eine von mehreren Anpassungsmöglichkeiten verfügbar ist:
- Der Nutzer kann die Zeit verlängern oder aufheben (z.B. "Mehr Zeit anfordern"-Button).
- Der Nutzer wird vor Ablauf deutlich gewarnt und kann die Zeit dann verlängern.
- Der Nutzer kann vorher ganz deaktivieren, dass ein Zeitlimit existiert.
Das Ziel: Menschen, die z. B. langsamer lesen oder mit Hilfsmitteln navigieren, sind nicht benachteiligt und können Aufgaben ohne (unnötigen) Zeitdruck erledigen.
Eine Ausnahme bilden Verfahren, die technisch zwingend ein Zeitlimit benötigen (z. B. Online-Auktionen), oder wenn das Zeitlimit bei über 20 Stunden liegt.
Warum ist es so wichtig, das Success Criterium 2.2.1 - Timing Adjustable zu beachten?
Viele Menschen benötigen aus unterschiedlichen Gründen mehr Zeit, um Informationen zu erfassen oder Formulare auszufüllen – zum Beispiel Menschen mit motorischen Einschränkungen, Leseschwierigkeiten, kognitiven Beeinträchtigungen oder ältere Nutzer. Ist zu wenig Zeit für diese Aufgaben vorhanden oder läuft ein Prozess unerwartet ab, kann das zu Frustration oder im schlimmsten Fall zum Abbruch führen. Eine anpassbare Zeitvorgabe sichert gleiche Bedingungen für alle.
Was hat das Success Criterium 2.2.1 - Timing Adjustable mit dem BFSG zu tun?
Das Barrierefreiheitsstärkungsgesetz (BFSG) verpflichtet Anbieter in Deutschland zur Einhaltung der WCAG-Konformität – und damit auch zu diesem Kriterium. Ohne die Umsetzung der anpassbaren Zeitlimits werden Nutzergruppen systematisch ausgeschlossen, was einen klaren Verstoß gegen das BFSG darstellt. Eine so aufgebaute Website kann also nicht als barrierefrei und BFSG-konform gelten.
Lösungen für 2.2.1 - Timing Adjustable anhand von Codebeispielen
Falscher Code
<form action="/absenden" method="post">
<!-- User hat 60 Sekunden Zeit, das Formular zu senden -->
<!-- Keine Möglichkeit, das Zeitlimit zu verlängern oder zu deaktivieren -->
<!-- Keine Vorwarnung -->
<!-- Nach Ablauf wird automatisch abgesendet oder abgebrochen -->
</form>
Korrekter Code
<form action="/absenden" method="post" id="myForm">
<!-- Zeitlimit ist per Default aktiviert -->
<p id="timerWarning">Sie haben noch 60 Sekunden Zeit. Brauchen Sie mehr Zeit? <button type="button" onclick="extendTime()">Mehr Zeit anfordern</button></p>
<!-- Skript zeigt kurz vor Ablauf eine verständliche Warnung und bietet Verlängerung an -->
</form>
Im schlechten Beispiel läuft das Zeitlimit ohne Hinweis oder Verlängerungsmöglichkeit ab. Nutzer mit Einschränkungen könnten die Aufgabe nicht rechtzeitig beenden. Das Gute Beispiel informiert frühzeitig und ermöglicht eine unkomplizierte Verlängerung – das erfüllt die WCAG-Anforderung.
Falscher Code
<script>
setTimeout(function(){
// Benutzer wird ausgeloggt, ohne Warnung oder Verlängerungsoption
window.location.href = '/logout';
},60000);
</script>
Korrekter Code
<script>
let timer = setTimeout(function(){
if(confirm('Ihre Sitzung läuft gleich ab. Benötigen Sie mehr Zeit?')){
// Zeitlimit um weitere 60 Sekunden verlängern
resetTimer();
} else {
window.location.href = '/logout';
}
},55000); // Frühzeitige Warnung nach 55 Sekunden
function resetTimer(){
clearTimeout(timer);
timer = setTimeout(function(){
window.location.href = '/logout';
},60000);
}
</script>
Hier wird im schlechten Beispiel ein Nutzer nach Ablauf des Zeitlimits kommentarlos ausgeloggt. Die gute Lösung gibt dem Nutzer rechtzeitig eine verständliche Warnung und bietet an, die Sitzung zu verlängern.
Wie löse ich Verstöße gegen das Success Criterium 2.2.1 - Timing Adjustable?

Unser Accessibility Audit bietet Ihnen die Möglichkeit, mittels unseres AI-basierten Barrierefreiheits-Assistenten, vollautomatisch konkrete Lösungsvorschläge für Ihre Seite zu erstellen. Dafür scannen wir Ihre Website und ihren Quellcode, finden Problemstellen und zeigen Ihnen anhand Ihres eigenen Websitecode fertige Lösungen zum Kopieren und Einfügen. Starten Sie jetzt den Accessibility Audit kostenlos.