Renk Körü Bir Tasarımcının İş Akışı ve Kontrast Denetleyicisinin Görmediği Şey

Renk körlüğü hakkında en sık duyduğum yanlış bilgi, dünyayı gri gördüğüm. Kırmızıyla yeşili ayırmakta zorlanıyorum, geri kalan her şey yerli yerinde. Yıllardır web tasarımı yapıyorum ve bu sürede öğrendiğim asıl şey kendi gözümle ilgili değil: erişilebilirlik araçlarının çoğu, tam da benim takıldığım yeri ölçmüyor.

Önce şu gri dünya meselesi

Tam renk körlüğü (monokromasi) gerçekten var ama çok nadir. Yaygın olan tip kırmızı-yeşil eksenindeki yetersizlik. Colour Blind Awareness'ın yaydığı rakamlar, erkeklerde 12'de 1, kadınlarda 200'de 1 sıklığından söz ediyor. Bir e-ticaret sitesinin aylık ziyaretçisini bu oranla çarpınca, konu kişisel bir merak olmaktan çıkıp trafik meselesine dönüşüyor.

İki kişinin teşhisi aynı olsa bile karıştırdıkları renkler aynı olmuyor. Bu yüzden "renk körü biri şunu şöyle görür" diye kesin konuşan her cümleye mesafeliyim, kendi deneyimimi anlatırken de.

Kontrast denetleyicisi neyi ölçer, neyi ölçmez

WebAIM Contrast Checker her gün açtığım araç. Ama tek bir şey yapıyor: bir ön plan rengiyle bir arka plan rengi arasındaki parlaklık oranını hesaplıyor. Grafikteki iki çizginin birbirine karışıp karışmadığı sorusuna hiç bakmıyor.

Somut örnek. Bir çizgi grafikte gelir çizgisi #D32F2F, gider çizgisi #2E7D32 olsun, ikisi de beyaz zeminde:

Çift	Kontrast oranı	WCAG AA (4.5:1)
#D32F2F / beyaz	4,98:1	geçer
#2E7D32 / beyaz	5,12:1	geçer
#D32F2F / #2E7D32	1,03:1	ölçülmüyor

Denetleyici iki yeşil tik veriyor, rapor temiz görünüyor. Oysa o iki renk birbirine karşı 1,03:1, yani neredeyse aynı parlaklıkta. Kırmızı-yeşil ayrımı olmayan biri için ikisi tek bir çizgiye dönüşüyor. Aracın hatası değil bu, aracın kapsamı dışında; hata, kontrol listesini geçmeyi erişilebilirlik sanmakta.

Pratik kural olarak kullandığım şey şu: aynı görselde anlam taşıyan iki rengi seçtiysem, o ikisini de denetleyiciye sokuyorum. Aralarındaki oran 3:1'in altına düşüyorsa renk artık ayırt edici değil, sadece dekorasyon. O noktada ya birinin parlaklığını değiştiriyorum ya da ikinci bir kanal ekliyorum: kesikli çizgi, farklı işaretçi, doğrudan çizginin ucuna yazılmış etiket. Sonuncusu genelde en iyisi, çünkü lejant okumak zaten kimsenin sevdiği bir iş değil.

Bu bir tercih değil, en alt basamak

Renkle taşınan bilginin ikinci bir yolu daha olması gerektiği kuralı WCAG 1.4.1 Use of Color maddesi. Seviyesi A. AAA değil, AA bile değil. Yani erişilebilirlik konusunda hiçbir iddiası olmayan bir site bile bu maddeyi karşılamak zorunda; "zamanımız olursa bakarız" kutusuna atılacak bir madde değil.

Kırmızı çerçeveyle işaretlenmiş hatalı form alanı, bu maddenin en sık ihlal edilen hali. Çerçevenin yanına küçük bir ikon ve alanın altına bir satır metin koymak on dakikalık iş. Çoğu projede bu on dakika, o formu hiç dolduramayan kullanıcıyla dolduran kullanıcı arasındaki farkı belirliyor.

Rengin tek başına yeterli olduğu yerler de var: marka renkleri, dekoratif arka planlar, bir şeyi vurgulamayan ama ortamı kuran her şey. Kuralı her yere uygulamaya çalışmak tasarımı ikon çöplüğüne çeviriyor. Ayrım basit: renk kaldırıldığında bir bilgi kayboluyorsa ikinci kanal şart, kaybolmuyorsa değil.

Masamdaki araçlar

Renkleri gözle eşleştirmeyi bırakalı çok oldu, sayıyla çalışıyorum. Hex kodu bana "kırmızı mı kahverengi mi" sorusunu hiç sordurmuyor. Bunun yanında düzenli kullandıklarım:

• Eye Dropper türü tarayıcı uzantıları: ekrandaki herhangi bir pikselin kodunu almak için. Müşterinin "logodaki turuncuyu kullan" dediği anlarda hayat kurtarıyor.
• Editörde yüksek kontrastlı koyu tema. Sözdizimi renklerini ayırt etmek için değil, akşam saatlerinde gözüm daha az yorulduğu için.
• Etiket sistemlerinde renk artı metin. Trello'nun etiket adlarını gösterme ayarı kapalıyken pano benim için bir renk bulmacası, açıkken sıradan bir liste.
• Renk körlüğü simülatörleri, ama karar mercii olarak değil. Simülatörler tek bir tip CVD'yi tek bir şiddet düzeyinde modelliyor; benim gerçek deneyimimle çıktıları çoğu zaman örtüşmüyor. Şüpheye düşürmek için iyi, onay vermek için değil.

Veri görselleştirmede iyi örnek arayanlar Our World in Data grafiklerine bakabilir. Çizgilerin ucuna yazılmış etiketler, ayrı ayrı seçilmiş parlaklık düzeyleri ve lejanta bağımlı olmayan bir düzen var. Renk körlüğü için tasarlanmamışlar, sadece iyi tasarlanmışlar. Zaten mesele de bu.

İşin insan tarafı

Renk körü olduğumu söylediğimde gelen ilk soru neredeyse hep aynı: "Peki bu işi nasıl yapıyorsun?" Sorunun arkasında, tasarımın renk seçmekten ibaret olduğu varsayımı yatıyor. Bir keresinde bir pozisyon, renk uyumu kuramayacağım düşünülerek başkasına verildi. Sonradan anladım ki o iş, ekibin erişilebilirlik konusunda hiç düşünmediği bir yerdeydi ve ben yanlış soruyu dert ediyordum.

Ekip içinde CVD'li birinin bulunması hoş bir çeşitlilik hikâyesi değil, ucuz bir test mekanizması. Ben bir grafiğe bakıp "burada iki çizgi mi var" diye sorduğumda, o sorunun cevabı zaten kullanıcı geri bildiriminden aylar önce gelmiş oluyor. Kimse ekibinde renk körü tutmak zorunda değil elbette; o zaman da yukarıdaki denetimi süreç haline getirmek gerekiyor, çünkü ikisinden biri olmadığında sorun kullanıcıda patlıyor.