WCAG Renk Kontrast Testi
Ön plan ve arka plan renklerinin kontrast oranını hesaplayın. Sonucu metin boyutu ve WCAG başarı kriterleriyle birlikte yorumlayın.
Bu aracın ana girdisi tarayıcınızda işlenir ve harici API’ye gönderilmez. Yazı tipi ve arayüz dosyaları harici sağlayıcılardan yüklenebilir.
WCAG Renk Kontrast Testi
Kontrast kontrol aracı, iki renk arasındaki parlaklık farkını oran olarak verir. Web arayüzünde metnin arka plan üzerinde okunabilirliğini ilk aşamada değerlendirmeye yardımcı olur.
Tek bir oran, erişilebilirliğin tamamını ölçmez. Metin boyutu, kalınlık, durum göstergeleri, görsel algı ve gerçek arka plan da önemlidir; ölçümü sayfada görülen renk çiftiyle yapın.
Hangi durumlarda kullanılır?
- Düğme metninin arka planla yeterli ayrışıp ayrışmadığını kontrol etmek.
- Renk tokenları arasında okunabilir metin rengi seçmek.
Nasıl kullanılır?
- Ön plan ve arka plan renklerini girin.
- Hesaplanan kontrast oranını ve gösterilen WCAG ölçütünü inceleyin.
- Gerçek bileşende, farklı durumlarda ve renk körlüğü simülasyonuyla da kontrol edin.
Örnek
Girdi: #000000 metin / #FFFFFF arka plan
Çıktı: Kontrast oranı 21:1
Kimler için?
- UI tasarımcıları
- Frontend geliştiricileri
- Dijital içerik ekipleri
Gizlilik ve sınırlar
Renk kontrast hesabı tarayıcıda yapılır; renk değerleri API’ye gönderilmez.
Sık sorulan sorular
21:1 oran ne demek?
Siyah ve beyaz gibi uç parlaklıktaki renkler için en yüksek standart oran örneğidir. Gerçek bir bileşenin tüm uygunluk şartlarını tek başına göstermez.
WCAG AA geçmek tüm kullanıcılar için okunabilirlik sağlar mı?
Hayır. Standart eşiği önemli bir kontrol noktasıdır; küçük metin, yazı tipi, çevresel koşul ve farklı görsel algı da kullanılabilirliği etkiler.
Arka plan görseliyse ne girmeliyim?
Metnin altında kalan gerçek renk örneğini veya en düşük kontrastlı bölgeyi değerlendirin. Değişken görseller için birden fazla nokta test edin.
Renk çiftini değiştirince sonucu yeniden hesaplar mı?
Evet, araçta renk alanlarını güncelleyerek hesaplanan oranı tekrar kontrol edebilirsiniz.