WCAG 2.2.1: Zamanlama Ayarlanabilir

Bu Kuralın Anlamı

WCAG 2.2.1 Zamanlama Ayarlanabilir, İlke 2: Kullanılabilir başlığı altında Seviye A başarı ölçütüdür. İçerik tarafından belirlenen her zaman sınırı için aşağıdakilerden en az birinin doğru olmasını şart koşar: kullanıcı zaman sınırına maruz kalmadan önce bu sınırı kapatabilmelidir; kullanıcı zaman sınırını geniş bir aralıkta (varsayılan ayarın en az on katı) ayarlayabilmelidir; ya da kullanıcı, süre dolmadan önce basit bir eylemle — örneğin bir tuşa basarak veya bir düğmeye tıklayarak — zaman sınırını uzatabilmeli ve en az 20 saniye önceden uyarılmalı, ayrıca en az on kez uzatma seçeneğine sahip olmalıdır.

Pratikte bu ölçüt, oturum zaman aşımı uygulayan, zamanlanmış slaytları olan otomatik ilerleyen bir karuseli bulunan, kendiliğinden temizlenen veya gönderilen bir formu olan, ödeme sayfasında geri sayım sayacı içeren, duraklatılamayan zamanlanmış altyazıları olan bir medya oynatıcısı veya kullanıcının bir görevi tamamlaması için sahip olduğu süreyi kısıtlayan herhangi bir mekanizmaya sahip tüm web arayüzleri için geçerlidir. Sayfanız veya uygulamanız, süresi dolduğunda içeriği kaldıran, kullanıcıyı oturumdan çıkaran veya kullanıcının rızası olmadan onu yeni bir duruma ilerleten bir zamanlayıcı ayarlıyorsa, bu sınırı ayarlamak veya uzatmak için bir yol sunmanız gerekir.

Ölçüt ayrıca, yukarıda açıklanan ayarlama mekanizmaları olmaksızın bir zaman sınırının kalmasına izin verebilecek üç önemli istisadı tanımlar. Birincisi, gerçek zamanlı istisna: zaman sınırı gerçek zamanlı bir etkinliğin (canlı açık artırma veya eşzamanlı çevrimiçi sınav gibi) gerekli bir parçasıysa, zamanı ayarlamak etkinliğin kendisini geçersiz kılacak ve hiçbir alternatif uygulanabilir olmayacaktır. İkincisi, esaslı istisna: zaman sınırı esassa ve bunun uzatılması etkinliği geçersiz kılacaksa — örneğin, tepki hızını ölçmenin amacın kendisi olduğu zamanlı bir beceri testi. Üçüncüsü, 20 saatlik istisna: zaman sınırı 20 saatten uzunsa, kullanıcılar üzerindeki yükün asgari olduğu kabul edilir ve ayarlama kontrolleri gerekli değildir.

Başarılı bir durum, zaman sınırlı bir etkileşimin, kullanıcıya zaman kısıtlamasını devre dışı bırakma, uzatma veya ayarlama imkânı veren — ideal olarak sınırla karşılaşılmadan önce sunulan — net bir mekanizma sağlamasıyla gerçekleşir. Başarısız bir durum ise, içerik otomatik olarak sona erdiğinde, yönlendirme yaptığında, kullanıcıyı oturumdan çıkardığında veya yukarıdaki üç ayarlama seçeneğinden hiçbirini sunmadan ilerlediğinde ve üç istisnadan hiçbiri geçerli olmadığında ortaya çıkar.

Neden Önemlidir

Zaman sınırları, engelli kişileri orantısız şekilde etkiler. Ekran okuyuculara güvenen kullanıcılar, içeriği doğrusal olarak dinledikleri ve tanıdık olmayan arayüzleri sırasıyla keşfetmek zorunda oldukları için, sayfalarda genellikle gören kullanıcılardan daha yavaş gezinirler. Anahtarlama cihazları, göz izleme yazılımları, ağız çubukları veya sesle kontrol yazılımları kullananlar da dahil olmak üzere motor bozukluğu olan kullanıcılar, bir form alanını doldurmak, bir satın almayı onaylamak veya bir sonraki adıma geçmek için önemli ölçüde daha fazla zamana ihtiyaç duyabilirler. Disleksi, dikkat eksikliği durumları veya hafıza bozuklukları gibi bilişsel veya öğrenme güçlüğü olan kullanıcılar, talimatları okumak, anlamak ve yanıtlamak için ek zamana ihtiyaç duyabilirler. Yaşlı yetişkinler de aynı görevler için genellikle daha fazla zamana ihtiyaç duyar ve küresel internet nüfusunun hızla büyüyen bir kesimini oluştururlar.

