Atur Ukuran Target Ketuk Dengan Sesuai

Aturan ini berlaku saat PageSpeed Insights mendeteksi bahwa target ketuk tertentu (misalnya tombol, tautan, atau bidang formulir) mungkin terlalu kecil atau terlalu dekat satu sama lain sehingga pengguna tidak dapat mengetuk layar dengan mudah.

Ikhtisar

Tautan atau tombol yang tersusun dengan rapat atau kecil lebih menyulitkan pengguna untuk menekannya dengan akurat pada layar sentuh daripada menggunakan kursor mouse tradisional. Agar pengguna tidak jengkel karena tidak sengaja salah menekan, target ketuk sebaiknya dibuat dengan cukup besar dan jauh dari target ketuk lainnya sehingga pengguna dapat menekannya tanpa membuat bantalan jari mereka tumpang tindih dengan target ketuk lainnya. Ukuran bantalan jari orang dewasa rata-rata lebarnya sekitar 10 mm (sedikit kurang dari setengah inci), dan pedoman UI Android menyarankan ukuran target ketuk minimum sekitar 7 mm, atau 48 piksel CSS pada situs dengan area pandang seluler yang disetel dengan benar.

Saran

Anda sebaiknya memastikan bahwa target ketuk yang terpenting pada situs Anda—yang akan digunakan paling sering oleh pengguna—cukup besar untuk ditekan dengan mudah, setidaknya memiliki lebar/tinggi 48 piksel CSS (dengan asumsi Anda telah mengonfigurasi area sudut pandang dengan benar). Tautan yang jarang digunakan dapat berukuran lebih kecil, namun sebaiknya tetap terdapat ruang di antaranya dengan tautan lain, sehingga bantalan jari 10 mm tidak akan menekan kedua tautan sekaligus secara tidak sengaja. Pengguna seharusnya tidak perlu mencubit untuk membesarkan/mengecilkan (atau mengandalkan fitur UI browser lain untuk memperjelas saat jari mengetuk, seperti kaca pembesar munculan milik Chrome) guna menekan tombol atau tautan yang diinginkan dengan mudah dan tepat.

Buat target ketuk penting berukuran cukup besar agar mudah ditekan

Ini berlaku untuk target ketuk yang akan digunakan paling sering oleh pengguna Anda, seperti tombol untuk tindakan yang sering digunakan, bilah penelusuran, dan bidang formulir penting lainnya, serta tautan navigasi utama. Target ketuk ini seharusnya berukuran minimal 7 mm (48 piksel CSS jika Anda telah mengonfigurasikan area pandang dengan benar), dan terdapat ruang tambahan di sekitarnya jika target ketuk tersebut berukuran lebih kecil dari 7 mm.

Pastikan ada spasi ekstra antar-target ketuk yang lebih kecil

Hal ini wajar apabila tautan atau tombol yang jarang digunakan berukuran lebih kecil dari ukuran 7 mm yang disarankan, namun sebaiknya tetap tidak ada target ketuk lainnya yang berjarak 5 mm (32 piksel CSS), baik secara horizontal maupun vertikal, sehingga saat jari pengguna menekan satu target ketuk, target ketuk lain tidak akan tersentuh secara tidak sengaja.