Cara Kerja Uji Kontras Warna
ToolMole menerima dua kode warna, biasanya untuk teks dan latar belakang, lalu menghitung luminansi relatif memakai rumus WCAG 2.1. Dari hasil luminansi, rasio kontras didapat dan langsung dibandingkan dengan ambang batas AA dan AAA untuk teks normal dan besar.
Semua proses berlangsung di browser tanpa transfer data ke server, sehingga cepat dan aman digunakan pada konsep desain atau prototipe.
Memahami Standar AA dan AAA
WCAG menetapkan rasio kontras minimum: 4,5:1 untuk teks normal dan 3:1 untuk teks besar pada level AA. Untuk level AAA, minimum adalah 7:1 untuk teks normal dan 4,5:1 untuk teks besar. Pengguna harus menentukan sendiri apakah teks dianggap 'besar' atau 'bold', karena standar ini bergantung pada ukuran dan ketebalan font.
Jika memakai headline 24px tebal, itu masuk kategori teks besar. Body text 15px biasanya masuk normal. ToolMole membantu memvisualisasikan hasil untuk kedua jenis.
Keterbatasan dan Tips Penggunaan
Tool ini hanya menguji kontras antara dua warna solid. Jika ingin cek kontras pada elemen selain teks atau pada gambar/gradient, sampling warna harus dilakukan manual dan diuji sebagai pasangan.
Warna transparan bisa menghasilkan hasil berbeda tergantung latar, sehingga sebaiknya uji dengan warna akhir yang terlihat. ToolMole tidak memperhitungkan profil warna atau perbedaan render antar perangkat, jadi hasil yang diperoleh adalah standar WCAG secara umum.
Pertanyaan yang Sering Diajukan
Bagaimana menentukan teks 'besar' untuk ambang kontras yang lebih rendah?
Teks dianggap besar jika minimal 18pt (sekitar 24px) atau 14pt (sekitar 18,7px) tebal. Jika Anda memakai headline tebal, gunakan standar teks besar agar syarat kontrasnya berbeda.
Bisakah saya cek kontras pada ikon atau komponen UI selain teks?
Bisa, asalkan Anda mengetahui warna foreground dan background. Masukkan kedua warna untuk mendapatkan rasio kontras, meski WCAG fokus pada teks.
Apa yang terjadi jika warna yang digunakan semi-transparan?
Rasio kontras dihitung berdasarkan warna final yang terlihat. Anda perlu menentukan hasil blending antara foreground dan background sebelum menguji, karena transparansi bisa memengaruhi hasil.
Apakah tool ini mempertimbangkan profil warna atau perbedaan tampilan antar perangkat?
ToolMole memakai standar WCAG untuk semua perhitungan. Perbedaan profil warna dan render di tiap perangkat tidak dihitung, jadi gunakan hasil sebagai acuan umum.
Bisakah saya menguji beberapa pasangan warna sekaligus?
Saat ini tool hanya mendukung satu pasangan warna per uji. Jika ingin menguji banyak kombinasi, lakukan satu per satu secara bergantian.
Seberapa akurat tool ini dibandingkan dengan kenyamanan baca di dunia nyata?
ToolMole mengikuti perhitungan resmi WCAG, namun tingkat kenyamanan baca juga dipengaruhi oleh font, layout, dan konteks visual. Rasio kontras adalah langkah awal untuk aksesibilitas.
Ada masalah atau ide untuk alat ini? Kirim masukan