Somut bir gerçek dünya senaryosunu düşünün: Serebral palsili bir kişi, bir Türk havayolu şirketinin web sitesinde uçuş rezervasyonu yapıyor. Ödeme oturumu, beş dakikalık hareketsizlikten sonra otomatik olarak sona eriyor. Kullanıcı, bir baş işaretleyici cihazıyla yavaşça yazarak adını, pasaport numarasını ve ödeme bilgilerini girmiş durumda — ve ardından sayfa yeniden yükleniyor, tüm verileri temizliyor ve kullanıcıyı ana sayfaya geri döndürüyor. Sadece harcanan emek boşa gitmekle kalmıyor, kullanıcının siteye olan güveni de sarsılıyor ve satın almayı hiç tamamlayamayabilir. Bu, dijital ticarete eşit katılımın önünde doğrudan bir engeldir.

Etkisi bireysel kullanıcıların ötesine uzanır. Dünya Sağlık Örgütü’ne göre, dünya genelinde yaklaşık 1,3 milyar insan, önemli bir engellilik biçimiyle yaşamaktadır. Yalnızca Türkiye’de, TÜİK’in resmi istatistikleri, 8,5 milyondan fazla insanın günlük aktiviteleri etkileyen bir engeli olduğunu göstermektedir. Zaman sınırlı arayüzler, herhangi bir web uygulamasının potansiyel kullanıcı tabanının ölçülebilir bir bölümünü dışlar.

Erişilebilirliğin ötesinde, keyfi zaman sınırlarını kaldırmak veya ayarlanabilir hale getirmek, düşük bant genişlikli ortamlardaki kullanıcılar, geçici olarak motor fonksiyonu bozulmuş kullanıcılar (örneğin kırık kol) ve yalnızca bir görev sırasında kesintiye uğrayan kullanıcılar için de fayda sağlar. Kullanılabilirlik iyileştirmeleri geniş kapsamlıdır ve form terk oranlarını azaltabilir, e-ticaret sitelerinde dönüşüm oranlarını artırabilir ve müşteri destek hacimlerini düşürebilir.

İlgili Axe-core Kuralları

WCAG 2.2.1 manuel test gerektirir. Axe-core, Lighthouse ve benzeri motorlar dahil olmak üzere otomatik araçlar, zaman sınırları çoğunlukla sunucu tarafı oturum mantığında, eşzamansız çalışan JavaScript’te veya üçüncü taraf entegrasyonlarında uygulandığı için zamanlama ihlallerini güvenilir şekilde tespit edemez. Araç, yalnızca DOM’u inceleyerek veya statik analiz çalıştırarak bir sayfanın beş dakika içinde sona ereceğini ya da bir karuselin kullanıcı girdisi olmadan ilerleyeceğini gözlemleyemez. Aşağıdaki hususlar, test uzmanlarının manuel olarak değerlendirmesi gerekenleri açıklar.

• Oturum zaman aşımları (manuel): Test uzmanları, sayfanın önceden uyarı gösterip göstermediğini, bir uzatma seçeneği sunup sunmadığını ve kullanıcıya yanıt vermesi için en az 20 saniye sağlayıp sağlamadığını belirlemek için bir oturum zaman aşımını beklemeli veya simüle etmelidir. Hiçbir otomatik kural, zaman aşımını gerçekten beklemeden oturum süresini veya bir uyarı iletişim kutusunun zamanında görünüp görünmediğini belirleyemez.
• Otomatik ilerleyen karuseller ve kaydırıcılar (manuel): Test uzmanları, karusellerin otomatik olarak ilerleyip ilerlemediğini ve eğer öyleyse, bir duraklatma veya durdurma kontrolünün mevcut olup olmadığını ve klavye ile erişilebilir olup olmadığını gözlemlemelidir. Axe-core, karusel bileşenlerindeki bazı eksik ARIA özniteliklerini tespit edebilir, ancak zamanlanmış ilerlemenin kendisinin ayarlanabilir olup olmadığını belirleyemez.
• Otomatik gönderilen veya otomatik temizlenen formlar (manuel): Bir form, belirli bir hareketsizlik süresinden sonra içeriğini gönderiyor veya temizliyorsa, test uzmanı bu davranışı gözlem veya kod incelemesiyle tespit etmelidir. Yalnızca DOM, bu davranışı otomatik bir tarayıcıya göstermez.
• İşlemsel akışlardaki geri sayım sayaçları (manuel): Ödeme sayfaları, bilet rezervasyon akışları ve sınav ortamları sıklıkla geri sayım sayaçları içerir. Bu sayaçların esaslı olup olmadığı (ve dolayısıyla muaf) ya da bir uzatma mekanizması gerektirip gerektirmediği, hem uygulamanın hem de iş bağlamının insan tarafından incelenmesini gerektiren bir yargı meselesidir.

