Tek Tuşlu Kısayollar ve ADA

Yanlış tetiklenen kısayollar

Birçok belge görüntüleyici ve dava yönetim sistemi, indirmek için d ya da aramaya gitmek için / gibi klavye kısayolları ekler. Dikte eden biri için konuşulan bir cümle bir dizi tuş vuruşuna dönüşebilir ve rastgele bir harf silme, arşivleme ya da sayfadan ayrılmaya yol açabilir. Tek parmakla ya da ağızla tuşlayan kişiler de yanlışlıkla tuşlara basar.

2.1.4 başarı ölçütü, kısayol yalnızca karakter tuşlarından oluşuyorsa geçerlidir: harfler, rakamlar, noktalama ya da simgeler; g sonra a gibi diziler de buna dahildir. Soru işareti üretmek için Shift+/ kullanmak da karakter sayılır. Bu durumda üç şeyden en az biri doğru olmalıdır.

• Kapatma: kısayolu devre dışı bırakmanın bir yolu vardır.
• Yeniden atama: kısayolu Ctrl ya da Alt gibi yazdırılamayan bir tuşu içerecek biçimde yeniden atamanın bir yolu vardır.
• Yalnızca odakta etkin: bir bileşenin kısayolu yalnızca o bileşen odaktayken çalışır.

Zaten Ctrl ya da Alt gibi bir değiştirici gerektiren kısayollar etkilenmez.

Kamu araçlarında tek tuşlu kısayollar nerede çıkar

• İndirmek için d, yazdırmak için p tuşlu mahkeme e-dosyalama görüntüleyicileri.
• Sonuçlarda gezinmek için / ya da n kullanan kütüphane katalogları.
• Tek harfli varsayılanlarla gelen gömülü e-posta, bilet ya da belge araçları.
• "Yazmak için c'ye basın" gibi masaüstü uygulamalarını taklit eden web uygulamaları.

Kısayollar genellikle personel için kolaylık olarak eklenir ve olduğu gibi kamuya sunulur. Çoğu zaman ayarlarda görünür bir anahtar çözüm için yeterlidir.

Seçenek 1: kısayolları kapatan bir anahtar

Kullanıcı için saklanan ve herhangi bir kısayol çalışmadan önce dikkate alınan bir tercih. Bunu klavyeyle erişilebilen bir yere, örneğin sayfadaki bir "Klavye kısayolları" ayarına koyun.

document.addEventListener("keydown", e => {
  if (e.key === "d") downloadDocument();
  if (e.key === "p") printDocument();
});

const prefs = JSON.parse(
  localStorage.getItem("docketPrefs") || '{"shortcuts":true}'
);
shortcutToggle.checked = prefs.shortcuts;
shortcutToggle.addEventListener("change", () => {
  prefs.shortcuts = shortcutToggle.checked;
  localStorage.setItem("docketPrefs", JSON.stringify(prefs));
});

document.addEventListener("keydown", e => {
  if (!prefs.shortcuts) return;
  if (e.ctrlKey || e.metaKey || e.altKey) return;
  if (e.target.closest("input, textarea, select, [contenteditable]")) return;
  if (e.key === "d") downloadDocument();
  if (e.key === "p") printDocument();
});

Seçenek 2: tuşları kullanıcı seçsin

Sabit kodlu bir harita, kullanıcının düzenleyebildiği bir haritaya dönüşür. Atamalarda değiştirici tuş kullanılabilmelidir.

const KEYS = { d: downloadDocument, p: printDocument };
document.addEventListener("keydown", e => KEYS[e.key]?.());

// Kullanıcının ayar sayfasından yüklenir, örn. {"Alt+KeyD": "download"}
const bindings = loadBindings();
const actions = { download: downloadDocument, print: printDocument };

document.addEventListener("keydown", e => {
  const combo = (e.ctrlKey ? "Ctrl+" : "") +
                (e.altKey ? "Alt+" : "") + e.code;
  const name = bindings[combo];
  if (name) { e.preventDefault(); actions[name](); }
});

