Kontras adalah perbandingan terang, bukan perbedaan warna. Itu sebabnya dua warna yang terlihat sangat berbeda bisa gagal dibaca, dan tidak ada orang yang bisa menebak angkanya dengan melihat.
Teks besar 24 piksel
Teks tebal 18,7 piksel
Teks berukuran biasa, 16 piksel. Ini ukuran paragraf yang paling sering dipakai, dan ambang yang berlaku untuknya adalah 4,5.
Keterangan kecil 13 piksel, ambangnya tetap 4,5.
8,13 : 1
Lolos seluruh ambang, termasuk AAA untuk teks biasa. Pasangan ini aman dipakai untuk apa pun, termasuk teks kecil.
Teks besar menurut WCAG adalah minimal 18pt, atau 14pt kalau tebal. Dalam CSS kira-kira 24px dan 18,66px tebal.
Hanya terangnya yang digeser. Rona dan kejenuhan dipertahankan supaya warna brand Anda tetap warna yang sama.
| Ragam | Rasio | Selisih |
|---|---|---|
| Protanopia | 7,02 | -1,11 |
| Deuteranopia | 8,26 | +0,13 |
| Tritanopia pendekatan | 6,91 | -1,22 |
Pasangan ini lolos di mata biasa, tapi jatuh di bawah 4,5 untuk sebagian pembaca.
Angka ini di luar WCAG. Ia perkiraan, bukan klaim kepatuhan. Simulator buta warna memperlihatkan gambar utuhnya.
Karena yang diukur bukan perbedaan warna, melainkan perbandingan luminansi, yaitu seberapa banyak cahaya yang dipantulkan masing-masing.
Contoh paling jelas ada di tombol contoh di atas: biru #1D4ED8 di atas merah
#DC2626 terlihat sangat kontras, padahal rasionya di bawah 1,4. Keduanya sama-sama
gelap. Sebaliknya kuning dan putih terlihat dekat, dan memang gugur, karena sama-sama terang.
Aturan praktisnya: kalau Anda mengubah kedua warna jadi hitam putih dan hasilnya nyaris sama abunya, kontrasnya rendah, seberapa pun berbedanya warna aslinya.
Kriteria 1.4.3 memang sudah dirancang supaya lulusnya tidak bergantung pada penglihatan warna, sebab ia mengukur luminansi. Tapi tidak bergantung bukan berarti tidak berubah. Sel kerucut merah ikut menyumbang luminansi, jadi pada protanopia warna merah kehilangan sebagian terangnya dan rasionya bergeser turun.
Kami memindai seluruh kisi warna untuk mengetahui apakah ini benar-benar terjadi atau cuma kekhawatiran teoretis. Dari 8.062 pasangan yang lolos 4,5 di mata biasa, 2.078 di antaranya, atau 25,8 persen, jatuh di bawah 4,5 pada setidaknya satu ragam buta warna.
Contoh paling tajam: hitam di atas merah murni #FF0000 lolos
di 5,25, tapi untuk protanopia turun ke 3,29. Merah adalah warna yang
paling sering dipakai untuk peringatan, dan justru warna itu yang paling rapuh.
Karena WCAG tidak mengatur hitungan ini, angkanya kami sebut perkiraan dan tidak boleh dipakai sebagai klaim kepatuhan. Gunanya satu: memberi tahu Anda kalau ada yang perlu diperiksa lebih jauh.
Belum. Alat ini menjawab satu pertanyaan dari puluhan yang membentuk kepatuhan.
Yang bisa dikatakan dengan jujur: pasangan warna ini memenuhi ambang tersebut. Itu saja, dan itu memang berguna.
Karena warna yang Anda bawa biasanya tidak bebas diubah. Itu warna brand, dan saran yang mengubah biru jadi ungu akan langsung dibuang meski rasionya bagus.
Jadi rona dan kejenuhan dikunci, dan hanya terangnya yang digeser sampai ambangnya terpenuhi, lalu dicari titik dengan pergeseran paling kecil. Dua arah dicoba, digelapkan dan diterangkan, dan yang menang adalah yang paling sedikit mengubah warna Anda.
Kalau suatu arah tertulis tidak ada, artinya arah itu memang buntu. Menerangkan warna sampai putih pun kadang tidak cukup untuk mencapai 7 di atas latar yang terang.
Butuh yang lebih dari sekadar hitungan?
Kalau persoalan Anda menyangkut kasus nyata di perusahaan, kami menyediakan konsultasi dan pelatihan yang disusun khusus, dibawakan langsung oleh expert yang menanganinya sehari-hari.
Konsultasi & layanan korporatMemenuhi ambang kontras bukan berarti patuh WCAG. Alat ini menilai sepasang warna padat terhadap tiga kriteria kontras, dan tidak menilai kriteria aksesibilitas lainnya. Teks di atas gambar atau gradasi perlu ditangani terpisah.