Nasıl Test Edilir

1. Otomatik tarama temel çizgisi: Sayfadaki zamanlama sorunlarını ağırlaştırabilecek bilinen ARIA veya etkileşimli öğe ihlallerini belirlemek için sayfada axe DevTools veya Lighthouse çalıştırın. Bu araçların zaman sınırının kendisini işaretlemeyeceğini, ancak diğer erişilebilirlik sorunları için bir temel çizgi oluşturmaya yardımcı olduklarını unutmayın. Chrome DevTools’ta Lighthouse panelini açın, Accessibility’yi seçin ve denetimi çalıştırın. Axe DevTools’ta tarayıcı uzantısını etkinleştirin, Analyze’a tıklayın ve sonuçları inceleyin — zamanlamaya özgü hiçbir kural görünmeyecek, bu da manuel testin gerekli olduğunu doğrular.
2. Tüm zaman sınırlarını belirleyin: Her zaman sınırını belirlemek için sayfanın JavaScript kaynağını, ağ isteklerini ve sunucu tarafı oturum yapılandırmasını inceleyin. Yaygın konumlar arasında JavaScript’teki setTimeout ve setInterval çağrıları, arka uç çerçevelerindeki oturum sona erme ayarları, çerez sona erme değerleri ve ödeme işlemcileri veya sohbet bileşenleri gibi üçüncü taraf bileşen yapılandırmaları bulunur.
3. NVDA + Firefox ile oturum zaman aşımı uyarısını test edin: Siteyi Firefox’ta NVDA çalışırken açın. Çok adımlı bir formda veya kimlik doğrulamalı bir bölümde gezinin. Oturum uyarı iletişim kutusunu (veya uyarı yoksa zaman aşımının kendisini) bekleyin. NVDA’nın uyarıyı otomatik olarak — ideal olarak canlı bölge aracılığıyla — duyurduğunu ve kullanıcının, form verilerini kaybetmeden odaklanmış bir düğmede Enter veya Space tuşuna basarak oturumu uzatabildiğini doğrulayın.
4. VoiceOver + Safari (macOS/iOS) ile oturum zaman aşımı uyarısını test edin: Yukarıdaki testi, VoiceOver etkinleştirilmiş Safari’de tekrarlayın. Etkileşimli öğelerde gezinmek için rotor’u kullanın ve zaman aşımı uyarısının duyurulduğunu ve uzatma kontrolünün 20 saniyelik süre içinde erişilebilir olduğunu doğrulayın.
5. JAWS + Chrome ile oturum zaman aşımı uyarısını test edin: JAWS ile Chrome’da tekrarlayın. Odağın uyarı iletişim kutusuna taşındığını, JAWS’ın kalan süreyi ve uzatma seçeneğini okuduğunu ve uzatma düğmesini etkinleştirmenin, sayfa yenilemesi gerektirmeden oturumu aktif tuttuğunu doğrulayın.
6. Yalnızca klavye ile test edin (ekran okuyucu olmadan): Farenizi devre dışı bırakın ve tamamen Tab, Shift+Tab, Enter ve Space ile gezin. Herhangi bir uyarı iletişim kutusunun klavye ile erişilebilir olduğunu, uzatma düğmesinin odaklanabilir olduğunu ve oturum uzatıldıktan sonra odağın formda doğru konuma geri döndüğünü doğrulayın.
7. Karusel ve medya zamanlamasını test edin: Otomatik ilerleyen karuselleri belirleyin. Tab kullanarak karusele gidin. Bir duraklatma veya durdurma düğmesinin mevcut olduğunu ve fare olmadan erişilebilir olduğunu doğrulayın. Düğmeyi etkinleştirin ve ilerlemenin durduğunu doğrulayın. Karusel kullanıcı etkileşiminden sonra yeniden başlarsa, otomatik olarak yeniden başlamadığını doğrulayın.
8. İstisna uygulanabilirliğini doğrulayın: Bulunan her zaman sınırı için gerçek zamanlı, esaslı veya 20 saatlik istisnadan hangisinin geçerli olduğunu belirleyin. Gerekçenizi belgeleyin. Hiçbir istisna geçerli değilse ve hiçbir ayarlama mekanizması yoksa, bunu WCAG 2.2.1’in bir ihlali olarak kaydedin.

