Skip to main content
Çalıştırılabilir WCAG 2.5.4

2.5.4 Hareket Etkinleştirme

Cihaz hareketi veya kullanıcı hareketi ile çalıştırılabilen işlevler, kullanıcı arayüzü bileşenleri ile de çalıştırılabilmeli ve kazara etkinlestirmeyi önlemek için harekete yanıt verme devre dışı bırakılabilmelidir.

Level A Serious WCAG 2.1 (new) WCAG 2.2

Bu kural ne anlama geliyor

WCAG 2.5.4, cihaz hareketi (egme, sallama veya cihazı hareket ettirme) veya kullanıcı hareketi (kamera tarafından algilanan hareketler) tarafından tetiklenen her işlevin, düğmeler, bağlantılar veya form kontrolleri gibi standart kullanıcı arayüzü bileşenleri aracılığıyla da kullanılabilir olmasını gerektirir. Kullanıcılar ayrıca kazara etkinlestirmeyi önlemek için hareket tabanlı yanıtı devre dışı birakabilmelidir.

Örneğin, telefonu sallamak "geri al" eylemini tetikliyorsa, ekranda bir geri al düğmesi de olmalıdır. Cihazi egmek içeriği kaydiriyorsa, standart kaydırma kontrolleri de mevcut olmalıdır. Tek istisna, hareketin işlev için zorunlu olması durumudur (örneğin, adım sayan bir pedometre).

Neden önemlidir

Cihazlarını tekerlekli sandalyelere monte eden kullanıcılar bunları egip sallayamaz. Titreme veya istemsiz hareketleri olan kullanıcılar hareket tabanlı eylemleri yanlislikla tetikleyebilir. Sınırlı hareketliligi olan kullanıcılar gerekli fiziksel hareketi hiç gerçekleştiremeyebilir.

Ayrıca bazı kullanıcılar cihazları sabit konumlarda kullanır — masa standinda, arabada monte edilmiş veya yardımcı cihaz tutucusuna sabitlenmiş. Hareket tabanlı işlevsellik, arayüz tabanlı bir alternatif olmadan bu kullanıcılar için tamamen erişilemez olurdu.

İlgili axe-core kuralları

Bu kriter için otomatik axe-core kuralı bulunmamaktadır. Hareket tabanlı etkilesimlerin tespiti, DeviceMotion, DeviceOrientation veya kamera tabanlı hareket algilama API lerinin kullanimlarini belirlemek için manuel kod incelemesi ve test gerektirir.

Nasıl test edilir

  1. Uygulamayı cihaz hareketine (sallama, egme, döndürme) veya kullanıcı hareketine (kamera hareketleri) yanıt veren özellikler için inceleyin.
  2. Her hareket tetikli özellik için eşdeğer bir ekran üzerinde kontrolün var olduğundan emin olun.
  3. Hareket tabanlı yanıtları devre dışı bırakmak için bir ayar veya tercihin mevcut olduğundan emin olun.
  4. Kod tabanında DeviceMotionEvent, DeviceOrientationEvent ve kamera/hareket API lerini arayın.
  5. Cihazi sabit tutarak test edin ve tüm işlevselliğin UI kontrolleri aracılığıyla hala erişilebilir olduğundan emin olun.

Nasıl düzeltilir

Hareket tabanlı özellikler için UI kontrol alternatifleri ve hareket algilamayi devre dışı birakmanin bir yolunu sağlayın.

Sallayarak geri alma — yanlış uygulama

// Yalnızca sallama hareketi geri almayi tetikler, UI alternatifi yok
window.addEventListener('devicemotion', (e) => {
  const ivme = e.accelerationIncludingGravity;
  if (Math.abs(ivme.x) > 15 || Math.abs(ivme.y) > 15) {
    sonEylemiGeriAl();
  }
});

Sallayarak geri alma — doğru uygulama

// Tercih kontrolü ile hareket algilama
let hareketEtkin = kullaniciTercihiniAl('hareketEtkin', true);

if (hareketEtkin) {
  window.addEventListener('devicemotion', (e) => {
    const ivme = e.accelerationIncludingGravity;
    if (Math.abs(ivme.x) > 15 || Math.abs(ivme.y) > 15) {
      sonEylemiGeriAl();
    }
  });
}

// UI alternatifi her zaman mevcut
geriAlBtn.addEventListener('click', () => {
  sonEylemiGeriAl();
});

Hareket özellikleri için ayar geçişi

<fieldset>
  <legend>Hareket tercihleri</legend>
  <label>
    <input type="checkbox" id="hareket-geçişi" checked>
    Sallayarak geri al ve egerek kaydır özelliklerini etkinleştir
  </label>
</fieldset>

<script>
  document.getElementById('hareket-geçişi')
    .addEventListener('change', (e) => {
      kullaniciTercibiniAyarla('hareketEtkin', e.target.checked);
      if (!e.target.checked) {
        hareketDinleyicileriniDevreDisiiBirak();
      } else {
        hareketDinleyicileriniEtkinlestir();
      }
    });
</script>

Sık yapılan hatalar

  • Ekran üzerinde düğme olmadan sallayarak geri almayi tek geri alma mekanizması olarak uygulamak.
  • Standart kaydırma çubukları veya sayfalama olmadan içerik gezintisi için egerek kaydırmayı kullanmak.
  • Kamera tabanlı hareket kontrollerini (el sallayarak kapatma, bas sallayarak onaylama) düğme alternatifleri olmadan sunmak.
  • Hareket algilamayi devre dışı birakmanin yolunu sağlamamak, titremeli kullanıcıların eylemleri yanlislikla tetiklemesine neden olmak.
  • Hareket tabanlı ozelliklerin sabit konumlara monte edilmiş cihazlar için tamamen kullanılamaz olduğunu unutmak.

Kaynaklar