Renk Kontrastı (Color Contrast) Nedir?
Renk kontrastı (color contrast), metin ya da arayüz öğesinin rengi ile arka plan rengi arasındaki parlaklık farkıdır; WCAG bu farkı kontrast oranıyla ölçer ve okunabilirlik için en düşük değerleri belirler.
Diğer Adları: Color Contrast
Renk Kontrastı İçin WCAG Ne İster?
WCAG 2.2’nin 1.4.3 Kontrast (En Az) ölçütü AA düzeyindedir: metin ve metin görsellerinin arka planla kontrast oranı en az 4,5:1 olmalıdır. Büyük metinde, yani en az 18 punto ya da 14 punto kalın metinde bu oran en az 3:1’dir.
Ölçütün istisnaları vardır: etkin olmayan arayüz öğelerindeki metin, yalnızca süs amaçlı metin, görünmeyen metin ve başka önemli görsel içerik barındıran bir resmin parçası olan metin kontrast koşuluna tabi değildir. Logo ya da marka adının parçası olan metin de istisnadır.
Renk Kontrastı ve Yalnızca Renge Dayanmama
Kontrast yeterli olsa bile bilgi yalnızca renkle verilmez. 1.4.1 Rengin Kullanımı ölçütü (A), rengin bilgi aktarmanın, bir eylemi göstermenin ya da öğeleri ayırt etmenin tek görsel yolu olmamasını ister. Renk görme eksikliği olan kullanıcılar, yalnızca kırmızıyla işaretlenmiş zorunlu alanı ya da yalnızca renkle ayrılmış bir stok uyarısını fark etmeyebilir; renge ek olarak metin ya da simge kullanılır.
Renk Kontrastı Mağaza Tasarımında Nerede Bozulur?
Açık gri zemindeki açık gri indirimli fiyat, görsel üstüne yazılmış beyaz banner metni, soluk renkli form açıklamaları ve kurumsal rengin açık tonuyla yazılmış küçük bağlantılar kontrastın düştüğü tipik yerlerdir. Kurumsal renk değiştirilmeden de sorun çözülebilir: aynı rengin koyu tonu metinde, açık tonu zeminde kullanılır.
Örnek: Bir mağaza indirimli fiyatı açık gri zemin üzerinde açık gri yazar ve stokta az kaldığını yalnızca turuncu bir noktayla gösterir. Fiyat koyu renge çekilip kontrast oranı ölçülür; stok uyarısının yanına “Son 2 Ürün” metni eklenir.
Renk Kontrastı Hakkında Sık Sorulan Sorular
Kontrast oranı nasıl ölçülür?
Metin ve arka plan renklerinin kodları bir kontrast denetleyicisine girilir; araç oranı hesaplar ve sonucu WCAG düzeylerine göre gösterir. Tarayıcıların geliştirici araçları da seçilen metnin kontrast oranını gösterebilir.
Kurumsal renk kontrast koşulunu karşılamıyorsa ne yapılır?
Renk küçük metin yerine zeminde, büyük başlıklarda ya da süs öğelerinde kullanılır; küçük metin için aynı rengin koyu tonu seçilir. Logodaki metin kontrast koşulundan muaftır.