Nasıl Düzeltilir

Uyarısız Oturum Zaman Aşımı — Hatalı

<!-- Session expires silently after 5 minutes; page reloads with no warning -->
<script>
  setTimeout(function() {
    window.location.href = '/session-expired';
  }, 300000);
</script>

Uyarı ve Uzatma ile Oturum Zaman Aşımı — Doğru

<!-- Warn user 60 seconds before expiry; offer extension; announce via live region -->
<div
  id='session-warning'
  role='alertdialog'
  aria-modal='true'
  aria-labelledby='warning-title'
  aria-describedby='warning-desc'
  hidden
>
  <h2 id='warning-title'>Your session is about to expire</h2>
  <p id='warning-desc'>
    Your session will expire in <span id='countdown'>60</span> seconds.
    Select "Stay logged in" to continue your session.
  </p>
  <button id='extend-btn' type='button'>Stay logged in</button>
  <button id='logout-btn' type='button'>Log out now</button>
</div>

<script>
  var SESSION_DURATION = 300000; // 5 minutes
  var WARNING_BEFORE   = 60000;  // warn 60 seconds before
  var sessionTimer, warningTimer, countdownInterval;

  function startSessionTimer() {
    warningTimer = setTimeout(showWarning, SESSION_DURATION - WARNING_BEFORE);
    sessionTimer = setTimeout(expireSession, SESSION_DURATION);
  }

  function showWarning() {
    var dialog = document.getElementById('session-warning');
    dialog.hidden = false;
    document.getElementById('extend-btn').focus(); // move focus to dialog
    var seconds = 60;
    countdownInterval = setInterval(function() {
      seconds--;
      document.getElementById('countdown').textContent = seconds;
      if (seconds <= 0) clearInterval(countdownInterval);
    }, 1000);
  }

  function extendSession() {
    clearTimeout(sessionTimer);
    clearTimeout(warningTimer);
    clearInterval(countdownInterval);
    document.getElementById('session-warning').hidden = true;
    startSessionTimer();
    // Return focus to last active element
  }

  function expireSession() {
    window.location.href = '/session-expired';
  }

  document.getElementById('extend-btn').addEventListener('click', extendSession);
  document.getElementById('logout-btn').addEventListener('click', expireSession);
  startSessionTimer();
</script>

Kontrol Olmadan Otomatik İlerleyen Karusel — Hatalı

<!-- Slides advance every 4 seconds; no pause control; no keyboard access -->
<div class='carousel'>
  <div class='slide active'>Slide 1 content</div>
  <div class='slide'>Slide 2 content</div>
  <div class='slide'>Slide 3 content</div>
</div>

Duraklatma Kontrolü ile Otomatik İlerleyen Karusel — Doğru

<!-- Pause button stops auto-advance; button label updates to reflect state -->
<section aria-roledescription='carousel' aria-label='Featured announcements'>
  <div aria-live='off' aria-atomic='true'>
    <div class='slide active' role='group' aria-roledescription='slide' aria-label='Slide 1 of 3'>
      Slide 1 content
    </div>
    <div class='slide' role='group' aria-roledescription='slide' aria-label='Slide 2 of 3'>
      Slide 2 content
    </div>
    <div class='slide' role='group' aria-roledescription='slide' aria-label='Slide 3 of 3'>
      Slide 3 content
    </div>
  </div>
  <button id='carousel-pause' type='button' aria-pressed='false'>
    Pause slideshow
  </button>
