Bu kural neyi kontrol eder
Ön plan ve arka plan renkleri arasındaki kontrastın WCAG 2 AA asgari kontrast oranı eşiklerini karşıladığını denetler.
Neden önemli
WCAG 1.4.3, normal metin için en az 4.5:1, büyük metin için en az 3:1 kontrast oranı ister. Soluk fiyatlar, rozetler ve banner’lar az gören kişiler için ve parlak ışıkta herkes için zor okunur.
Nasıl düzeltilir
Her web sitesinde
- Düşük kontrastlı metni bulun ve metin ile arka plan renklerini not edin: bir kontrast kontrol aracı veya tarayıcınızın geliştirici araçları ikisini de gösterir.
- Temanızın CSS’inde metin veya arka plan rengini, oran en az 4.5:1 olana kadar güncelleyin (24px ve daha büyük metinlerde ya da 18,66px kalın metinlerde 3:1).
- İndirim rozetlerine, yer tutucu metinlere, alt bilgi bağlantılarına ve görsellerin üzerindeki butonlara özellikle dikkat edin.
Shopify’da
- Düşük kontrastlı metni bulun ve metin ile arka plan renklerini not edin: bir kontrast kontrol aracı veya tarayıcınızın geliştirici araçları ikisini de gösterir.
- Online Mağaza > Temalar > Özelleştir > Tema ayarları > Renkler bölümünde, etkilenen renk şeması için oran en az 4.5:1 olana kadar metin rengini koyulaştırın veya arka planı açın.
- İndirim rozetlerine, yer tutucu metinlere, alt bilgi bağlantılarına ve görsellerin üzerindeki butonlara özellikle dikkat edin.
Düzeltme nasıl kontrol edilir
- Taramayı yeniden çalıştırın ve color-contrast kuralının artık görünmediğini doğrulayın.
- Tam renk değerleriyle bir kontrast kontrol aracında örnek kontrol yapın.
FixReports bunu nasıl bulur
Taramamız, test ettiği her sayfada axe-core’un color-contrast kuralını gerçek bir Chrome tarayıcısında çalıştırır ve kuraldan geçemeyen her öğeyi sayfası, işaretlemesi ve uygun olduğunda bir ekran görüntüsüyle birlikte bildirir.
Otomatik bir test, bu belirli sorunun var olduğunu doğrular. Sayfanın geri kalanının erişilebilir olup olmadığını söyleyemez: bazı engeller ancak bir insan sayfayı kontrol ettiğinde ortaya çıkar.