Kontrast denetleyici
Tamamen tarayıcınızda çalışır. Dosyalarınız ve verileriniz cihazınızdan hiç çıkmaz.
| AA, normal metin | Geçti |
|---|---|
| AA, büyük metin | Geçti |
| AAA, normal metin | Geçti |
| AAA, büyük metin | Geçti |
Bu araç hakkında
Kontrast denetleyici iki rengi, bir metin rengini ve bir zemin rengini karşılaştırır ve bu ikiliyle yazılan metnin okunaklı olup olmadığını gösterir. WCAG kontrast oranını hesaplar ve dört standart eşikle karşılaştırır: normal metin için AA, büyük metin için AA, normal metin için AAA ve büyük metin için AAA. Renkleri renk seçicilerden alabilir veya hex kodunu doğrudan yazabilirsiniz; canlı önizleme anında güncellenir.
Oran nasıl hesaplanır?
Araç, WCAG 2 formülünü birebir uygular. Her rengin sRGB kanalları doğrusallaştırılır (monitörlerin uyguladığı gama eğrisi geri alınır) ve %21,26 kırmızı, %71,52 yeşil, %7,22 mavi ağırlıklarıyla göreli parlaklığa dönüştürülür. Bu ağırlıklar insan gözünün her kanala ne kadar duyarlı olduğunu yansıtır. İki parlaklık değerinden açık olan, koyu olanla karşılaştırılır; ortam ışığını hesaba katmak için ikisine de küçük bir sabit eklenir. Sonuçta 1:1 (aynı renkler) ile 21:1 (saf siyah beyaz üzerinde) arasında bir oran çıkar. Bu oran dört eşikle karşılaştırılır: normal metinde AA için 4,5:1, büyük metinde AA için 3:1, normal metinde AAA için 7:1, büyük metinde AAA için 4,5:1. Sadece 3 ve 6 haneli hex renkler kabul edilir; hesaplama her zaman tam opak iki rengi karşılaştırdığı için alfa kanalına veya başka gösterimlere ihtiyaç duymaz.
Verilerim bir yere yükleniyor mu?
Hayır. Tüm hesaplama birkaç satır matematikle tarayıcınızda çalışır, hiçbir şey sunucuya gönderilmez. Kontrol ettiğiniz renkler cihazınızdan çıkmaz, bu yüzden bir kurum içi tasarım sisteminin marka renklerini veya bir müşterinin paletini hiçbir yere göndermeden test edebilirsiniz.
WCAG’de büyük metin ne demek?
WCAG, büyük metni 18pt (24px) normal ağırlık veya 14pt (18,66px) ve üzeri kalın olarak tanımlar. Büyük metnin eşiği daha gevşek tutulur çünkü daha büyük ve kalın harfler daha düşük kontrastta da okunaklı kalır. Bu aracı bir tasarımı yayınlamadan önce gövde metninin WCAG AA’yı karşılayıp karşılamadığını doğrulamak, bir butonun etiketinin zemine karşı okunaklı olup olmadığını kontrol etmek veya mevcut bir sitenin renk paletini erişilebilirlik açısından denetlemek için kullanabilirsiniz. Formülün tamamı ve eşiklerin gerekçesi için W3C’nin understanding contrast minimum rehberine, sade bir anlatım için WebAIM’in kontrast makalesine bakabilirsiniz.