</section>

<script>
  var paused = false;
  var btn = document.getElementById('carousel-pause');
  btn.addEventListener('click', function() {
    paused = !paused;
    btn.setAttribute('aria-pressed', paused.toString());
    btn.textContent = paused ? 'Play slideshow' : 'Pause slideshow';
    // toggle the carousel's auto-advance logic accordingly
  });
</script>

Uzatma Olmadan Zamanlı Ödeme Geri Sayımı — Hatalı

<!-- 10-minute checkout lock; no extension offered; not an essential exception -->
<p>Your items are reserved for: <span id='timer'>10:00</span></p>
<!-- Timer expires, cart is cleared silently -->

Uzatma Seçeneği ile Zamanlı Ödeme Geri Sayımı — Doğru

<!-- Warn before expiry and offer a one-click extension -->
<p>
  Your items are reserved for:
  <span id='timer' aria-live='polite' aria-atomic='true'>10:00</span>
</p>
<div id='extend-notice' hidden role='alert'>
  <p>Your reservation expires in 2 minutes.</p>
  <button type='button' id='extend-checkout'>Give me more time</button>
</div>
<!--
  When timer reaches 2:00, reveal #extend-notice.
  Clicking the button resets the reservation timer via an API call.
  aria-live='alert' ensures screen readers announce the warning immediately.
-->

Yaygın Hatalar

• Klavye odak yönetimi olmadan zaman aşımı uyarısı göstermek: Uyarı iletişim kutusu görsel olarak görünür, ancak odak asla ona taşınmaz; bu nedenle yalnızca klavye kullanan ve ekran okuyucu kullanan kullanıcılar, oturum sona ermeden önce oturumu uzatabileceklerini hiç fark etmezler.
• Zaman aşımı uyarısına yanıt vermek için 20 saniyeden az süre tanımak: “Oturum sona eriyor” uyarısını yalnızca oturum kapatılmadan 10 saniye önce göstermek, uzatma eylemi için en az 20 saniye sunulmasını gerektiren ölçütü karşılamaz.
• Etkileşim gerektiren bir zaman aşımı iletişim kutusunda role='alert' kullanmak: Alert rolü yalnızca okunur duyurular içindir; kullanıcı girdisi gerektiren bir iletişim kutusu, ekran okuyucuların bunu yanıt gerektiren bir modal olarak ele alması için aria-modal='true' ve aria-labelledby ile birlikte role='alertdialog' kullanmalıdır.
• Standart bir e-ticaret sepeti zamanlayıcısı için esaslı istisna iddia etmek: Bir alışveriş sepetindeki ürünleri 10 dakika boyunca rezerve etmek, hızın ölçülmesinin amacın kendisi olduğu gerçek bir esaslı etkinlik değil, ticari bir kolaylıktır. Burada esaslı istisnayı uygulamak yanlıştır; bir uzatma mekanizması gereklidir.
• Görünür, klavye ile erişilebilir bir duraklatma düğmesi olmadan karuseli otomatik ilerletmek: Yalnızca fareyle üzerine gelindiğinde görünen veya Tab sırasından çıkarılmış bir duraklatma düğmesi eklemek, ölçütü karşılamaz. Kontrol, işaretçi cihazı olmadan erişilebilir olmalıdır.
• Zaman aşımı sayacını herhangi bir fare hareketinde sıfırlayıp klavye olaylarında sıfırlamamak: Hareketsizlik zamanlayıcısını mousemove olaylarında uzatan, ancak keydown veya focus olaylarını yok sayan JavaScript, sayfada aktif olarak çalışan yalnızca klavye kullanan kullanıcılar için oturumları sessizce sona erdirecektir.
• Oturumu tam sayfa yenilemesiyle uzatmak: Kullanıcı “Oturum açık kalsın”a tıkladığında sayfanın yeniden yüklenmesi, kullanıcının formlara girdiği tüm verileri temizler. Uzatma, DOM durumunu koruyarak arka planda bir API çağrısı veya çerez yenilemesiyle gerçekleşmelidir.
• Kullanıcıya sunulmayan veya yapılandırılamayan setTimeout değerleri kullanmak: Kullanıcının daha uzun bir süre seçmesi için hiçbir arayüz kontrolü olmadan oturum süresini beş dakika olarak sabitlemek, üç ayarlama mekanizmasından (kapatma, ayarlama veya uzatma) biri mevcut olmadığı sürece ölçütü ihlal eder.
• Yayın öncesinde zaman aşımı akışını gerçek yardımcı teknolojilerle test etmemek: Yalnızca fareyle test yapan geliştiriciler, uyarı iletişim kutusunun ekran okuyucu kullanıcıları için erişilemez olduğunu fark etmeyebilir; çünkü görsel test, odak yönetimi hatalarını ortaya çıkarmaz.
• Gömülü üçüncü taraf bileşenlerin kendiliğinden uyumlu olduğunu varsaymak: İframe’ler veya betikler aracılığıyla gömülen ödeme işlemcileri, canlı sohbet bileşenleri ve rezervasyon motorları çoğunlukla kendi zaman sınırlarını uygular. Tam sayfanın — kontrol ettiğiniz gömülü içerik dahil — WCAG uyumundan sorumluluk, sayfa sahibine aittir.

