İçeriğe atlaİçeriğe atla

WCAG 2.4.11 · WCAG Modülü

Görünür odak göstergesi

Sekmeleri kullanarak gezinen kullanıcılar her zaman nerede olduklarını bilirler. Kaybolan çerçeve yok.

Bu nedir?

"Görünür Odak Göstergesi" ne anlama geliyor?

Odak göstergesi, klavye aracılığıyla hangi öğenin seçili olduğunu gösteren görünür işarettir. Tarayıcının varsayılan ayarı genellikle ince mavi bir çerçevedir. Birçok tema bu çerçeveyi kaldırır ("çirkin görünüyor") ve böylece fare kullanmayan herkes için klavye navigasyonunu bozar.

Neden önemli?

Yükümlülük ve Fayda — WCAG 2.4.11.

WCAG 2.4.11 (Odak Görünümü) Net bir görsel ayrım sağlayan odak göstergesi gereklidir; en az 2 CSS piksel kalınlığında ve çevresiyle 3:1 kontrast oranına sahip olmalıdır. Görünür bir odak olmadan, klavye ile gezinme neredeyse imkansızdır (Enter tuşuna basmanın sizi nereye götüreceğini bilemezsiniz). Ayrıca şunlar da gereklidir: :odak-görünür Fare tıklamasını (çerçeve gerekmez) sekme odağından (çerçeve gereklidir) ayırır — temiz kullanıcı deneyimi.

Uygulamamız

Bunu tam olarak nasıl çözeceğiz?.

  • Küresel odak stili: 3 piksel düz marka rengi + 3 piksel ofset, 6 piksel kenar yarıçapı — yüksek görünürlük, AAA kontrast.
  • :odak-görünür yerine :odak Fare tıklamaları çerçevelenmez, ancak sekme odağı çerçevelenir.
  • Asla küresel özet: yok Değiştirme yapılmadan.
  • Özel bileşenlere (döngüsel slayt gösterileri, özel açılır menüler) açıkça kendi odak durumları atanır.
  • Doğrulama: Klavye ile adım adım inceleme — her etkileşimli öğe, odak noktasındayken açıkça tanımlanabilir olmalıdır.

Tam olarak bu modüle mi ihtiyacınız var?

15 dakikalık ön görüşme — siteniz için uygun olup olmadığını netleştireceğiz.

İlk görüşme randevusu alın

Daha fazla bilgi:
BFSG genel bakışı ·
Performans genel bakışı ·
BAFA fonlaması ·
Sıkça Sorulan Sorular

Kolay dil