Bu kural ne anlama geliyor

WCAG 2.2.4, kullanıcıların uyarilar, bildirimler, canlı guncellemeler ve dikkat gerektiren diğer içerik değişiklikleri gibi kesintileri erteleyebilmesini veya bastirabilmesini gerektirir. Tek istisna gerçek acil durumlar içindir — saglik, güvenlik veya veri butunlugu hakkında aninda kullanıcı farkindaligu gerektiren uyarilar.

Bu, push bildirimleri, toast mesajları, sohbet acilik pencereleri, tanıtım katmanları, sistem uyarıları, canlı içerik güncellemeleri ve kullanıcının dikkatini mevcut gorevinden saptiran herhangi bir mekanizma için geçerlidir. Kullanıcılar bu kesintileri kapatma, daha sonraya zamanlama veya güncellemeleri kontrol etmeyi secene kadar gorumemelerini sağlamak için bir yola sahip olmalıdır.

Neden önemlidir

Kesintiler özellikle bilişsel engelli ve dikkat eksikliği bozukluğu olan kullanıcılar için rahatsız edicidir. Her bildirim veya uyarı, toparlanmak için önemli zihinsel caba gerektirebilecek bir bağlam değişikliği zorlar. Bellek bozukluğu olan kullanıcılar, kesintiye ugradiktan sonra ne yaptiklarin tamamen unutabilir ve gorevlerine bastan başlamak zorunda kalabilir.

Ekran okuyucu kullanıcıları özellikle etkilenir çünkü ARIA canlı alanlarını tetikleyen bildirimler, ekran okuyucunun o anda okudugunu keser. Engeli olmayan kullanıcılar bile sürekli kesintilere maruz kaldiginda azalan uretkenlik ve artan stres yasarlar. Araştırmalar, bir kesintiden sonra odağı tamamen yeniden kazanmanin ortalama 23 dakika aldidini göstermektedir.

İlgili axe-core kuralları

Bu kriter için otomatik axe-core kuralı bulunmamaktadır. Kesinti davranisi, çalışma zamani JavaScript mantigi, push bildirim API'leri ve statik DOM analizi ile tespit edilemeyen sunucu tarafı olay sistemlerine bağlıdır.

Nasıl test edilir

Test, tüm kesinti kaynaklarini belirlemek için sayfa üzerinde zaman icerisinde izleme gerektirir.

Uygulamayı uzun bir süre kullanın ve her bildirim, uyarı, açılır pencere veya istenmeyen içerik değişikliğini not edin.
Her kesinti için bunu kapatmak veya ertelemek için bir ayar olup olmadığını kontrol edin.
Bildirim tercihlerinin mevcut ve işlevsel olduğunu doğrulayın (örneğin "Rahatsiz etmeyin" modu).
ARIA canlı alanlarının uygun şekilde kullanıldığını ve kullanıcı tercihi ile bastirilabilecegini kontrol edin.
Kesintilerin kontrol edilebilecegini ve okuma akışını kontrolsuz şekilde bozmadidini doğrulamak için bir ekran okuyucu ile test edin.

Nasıl düzeltilir

Kullanıcıların kesintileri ne zaman ve nasıl alacaklarini kontrol etmelerine olanak tanıyan kapsamlı bildirim tercihleri sağlayın.

Bildirim tercihleri

<fieldset>
  <legend>Bildirim Tercihleri</legend>

  <label>
    <input type="checkbox" id="bildirim-etkin" checked
      onchange="bildirimleriAcKapa(this.checked)">
    Bildirimleri etkinleştir
  </label>

  <fieldset id="bildirim-secenekleri">
    <legend>Etkinlestirildiginde bildirimleri göster:</legend>
    <label>
      <input type="checkbox" name="bildirim-türü"
        value="mesajlar" checked> Yeni mesajlar
    </label>
    <label>
      <input type="checkbox" name="bildirim-türü"
        value="guncellemeler"> İçerik güncellemeleri
    </label>
    <label>
      <input type="checkbox" name="bildirim-türü"
        value="tanitimlar"> Tanitimlar
    </label>
  </fieldset>

  <label>
    <input type="checkbox" id="re-modu"
      onchange="rahatsizEtmeyinModuAcKapa(this.checked)">
    Rahatsiz etmeyin modu
  </label>
</fieldset>

Kontrol edilebilir bildirim sistemi

class BildirimYoneticisi {
  constructor() {
    this.etkin = true;
    this.rahatsizEtmeyin = false;
    this.kuyruk = [];
    this.izinVerilenTurler = new Set(['mesajlar', 'guncellemeler']);
  }

  bildir(mesaj, tür = 'bilgi', acilDurum = false) {
    // Acil durumlar her zaman gösterilir
    if (acilDurum) {
      this.bildirimiGoster(mesaj, 'acil');
      return;
    }

    // Kullanıcı tercihlerine say
    if (!this.etkin || !this.izinVerilenTurler.has(tür)) return;

    if (this.rahatsizEtmeyin) {
      this.kuyruk.push({ mesaj, tür });
      return;
    }

    this.bildirimiGoster(mesaj, tür);
  }

  kuyruklanmislariGoster() {
    this.kuyruk.forEach(öğe =>
      this.bildirimiGoster(öğe.mesaj, öğe.tür)
    );
    this.kuyruk = [];
  }
}

Sık yapılan hatalar

Ayarlarda devre dışı bırakma yolu olmadan otomatik olarak görünen toast bildirimleri.
Bastirma tercihi olmadan istenmeyen şekilde açılan sohbet bilesenelri.
Davranis üzerinde kullanıcı kontrolü olmadan sürekli guncelemeleri duyuran ARIA canlı alanları.
Zamanlı araliklarla görünen ve vazgecme mekanizması olmayan tanıtım katmanları veya bannerler.
Duraklatma veya gruplama yolu olmadan güncellemeleri iten gerçek zamanlı içerik akışları.
Bağlam olmadan sayfa yüklemesinde hemen istenen tarayıcı push bildirimleri.

2.2.4 Kesintiler