Konu Başlıkları
Yükleniyor...

Karanlık Mod ve Aydınlık Mod: Okunabilirlik ve Uygulama Maliyeti

Karanlık Mod mu Aydınlık Mod mu? Tasarım ve Kod Tarafı

Karanlık mod tartışması çoğunlukla zevk meselesine indirgeniyor, oysa altında ölçülebilir bir görme mekanizması var: kontrast polaritesi. Koyu zemin üzerine açık yazı ile açık zemin üzerine koyu yazı, gözün odaklanma biçimini farklı çalıştırır. Hangisinin kime iyi geldiği de buradan çıkıyor.

Kontrast polaritesi ne yapıyor

Açık zeminli bir arayüzde göze daha çok ışık girer ve göz bebeği daralır. Daralan göz bebeği alan derinliğini artırır, görüntünün kenarları keskinleşir; küçük puntolu metni okurken fark tam olarak burada ortaya çıkıyor. Laboratuvar çalışmalarının çoğu, normal görme keskinliğine sahip kişilerde açık zeminin okuma hızı ve doğruluğu bakımından hafif üstün olduğunu buluyor. Fark büyük değil, ama metin ağırlıklı bir üründe varsayılanı seçerken elinde bu yönde bir sebep var.

Bu üstünlüğün tersine döndüğü yerler

Katarakt gibi göz merceğinin saydamlığını yitirdiği durumlarda içeri giren ışık merceğin içinde saçılır ve parlama yaratır. Bu kişiler için açık zemin, okumayı kolaylaştıran ışığı bir perdeye çevirir; koyu zeminde okuma performansları yükselir. Işığa hassasiyet yaratan migren ve benzeri durumlar için de yön aynı. Ortamın kendisi de belirleyici: karanlık bir odada beyaz bir sayfa, karanlığa uyum sağlamış bir göz için doğrudan bir parlaklık kaynağı oluyor.

Koyu tema, renkleri ters çevirmek değil

Açık temanın değerlerini tersine çevirdiğinde karşına ilk çıkan sorun halation. Saf siyah (#000000) zemin üzerine saf beyaz (#FFFFFF) metin, harflerin kenarları taşıyormuş gibi görünür ve astigmatizması olan okuyucuda bu belirginleşir. Zemini tam siyah yerine koyu gri bir tonda (#121212 civarı) kurmak, metin rengini de beyazın biraz altında tutmak saçılmayı azaltıyor.

İkinci sorun derinlik. Açık temada yükseklik gölgeyle anlatılır, koyu zeminde gölge görünmez; bir yüzeyi öne çıkarmak için yüzey rengini kademe kademe açman gerekir.

Kontrast denetimi ise yanıltıcı bir güven veriyor. WCAG'nin kontrast oranı formülü iki rengin hangisinin zemin olduğuna bakmaz, yani aynı renk çifti her iki polaritede de aynı oranı verir ve denetimden geçer. Denetimden geçmiş olması koyu temanın rahat okunduğu anlamına gelmiyor, kararı ekrana bakarak vereceksin.

Tema geçişini kurarken iki tuzak

Ayar ikili değil üçlü olmalı: açık, koyu ve sistem tercihini izle. İkili bir düğme koyduğunda, akşam olunca işletim sisteminde koyu temaya geçen kullanıcıyı senin sitende sabahki seçiminde bırakırsın. Üçüncü durumu prefers-color-scheme medya sorgusuyla okursun, kullanıcının açık bir seçimi varsa o kazanır.

İkincisi ilk boyamada görünen flaş. Tercih localStorage'da tutuluyorsa ve onu okuyan betik sayfanın sonunda çalışıyorsa, koyu tema seçmiş kullanıcı her sayfa açılışında bir anlık beyaz ekran görür. Çözümü küçük: tema sınıfını <html> etiketine yazan birkaç satırı <head> içinde, stil dosyalarından önce senkron çalışan bir betiğe koy. Bunun için üçüncü parti bir tema kütüphanesine gerek yok.

Hangisi varsayılan olmalı

Metin ağırlıklı ürünlerde varsayılan açık tema olsun, koyu tema da eksiksiz kurulmuş bir seçenek olarak dursun. Uzun süre karanlık ortamda kullanılan araçlarda (kod editörü, kurgu yazılımı, gece vardiyasında izlenen panolar) tersi doğru. Koyu temayı OLED ekranlardaki pil tasarrufu üzerinden savunan bir argüman da dolaşıyor (bunu zayıf buluyorum, kazanç ekran parlaklığı düştükçe kapanıyor). Asıl mesele iki temayı da aynı özenle kurmak; yarım bırakılmış bir koyu tema, hiç sunmamaktan daha kötü bir deneyim üretiyor.