Dokunma hedefleri, bir web sayfasında dokunmatik cihazların kullanıcılarının etkileşim kurabileceği alanlardır. Düğmelerin, bağlantıların ve form öğelerinin dokunma hedefleri vardır.
Birçok arama motoru, sayfaları mobil uyumlu olup olmadıklarına göre sıralar. Dokunma hedeflerinin yeterince büyük ve birbirinden yeterince uzakta olduğundan emin olmak, sayfanızı daha mobil uyumlu ve erişilebilir hale getirir.
Lighthouse dokunma hedefleri denetimi nasıl başarısız oluyor?
Lighthouse, aşağıdaki koşulların ikisini de karşılayan dokunma hedeflerine sahip sayfaları işaretler:
- Hedef 48 piksele 48 pikselden küçük.
- Hedefin merkezinden 48 piksel uzaklıktaki hedef alanın en az% 25'i başka bir hedefle çakışıyor.
Denetim başarısız olduğunda Lighthouse, sonuçları üç sütunlu bir tabloda listeler:
| Dokunma Hedefi | Uygunsuz boyuta sahip dokunma hedefi. |
| Boyut | Hedefin sınırlayıcı dikdörtgeninin piksel cinsinden boyutu. |
| Çakışan Hedef | Varsa çok yakın olan diğer dokunma hedefleri. |
Dokunma hedeflerinizi düzeltme
1. Seçenek: Çok küçük olan dokunma hedeflerinin boyutunu artırın.
48 piksel x 48 piksel boyutlarındaki dokunma hedefleri hiçbir zaman denetimde başarısız olur. Daha büyük görünmemesi gereken öğeleriniz (örneğin, simgeler) varsa padding özelliğini artırmayı deneyin:
padding öğesini kullanın.
2. Seçenek: margin gibi özellikleri kullanarak birbirine çok yakın olan dokunma hedefleri arasındaki boşluğu artırın. Dokunma hedefleri arasında 8 piksel iyi bir başlangıç noktasıdır, ancak özellikle çok küçük hedeflerde denetimi geçmek için her zaman yeterli boşluk olmaz.
Kaynaklar
- Erişilebilir dokunma hedefleri: Dokunma hedeflerinizin tüm kullanıcılar tarafından erişilebilir olmasını nasıl sağlayacağınız hakkında daha fazla bilgi edinin.
- Dokunma hedefleri uygun boyutta değil denetiminin kaynak kodu