Türkiye’nin Erişilebilirlik Mevzuatıyla İlişkisi

21 Haziran 2025’te 32933 sayılı Resmî Gazete’de yayımlanan Türkiye Cumhurbaşkanlığı Genelgesi 2025/10, Türkiye’de dijital hizmet sunan çok geniş bir kamu ve özel sektör kesimi için WCAG 2.2 Seviye AA ile uyumlu zorunlu web erişilebilirliği gereklilikleri getirir. WCAG 2.2.1 Zamanlama Ayarlanabilir, Seviye A ölçütüdür; bu da onu uyumun temel katmanına yerleştirir — kapsamdaki kuruluşların karşılaması gereken ilk gereklilikler arasındadır.

Genelge kapsamında, bakanlıklar, belediyeler, üniversiteler ve kamu iktisadi teşebbüsleri dahil olmak üzere kamu kurum ve kuruluşları, genelgenin yayım tarihinden itibaren bir yıl içinde tam uyum sağlamakla yükümlüdür. Düzenleme kapsamındaki özel sektör kuruluşlarının uyum için iki yıllık bir süresi vardır. Özel sektör kapsamı açıkça geniştir: e-ticaret platformlarını, bankalar ve finans kuruluşlarını, özel hastaneler ve sağlık hizmeti sağlayıcılarını, 200.000 veya daha fazla abonesi olan telekomünikasyon şirketlerini, seyahat acentelerini, özel yolcu taşımacılığı şirketlerini ve Millî Eğitim Bakanlığı (MoNE) yetkisiyle faaliyet gösteren özel okulları kapsar.

Bu kategorilerdeki kuruluşlar için WCAG 2.2.1’in ihlali, yalnızca en iyi uygulama eksikliği değil — düzenleyici incelemeye, resmî kanallar üzerinden şikâyetlere ve itibar kaybına yol açabilecek hukuki bir uyumsuzluktur. Bu ihlali tetiklemesi en muhtemel iş akışlarını düşünün: zamanlı sepet rezervasyonuna sahip bir e-ticaret ödemesi, bir müşteri ödeme formunu doldururken sessizce sona eren bir çevrimiçi bankacılık oturumu, motor bozukluğu olan bir kullanıcının kaydını tamamlamadan önce zaman aşımına uğrayan bir hastane randevu sistemi veya bir telekom sağlayıcısının, kullanıcıları sözleşme yönetimi akışından otomatik olarak oturumdan çıkaran self-servis portalı. Bunların her biri, genelgede açıkça adı geçen kuruluş türleri içinde makul bir başarısızlık senaryosudur.

Kuruluşlar, WCAG 2.2.1 uyumunu, sonradan yamalanacak teknik bir onay kutusu değil, oturum yönetimi politikalarında, üçüncü taraf bileşen tedarik gerekliliklerinde ve UI bileşen standartlarında mimari düzeyde ele alınması gereken bir tasarım gerekliliği olarak görmelidir. Denetim programları, otomatik taramaların ötesinde, tam da otomatik araçlar bu tür ihlalleri insan gözlemi olmadan tespit edemediği için, tüm zamanlı etkileşimlerin manuel testini içermelidir.