Karanlık Mod ve Erişilebilir Renk Paleti Nasıl Kurulur

Kontrast oranı, metin rengiyle arka plan renginin göreli parlaklık farkını ölçer; 1:1 hiç fark yok demek, 21:1 siyah beyaz kadar keskin demektir. WCAG standardı normal metin için 4.5:1, büyük metin (18 punto ve üzeri kalın, ya da 24 punto normal) için 3:1 oranını asgari kabul ediyor (W3C WCAG 2.1).

Bu oranı elle hesaplamaya gerek yok; tarayıcı geliştirici araçlarındaki kontrast denetleyicisi ya da ücretsiz çevrimiçi araçlar rengi girip anında oranı gösteriyor. Bir jeneratör üreticisinin karanlık temasında koyu gri zemin üzerine orta gri metin sık görülen bir hatadır; oran genelde 3:1'in altında kalır, metin okunaklılığı düşer.

Bir marka rengi açık zeminde canlı görünürken koyu zeminde donuk ya da parlak kalabilir; aynı ton her iki zeminde de aynı hissi vermez. Bu yüzden karanlık mod için marka renginin ayrı bir varyantı hazırlanır, birebir aynı kod kopyalanmaz.

Bir spor kulübünün kırmızı marka rengi açık zeminde net görünürken karanlık zeminde parlak neon gibi durup gözü yorabilir; doygunluğu biraz düşürülmüş bir varyant hem markayı korur hem gözü yormaz.

Karanlık mod yalnız arka plan ve metin rengini değiştirmekle bitmez; gölgeler, kenarlıklar, ikonlar ve görsellerin arka planı da gözden geçirilmeli. Açık zeminde ince bir gölgeyle ayrılan bir kart, karanlık zeminde görünmez hale gelebilir; bu durumda gölge yerine ince bir kenarlık kullanılır.

Görseller de ayrı bir mesele: beyaz zeminli bir ürün fotoğrafı karanlık sayfada rahatsız edici bir beyaz kutu gibi durabilir; bu görsellerin ya şeffaf arka planlı versiyonu hazırlanır ya da etrafına yumuşak bir çerçeve eklenir.

Yayına çıkmadan önce her metin/arka plan çiftinin kontrast oranı ayrı ayrı kontrol edilmeli; özellikle düğme, form etiketi ve hata mesajı gibi işlevsel öğeler atlanmamalı. Bir form hata mesajı düşük kontrastlı kırmızıysa, ziyaretçi hatayı fark etmeden formu tekrar tekrar gönderebilir.

• Her metin/arka plan çifti kontrast denetleyicisinden geçirilir
• Marka renginin karanlık mod varyantı ayrı tanımlanır
• Görseller ve ikonlar her iki modda ayrı kontrol edilir
• Sistem tercihine göre otomatik geçiş (prefers-color-scheme) test edilir

Her site için zorunlu değil; ama ziyaretçi kitlesi teknik bir ürün kullanıyorsa (yazılım, uygulama, panel) beklenti yüksektir. Bir tanıtım sitesi için karanlık mod önceliksiz kalabilir; bu durumda kaynak, açık moddaki kontrast oranını doğru kurmaya harcanmalı, çünkü erişilebilirlik yalnız karanlık moda özgü bir konu değildir.

Bir formda hatalı alanı yalnız kırmızı renkle işaretlemek, renk körlüğü yaşayan bir ziyaretçi için hiçbir şey ifade etmeyebilir; dünya nüfusunun önemli bir bölümünde kırmızı yeşil ayrımı zorlaşan bir renk körlüğü türü görülüyor. Bu yüzden renk her zaman bir simge ya da metinle desteklenmeli.

Bir stok durumu göstergesinde «stokta var» yeşil, «tükendi» kırmızı yazıyla değil yalnız renkle gösteriliyorsa, bu bilgi bir kısım ziyaretçiye hiç ulaşmaz; yanına küçük bir ikon ya da kısa bir etiket eklemek, rengi tek başına taşıyıcı olmaktan çıkarır.

Bir ziyaretçi karanlık moddan açık moda elle geçtiğinde, bu tercih bir sonraki ziyarette de hatırlanmalı; her sayfa yüklemesinde sistem tercihine geri dönmek ziyaretçiyi rahatsız eder. Tercih tarayıcının yerel depolamasında tutulur, sayfa her açıldığında oradan okunur.

Bir oyun stüdyosunun sitesinde bu hatırlama kurulmazsa, ziyaretçi her ziyarette aynı ayarı yeniden yapmak zorunda kalır; küçük bir teknik detay olsa da tekrar eden bir sürtünme noktasıdır.

Yerel depolamaya güvenmek yerine sunucu tarafında bir hesap ayarı olarak da saklanabilir; ziyaretçi giriş yapıyorsa bu, tercihini farklı cihazlar arasında da taşımasını sağlar.