Go Toolstack

WCAG Renk Kontrastı & Erişilebilirlik Testi (AA / AAA)

Metin ve arka plan renk kombinasyonlarının WCAG 2.1 erişilebilirlik kontrast oranlarını test edin.

WCAG Renk Kontrastı & Erişilebilirlik Testi (AA / AAA)

Metin ve arka plan renk kombinasyonlarının WCAG 2.1 erişilebilirlik kontrast oranlarını test edin.

Nasıl Çalışır?

1
Sorgu Bilgisini Girin
İncelemek istediğiniz parametreyi, şehri veya veri girdisini belirleyin.
2
Veriyi Getirin veya Doğrulayın
Güvenli veri akışıyla sonuçları tarayıcınızda görüntüleyin.
3
Detaylı Tabloyu İnceleyin
Zaman çizelgelerini, referans verilerini veya analiz tablosunu inceleyin.

Bu kategorideki diğer istemci taraflı araçları keşfedin

Geliştirici Araçları Merkezi • İş Akışları ve Karşılaştırma

Tüm geliştirici araçlarını, teknik sınırları ve araç seçim rehberini inceleyin.

Merkezi İncele →
JSON Formatlayıcı, Doğrulayıcı & Güzelleştirici

JSON verilerini biçimlendirin, sıkıştırın; 64-bit hassasiyet ve JSON Schema (Draft-07 / 2020-12) kurallarıyla doğrulayın.
Base64 Kodlayıcı & Çözücü (Encode / Decode)

Metin ve dosyaları Base64 formatına güvenle dönüştürün veya orijinal içeriğe geri çözün.
SQL Biçimlendirici, Sıkıştırıcı & Girintileyici

SQL sorgularını tarayıcıda düzenleyin, anahtar kelimeleri büyük harfe çevirin ve biçimlendirin.

İlgili Uygulama Rehberleri

Bu araçla ilgili adım adım teknik ipuçları ve en iyi pratikler

Kavram ve Bilgi Merkezi

WCAG Renk Kontrastı Kontrol Aracı, Göreceli Parlaklık ve Erişilebilirlik Doğrulayıcı

Web İçeriği Erişilebilirlik Yönergeleri (WCAG 2.1), görme bozukluğu veya renk körlüğü olan bireyler de dahil olmak üzere tüm kullanıcıların dijital arayüzleri rahatça okuyabilmesi için metin ve arka plan renkleri arasında asgari kontrast oranları tanımlar. Yetersiz renk kontrastı, metinlerin okunmasını imkansız hale getirir ve kurumsal sitelerde yasal erişilebilirlik standartlarına aykırılık oluşturur. Bu araç, iki renk arasındaki göreceli parlaklığı hesaplayarak WCAG AA ve AAA uyumluluğunu anında denetler.

Örneğin beyaz bir arka plan (#FFFFFF) üzerinde açık gri bir metin (#9CA3AF) kullanmak isteyen bir UI tasarımcısını düşünelim. Araç hesaplama yaptığında kontrast oranının 2,85:1 olduğunu tespit eder. Bu oran, standart metinler için zorunlu olan 4,5:1 (WCAG AA) eşiğinin altında kaldığı için kırmızı bir 'BAŞARISIZ' uyarısı verir. Sistem tasarımcıya tek tıkla erişilebilirlik eşiğini aşacak alternatif koyu gri tonları önerir ve butonlar ile başlıkların simülasyonunu canlı gösterir.

Tüm parlaklık ve kontrast hesaplama algoritmaları tamamen tarayıcınız bünyesinde matematiksel olarak çalıştırılır. Renk paletleriniz, marka kimliği kodlarınız veya tasarım parametreleriniz hiçbir harici sunucuya iletilmez; tasarımlarınız tamamen yerel kalır.

Temel Mimari ve Matematiksel Formüller

Kontrast Oranı = (L1 + 0.05) / (L2 + 0.05) | L = Göreceli Parlaklık (Relative Luminance)

sRGB renk değerleri doğrusal RGB uzayına dönüştürülür, ITU-R BT.709 ağırlıklarıyla göreceli parlaklık (L) hesaplanır ve iki rengin oranı 1:1 ile 21:1 arasında derecelendirilir.

En İyi Uygulamalar ve Temel Yönergeler

  • Standart Metinlerde Asgari 4.5:1 Oranını Yakalayın: WCAG AA standardına göre 18pt altındaki normal metinlerin arka planla kontrast oranı en az 4,5:1 olmalıdır.
  • Büyük Başlıklar ve Butonlarda 3.0:1 Eşiğini Aşın: 18pt (24px) üzeri veya kalın 14pt (18.5px) üzeri büyük metinler için asgari kabul edilebilir oran 3:1'dir.
  • Yalnızca Renk Farkına Güvenmeyin: Hata veya başarı durumlarını bildirirken yalnızca kırmızı/yeşil renge değil, ikonlar ve metinsel uyarılara da yer verin.
  • Gelişmiş AAA Seviyesi İçin 7.0:1 Oranını Hedefleyin: Kamu kurumları ve yüksek erişilebilirlik gerektiren platformlarda en üst düzey olan 7:1 kontrast oranını tercih edin.

Sıkça Sorulan Sorular (SSS)

WCAG AA ile AAA seviyeleri arasındaki temel fark nedir?
AA seviyesi küresel web standartlarında yasal olarak kabul gören asgari erişilebilirlik eşiğidir (4.5:1); AAA seviyesi ise çok daha katı olan en yüksek erişilebilirlik standardıdır (7:1).
Göreceli parlaklık (Relative Luminance) nasıl hesaplanır?
sRGB renk uzayındaki kırmızı, yeşil ve mavi kanalların insan gözünün ışık hassasiyetine göre (Yeşil: %71.5, Kırmızı: %21.2, Mavi: %7.2) ağırlıklandırılmasıyla bulunur.
Form alanlarının kenarlıkları (borders) için de kontrast kuralı var mıdır?
Evet. WCAG 2.1 standardına göre buton kenarlıkları ve girdi kutuları gibi metin dışı arayüz bileşenleri için de en az 3:1 kontrast oranı aranır.
Karanlık mod (Dark Mode) tasarımlarında kontrast nasıl yönetilmelidir?
Saf siyah (#000000) zemin üzerine saf beyaz (#FFFFFF) metin gözü yorabilir; bunun yerine koyu gri zeminler üzerinde yüksek kontrastlı açık tonlar tercih edilmelidir.