Seçenek 3: yalnızca bileşen odaktayken çalışsın

Sonraki sayfa için "n", önceki sayfa için "p" destekleyen bir sonuç listesi, tuşlar belgenin tamamına değil listenin kendisine bağlıysa bu davranışı koruyabilir.

document.addEventListener("keydown", e => {
  if (e.key === "n") nextPage();
  if (e.key === "p") prevPage();
});

const results = document.getElementById("results");   // tabindex="0"
results.addEventListener("keydown", e => {
  if (e.key === "n") nextPage();   // yalnızca liste odaktayken
  if (e.key === "p") prevPage();
});

Mobil uygulamalarda donanım klavyesi

Uygulamalar da kapsamdadır. Donanım klavyeli tabletler ve telefonlar aynı riski taşır. iOS ve Android'de varsayılan olarak bir değiştirici tuş isteyin. Compose'da onKeyEvent yalnızca o düğüm ya da çocuklarından biri odaktayken olay alır; bu yüzden onu odağın gerçekten bulunduğu yere bağlayın.

SwiftUI:

Button("İndir") { download() }
    .keyboardShortcut("d", modifiers: [])

Button("İndir") { download() }
    .keyboardShortcut("d", modifiers: .command)

Jetpack Compose:

Modifier.onKeyEvent { event ->
    if (event.type == KeyEventType.KeyDown && event.key == Key.D) {
        download(); true
    } else false
}

Modifier.onKeyEvent { event ->
    if (event.type == KeyEventType.KeyDown &&
        event.isCtrlPressed && event.key == Key.D) {
        download(); true
    } else false
}

Nasıl test edilir

1. Ürünün belgelediği her kısayolu listeleyin; belgelenmemişleri bulmak için kodda keydown ve keypress işleyicilerini arayın. Değiştirici tuşla etkinleşen erişim tuşları etkilenmez.
2. Sayfa gövdesine tıklayın, her düz harfe, rakama ve simgeye basın ve ne olduğunu not edin. Sonra Shift+harf deneyin.
3. Tetiklenen her kısayol için, onu uyumlu yapan anahtarı, yeniden atama alanını ya da odak koşulunu bulun.
4. Ses girişi yazılımınız varsa sayfada bir cümle dikte edin ve herhangi bir komutun çalışıp çalışmadığına bakın.

Otomatik araçlar bir betiğin tuş vuruşuyla ne yaptığını göremez; bu yüzden bu test elle yapılır.

Sık yapılan hatalar ve yayın öncesi liste

• Shift+/ ya da AltGr kombinasyonlarını değiştiricili kısayol saymak. Bunlar yine de bir karakter üretir.
• Kapatma anahtarını ayarda değil, yalnızca uzun bir yardım makalesinde sunmak.
• Kısayolları yalnızca bir oturum için kapatmak, böylece sonraki sayfa yüklemesinde yeniden açılması.
• Bir metin alanı odaktayken de kısayolların çalışmasına izin vermek, böylece yazmanın eylem tetiklemesi.

Her tek tuşlu kısayol kapatılabiliyor, değiştirici ile yeniden atanabiliyor ya da yalnızca kendi bileşeni odaktayken çalışıyorsa ve seçim kaydediliyorsa yayına alın.

Bu A düzeyi ölçütün standart içindeki yeri için WCAG 2.1 AA ve ADA sayfasına bakın.

Kaynaklar

• Understanding SC 2.1.4: Character Key Shortcuts (W3C), İngilizce, yeni sekmede açılır
• 28 CFR Part 35, Subpart H: Accessibility of Web Information and Services (eCFR), İngilizce, yeni sekmede açılır

Standart sürümü: WCAG 2.1 (W3C Tavsiye Kararı, 5 Haziran 2018); Title II web kuralında adı geçen sürüm. Bu sayfa bilgilendirme amaçlıdır ve hukuki tavsiye niteliği taşımaz. Bağlayıcı metin için ADA yasasının ve yönetmeliklerinin resmî metinlerini esas alın ve size nasıl uygulandığını bir avukata sorun.