Bağlantılar ve düğmeler gibi etkileşimli öğeler, durumlarını belirtmeli ve etkileşimli olmayan öğelerden ayırt edilebilmelidir. Etkileşimli öğelerin amaçlarını ve durumlarını gösterip göstermediğini kontrol etmek için hem görsel hem de ekran okuyucu testi kullanın.
Görsel odak nasıl manuel olarak test edilir?
Görsel odağı manuel olarak test etmek için
sayfanızda TAB.
- Her etkileşimli öğeye sekme yapabiliyor musunuz?
- Etkileşimli bir öğeye ulaştığınızda kullanıcıların bu öğeyle etkileşim kurabileceğine dair görsel bir ipucu var mı?
- Seçtiğiniz her etkileşimli öğenin görünümü değişiyor mu?
Her bir etkileşimli öğe için odak göstergelerini şekillendirmenin birçok yolu vardır.
Mutlaka :focus kullanabilirsiniz.
:focus sözde sınıfı, bir öğeye tek tip stil uygulayabilmenizi sağlar.
Bu stil, öğeye odaklanmak için kullanılan giriş cihazından veya yöntemden bağımsız olarak, öğeye her odaklanıldığında uygulanır.
Stil odağı bölümünden daha fazla bilgi edinebilirsiniz.
Ekran okuyucuyla manuel olarak test etme
Bir ekran okuyucu kullanarak sayfanızda gezinin ve ekran okuyucunun her etkileşimli kontrolün adını, bu kontrolün rolünü ve geçerli etkileşim durumunu duyurabildiğini kontrol edin. Bir öğenin rolü net değilse ve durumu belirsizse uygun ARIA rollerini eklemeniz gerekebilir. Daha fazla bilgi için Özel kontrollerde ARIA rolleri var başlıklı makaleyi inceleyin.
Etkileşimli öğelerin nasıl etiketlendiğine çok dikkat etmek de önemlidir. Ekran okuyucu ve diğer yardımcı teknolojilerden yararlanan kullanıcılar, ilgili öğenin bağlamını anlamak için etiketlerden yararlanır. Belirsiz etiketler yaygındır ve içerikte gezinmeye yardımcı olmaz. Etiketler ve metin alternatiflerini nasıl iyileştireceğinizi öğrenin.
Bu neden önemli?
Bir denetimin ne yapacağıyla ilgili görsel ipuçları sağlamak, kullanıcıların sitenizde çalışmasına ve gezinmesine yardımcı olur. Bu ipuçlarına imkan sağlama adı verilir. Uygun koşullar sunulması, kullanıcıların sitenizi çok çeşitli cihazlarda kullanmasına olanak tanır.
Kaynaklar
Etkileşimli öğelerin kaynak kodu, amaçlarını ve durumunu belirtir.