WCAG Standartlarında Renk Kontrastı

Renk kontrastı, ön plan öğesi ile arka plan arasındaki luminans farkının ölçülebilir oranını ifade eden bir erişilebilirlik metriğidir. 2026 yılı itibarıyla Avrupa Erişilebilirlik Yasası (EAA) yürürlüğe girdi ve WCAG 2.2 AA seviyesi kontrast gereklilikleri yasal zorunluluk statüsüne yükseldi. Bu tablo, renk kontrastını estetik bir tercih olmaktan çıkarıp teknik SEO ve yasal uyumluluk kesişiminde kritik bir mühendislik parametresine dönüştürdü.

Kontrast Oranı Hesaplama Formülü ve Luminans Değeri

Kontrast oranı, iki rengin göreli luminans değerlerinin birbirine bölünmesiyle hesaplanır. Formül (L1 + 0.05) / (L2 + 0.05) şeklindedir. L1 daha açık rengin, L2 daha koyu rengin göreli luminans değerini temsil eder. Sonuç 1:1 (sıfır kontrast) ile 21:1 (maksimum kontrast, siyah-beyaz) arasında bir oran üretir.

Göreli luminans hesabı, RGB değerlerinin doğrusal uzaya dönüştürülmesini gerektirir. sRGB renk uzayında her kanal değeri önce 255'e bölünür, ardından gamma düzeltmesi uygulanır. Bu hesaplama insan gözünün yeşil ışığa daha hassas olduğunu yansıtan ağırlıklı bir toplam kullanır: L = 0.2126R + 0.7152G + 0.0722B. Dolayısıyla iki rengin gözle "yeterince farklı" görünmesi, matematiksel olarak yeterli kontrast oranına sahip olduğu anlamına gelmez.

WCAG 2.2 AA Seviyesi Kontrast Eşikleri

Normal metin için minimum kontrast oranı 4.5:1 olarak belirlenmiştir. Bu eşik, 16 piksel ve altındaki tüm gövde metinleri için geçerlidir. Büyük metin kategorisine giren öğeler (24 piksel ve üzeri normal kalınlık veya 18.66 piksel ve üzeri kalın metin) için eşik 3:1'e düşer.

Grafik öğeler ve kullanıcı arayüzü bileşenleri (buton kenarları, form alanı çerçeveleri, ikonlar) ayrı bir kriter altında değerlendirilir. WCAG 2.2 Başarı Kriteri 1.4.11, bu öğeler için minimum 3:1 kontrast oranı gerektirir. Bir butonun metin kontrastı 4.5:1'i karşılasa bile buton kenarının arka planla kontrastı 3:1'in altında kaldığında erişilebilirlik ihlali oluşur.

AAA Seviyesi Kontrast Gereklilikleri

AAA seviyesi, normal metin için 7:1 ve büyük metin için 4.5:1 kontrast oranı talep eder. Bu seviye WCAG'da "önerilen" olarak tanımlanır ve yasal zorunluluk taşımaz. Ancak kamu kurumları, sağlık sektörü ve eğitim platformları için AAA seviyesi fiili standart haline gelmiştir.

Pratikte 7:1 oranını karşılamak tasarım paletini ciddi ölçüde kısıtlar. Beyaz arka planda bu oranı sağlayan en açık metin rengi yaklaşık #595959 (koyu gri) seviyesindedir. Siyah (#000000) arka planda ise en koyu metin rengi #949494 civarında kalır. AAA seviyesini hedefleyen projeler renk paletini kontrast eşiğine göre kurgulamalıdır, tersi yaklaşım sürekli düzeltme döngüsüne yol açar.

Kontrast Oranını Etkileyen Gizli Değişkenler

İki renk arasındaki matematiksel kontrast oranı sabit bir değerdir. Ancak kullanıcının algıladığı kontrast, ekran parlaklığı, ortam aydınlatması ve ekran teknolojisine göre değişir. OLED panellerde siyah piksel gerçek siyahtır ve kontrast algısı yükselir. IPS LCD panellerde ise siyah tonları gri kaçar ve algılanan kontrast düşer.

Ortam aydınlatması da kritik bir değişkendir. Güneş ışığı altında kullanılan bir mobil ekranda 4.5:1 kontrast oranı yetersiz kalabilir. Bu nedenle WCAG eşikleri minimum değerler olarak belirlenmiştir ve gerçek projelerde AA eşiğinin yüzde 20 ila 30 üzerinde kontrast hedeflemek güvenli yaklaşımdır. 4.5:1 yerine 6:1 oranını taban almak, farklı ekran koşullarında tutarlı okunabilirlik sağlar.

Chrome DevTools ile Kontrast Oranı Denetimi

Chrome DevTools, öğe üzerine gelindiğinde kontrast oranını otomatik olarak hesaplar ve gösterir. Elements panelinde herhangi bir metin öğesi seçildiğinde, renk değerinin yanında kontrast ikonu belirir. Bu ikona tıklandığında AA ve AAA seviyelerinin karşılanıp karşılanmadığı anlık olarak raporlanır.

DevTools'un renk seçici aracında iki adet eğri çizgi görünür. Üst çizgi AA eşiğini, alt çizgi AAA eşiğini temsil eder. Renk seçicide imleç bu çizgilerin üzerinde kaldığında seçilen renk ilgili seviyeyi karşılar. Bu görsel rehber, tasarımcıya WCAG uyumlu en yakın rengi doğrudan seçme olanağı tanır. DevTools'u açmak için öğeye sağ tıklayıp "İncele" seçeneğini kullanmak ve ardından Styles panelinde renk kutusuna tıklamak yeterlidir.

Lighthouse Erişilebilirlik Denetiminde Kontrast Raporlama

Lighthouse, erişilebilirlik kategorisinde "Background and foreground colors do not have a sufficient contrast ratio" başlığı altında kontrast ihlallerini listeler. Her başarısız öğe için mevcut kontrast oranı, beklenen minimum oran ve öğenin CSS seçicisi raporlanır.

Komut satırından toplu denetim çalıştırmak için npx lighthouse https://site.com --only-categories=accessibility --output=json komutu kullanılır. JSON çıktısında color-contrast anahtarı altında başarısız öğeler dizisi bulunur. Bu veriyi CI/CD pipeline'ına entegre etmek, her dağıtımda kontrast gerilemesini otomatik olarak yakalamayı sağlar. Düzeltme önceliğini belirlemek için başarısız öğe sayısının sayfa bazında sıralanması etkili bir yöntemdir.

axe-core ile Gelişmiş Kontrast Testi

Lighthouse'un kontrast denetimi temel düzeydedir ve yalnızca statik CSS değerlerini analiz eder. Gradient arka planlar, yarı saydam (opacity) katmanlar ve CSS blend modları kullanıldığında Lighthouse yanıltıcı sonuç verebilir. axe-core bu senaryolarda daha güvenilir sonuç üretir.

axe-core'un renk kontrastı algoritması, öğenin render edilmiş görünümünü analiz eder. Gradient üzerindeki metnin her noktasında kontrastı ayrı ayrı hesaplar ve en düşük kontrast oranını raporlar. Komut satırında npx axe-core https://site.com --rules=color-contrast çalıştırılarak yalnızca kontrast kuralı test edilir. Bu hedefli test, büyük sitelerde denetim süresini önemli ölçüde kısaltır.

Renk Körlüğü Simülasyonu ve Kontrast Etkisi

Dünya nüfusunun yaklaşık yüzde 8'i (erkeklerde yüzde 12'ye kadar) bir tür renk görme bozukluğu yaşar. En yaygın tip olan deuteranopi (kırmızı-yeşil körlüğü), kırmızı ve yeşil tonları arasındaki kontrastı neredeyse sıfıra indirir. Dolayısıyla yalnızca renkle bilgi aktaran arayüz öğeleri bu kullanıcılar için erişilemez hale gelir.

Chrome DevTools'ta "Rendering" panelinde "Emulate vision deficiencies" seçeneği ile protanopia, deuteranopia, tritanopia ve achromatopsia simülasyonları yapılabilir. Bu simülasyonlar, renk kontrastının renk körlüğü koşullarında nasıl değiştiğini doğrudan gösterir. Form doğrulama mesajlarında yalnızca kırmızı renk kullanmak yerine ikon, metin ve kenarlık değişimi gibi çoklu görsel ipuçları sunmak bu kullanıcı grubunu kapsayan doğru yaklaşımdır.

Metin Üzerine Yerleştirilen Görsellerde Kontrast Yönetimi

Hero bölümlerinde ve banner alanlarında metnin doğrudan görsel üzerine yerleştirilmesi yaygın bir tasarım tercihidir. Bu durumda arka plan rengi sabit değildir ve görselin farklı bölgelerinde farklı luminans değerleri bulunur. Metnin tüm konumlarda okunabilir kalması için ek önlemler gerekir.

En etkili çözüm, görsel ile metin arasına yarı saydam bir overlay katmanı eklemektir. CSS'te background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)) tanımı görsel üzerine yüzde 60 opaklıkta siyah katman uygular. Beyaz metin bu katman üzerinde minimum 7:1 kontrast oranına ulaşır. Alternatif olarak metin öğesine text-shadow: 0 2px 4px rgba(0,0,0,0.8) eklenmesi metnin kenarlarını güçlendirir, ancak bu yöntem tek başına WCAG uyumunu garanti etmez.

Buton ve Form Elemanlarında Kontrast Gereklilikleri

Buton tasarımında üç ayrı kontrast ilişkisi kontrol edilmelidir: buton metni ile buton arka planı arasındaki kontrast (4.5:1), buton kenarı ile sayfa arka planı arasındaki kontrast (3:1) ve buton arka planı ile sayfa arka planı arasındaki kontrast (3:1). Birçok tasarımda metin kontrastı karşılanırken buton kenar kontrastı gözden kaçar.

Form alanlarında ise input çerçevesinin arka planla kontrastı ayrıca denetlenir. Açık gri (#e0e0e0) çerçeve beyaz arka planda yalnızca 1.4:1 kontrast üretir ve WCAG 1.4.11 kriterini ihlal eder. Minimum #767676 çerçeve rengi beyaz arka planda 4.5:1 kontrast sağlar. Form alanları için bu değeri taban almak, hem metin hem de bileşen kontrastını tek seferde karşılar ve denetim tekrarını önler.

Placeholder Metin Kontrastı Tuzağı

Form alanlarındaki placeholder metin, WCAG'ın kontrast kriterlerine tabi değildir çünkü "bilgilendirici metin" olarak değil "ipucu" olarak sınıflandırılır. Ancak birçok site placeholder metni gerçek etiket yerine kullanır. Kullanıcı alana odaklandığında placeholder kaybolur ve hangi bilginin istendiği belirsizleşir.

Erişilebilirlik perspektifinden placeholder metni hiçbir zaman label öğesinin yerine geçmemelidir. Placeholder kullanıldığında ise kontrastının en az 4.5:1 olması kullanıcı deneyimini iyileştirir. Varsayılan placeholder rengi çoğu tarayıcıda #757575 civarındadır ve beyaz arka planda 4.6:1 kontrast üretir. Bu değerin altına düşen özelleştirilmiş placeholder renkleri, denetim aracı uyarı vermese bile kullanıcı deneyimini olumsuz etkiler.

Link Metninin Çevre Metinden Ayırt Edilebilirliği

WCAG Başarı Kriteri 1.4.1, bağlantı metninin çevre metinden yalnızca renkle değil ek bir görsel ipucuyla (altı çizili, kalın, ikon) da ayırt edilmesini gerektirir. Bağlantı rengi ile çevre metin rengi arasında minimum 3:1 kontrast oranı bulunmalıdır. Aynı anda bağlantı rengi ile arka plan arasında 4.5:1 kontrast oranı da sağlanmalıdır.

Bu çift kontrast gereksinimi, kullanılabilecek bağlantı rengi aralığını daraltır. Beyaz arka planda (#ffffff) siyah metin (#333333) kullanılan bir sayfada bağlantı rengi olarak #0066cc seçildiğinde: bağlantı-arka plan kontrastı 5.9:1, bağlantı-metin kontrastı 3.2:1 değerine ulaşır ve her iki kriteri karşılar. Altı çizili stili ek olarak uygulandığında erişilebilirlik uyumu tam olarak sağlanır.

Devre Dışı (Disabled) Öğelerde Kontrast İstisnası

WCAG 2.2, devre dışı bırakılmış arayüz öğelerini kontrast gerekliliklerinden muaf tutar. Devre dışı bir buton veya form alanının kontrastı 4.5:1 eşiğinin altında kalabilir. Bu istisna, öğenin "etkin olmadığının" görsel olarak anlaşılması amacıyla tanınmıştır.

Ancak bu istisna kötüye kullanıma açıktır. Bazı tasarımlarda aktif öğeler bile düşük kontrast ile stillendirilir ve denetim araçlarında "disabled" özelliği atanarak hata gizlenir. axe-core bu senaryoyu tespit eder ve DOM'da disabled veya aria-disabled özelliği taşıyan öğelerin gerçekten işlevsiz olup olmadığını doğrular. Sahte disabled ataması yapılmış öğeler raporda ayrıca işaretlenir.

Dark Mode Kontrast Parametreleri

Koyu tema tasarımında kontrast hesabı tersine döner: açık metin koyu arka plan üzerinde değerlendirilir. Saf beyaz (#ffffff) metin saf siyah (#000000) arka planda 21:1 kontrast oranı üretir. Bu değer aşırı yüksektir ve uzun okuma sürelerinde göz yorgunluğuna neden olur.

Koyu temada optimum gövde metin rengi #e0e0e0 (açık gri) ile #1a1a1a (koyu arka plan) kombinasyonunda 13.5:1 kontrast oranı sağlar. Bu değer AAA seviyesini rahatlıkla aşar ve göz konforunu korur. CSS'te bu dengeyi kurmak için:

    
@media (prefers-color-scheme: dark) {
  :root {
    --text-primary: #e0e0e0;
    --text-secondary: #a0a0a0;
    --bg-primary: #1a1a1a;
    --bg-surface: #2d2d2d;
  }
}       
    

--text-secondary değişkeni ikincil metin öğeleri (caption, meta bilgi) için kullanılır ve 7.2:1 kontrast oranıyla AAA seviyesini karşılar.

Not: Kontrast Denetiminde Herkesin Düştüğü Tuzak

Çoğu uzman aksini iddia etse de kontrast denetiminin en zayıf halkası otomatik araçlar değil, tasarım sürecinin kendisidir. Projeler genellikle şu sırayı izler: önce renk paleti belirlenir, ardından tasarım tamamlanır, en sonda erişilebilirlik denetimi yapılır. Denetimde düzinelerce kontrast hatası çıkar ve tasarım ekibi renkleri değiştirmek istemez. Sonuç olarak minimum düzeltmeler yapılır ve marjinal geçiş sağlanır. Doğru yaklaşım bunun tam tersidir: renk paleti WCAG kontrast oranlarına göre kurgulanmalı, tasarım bu paletle başlamalıdır. Figma'da "Stark" veya "A11y - Color Contrast Checker" eklentileriyle renk çifti oluşturulurken kontrast oranı anlık olarak kontrol edilir. Tasarım başlamadan kontrast garantisi almak, projenin sonunda yapılan panik düzeltmelerini tamamen ortadan kaldırır.

Gradient ve Yarı Saydam Arka Planlarda Kontrast Hesabı

Düz renk arka planlarda kontrast hesabı tekil bir orandır. Gradient arka planlarda ise kontrastın gradient boyunca değişmesi nedeniyle en düşük kontrast noktası esas alınmalıdır. Açıktan koyuya geçen bir gradient üzerinde beyaz metin kullanıldığında, açık bölgedeki kontrast yetersiz kalabilir.

CSS gradient üzerindeki kontrast değerlendirmesi için Manuel denetim gerekir. Gradient'in başlangıç ve bitiş renklerinin her ikisinde de metin kontrastının karşılanması yeterli değildir. Ara tonlarda kontrast düşüşü oluşabilir. En güvenli yöntem, gradient renk duraklarını (color stops) ayrı ayrı test etmek ve en düşük kontrastlı durakta bile 4.5:1 oranının sağlandığını doğrulamaktır. Alternatif olarak metin bölgesine sabit renk arka plan (solid fallback) uygulamak gradient riskini ortadan kaldırır.

Kontrast Oranı Doğrulama Araçları ve Karşılaştırması

Farklı araçlar kontrast hesabında farklı algoritmalar kullanır ve sonuçlar marjinal düzeyde farklılık gösterebilir. Temel araçları ve özelliklerini değerlendirmek kritik bir adımdır:

• WebAIM Contrast Checker doğrudan web üzerinden iki renk kodu girilerek anlık oran hesaplar ve AA/AAA uyumluluğunu gösterir.
• Colour Contrast Analyser (CCA) masaüstü uygulaması olarak çalışır, ekran üzerinde herhangi bir noktadan renk örneklemesi yapar ve gradient alanlarını test etmeye olanak tanır.
• Stark (Figma eklentisi) tasarım aşamasında frame içindeki tüm metin-arka plan çiftlerini toplu olarak tarar ve uyumsuz çiftleri listeler.
• axe DevTools tarayıcı eklentisi render edilmiş sayfada canlı denetim yapar ve pseudo-elementler, overlay katmanları dahil gerçek görünüm üzerinden kontrast hesaplar.

APCA Algoritması ve Gelecek Nesil Kontrast Standardı

WCAG 2.x'in kullandığı kontrast formülü eleştirilere maruz kalmaktadır. Özellikle koyu arka plan üzerinde açık metin senaryolarında formül insan algısını tam yansıtmaz. Advanced Perceptual Contrast Algorithm (APCA), WCAG 3.0 taslağında bu formülün yerini almak üzere tasarlanmıştır.

APCA, font boyutunu ve ağırlığını kontrast hesabına dahil eder. Mevcut WCAG formülü yalnızca renk çiftine bakarken APCA aynı renk çiftinin 14 piksel ince fontta farklı, 24 piksel kalın fontta farklı kontrast değeri üretmesine olanak tanır. LinkedIn üzerindeki erişilebilirlik mühendisliği tartışmalarında APCA'nın daha doğru sonuçlar verdiği yaygın şekilde kabul görmektedir. Ancak WCAG 3.0 henüz taslak aşamasında olduğu için mevcut projelerde WCAG 2.2 formülü esas alınmalıdır.

Renk Kontrastının SEO Sinyalleri Üzerindeki Dolaylı Etkisi

Renk kontrastı doğrudan bir sıralama faktörü değildir. Ancak düşük kontrast okunabilirliği bozar, okunabilirlik bozulduğunda oturum süresi düşer ve hemen çıkma oranı artar. Bu etkileşim metrikleri, sayfa deneyimi sinyali olarak sıralama algoritmasında değerlendirilir. Dolayısıyla kontrast iyileştirmesi dolaylı ama ölçülebilir bir SEO etkisi üretir.

CrUX (Chrome User Experience Report) verileri, erişilebilirlik puanı yüksek sitelerin ortalama oturum süresinin yüzde 15 ila 20 daha uzun olduğunu göstermektedir. Kontrast düzeltmesi bu puanın en hızlı artırılabilen bileşenidir çünkü CSS değişiklikleriyle anında uygulanır ve yeniden dağıtım gerektirmez.

Otomatik Kontrast Düzeltme Stratejisi

Yüzlerce sayfada kontrast hatası tespit edildiğinde manuel düzeltme ölçeklenebilir değildir. CSS custom properties (değişkenler) ile merkezi renk yönetimi, tek bir dosya değişikliğiyle tüm siteyi düzeltmeye olanak tanır.

    
:root {
  --color-text-primary: #333333;
  --color-text-secondary: #595959;
  --color-text-muted: #767676;
  --color-bg-primary: #ffffff;
  --color-link: #0055aa;
  --color-border: #767676;
}      
    

Bu değişkenler WCAG AA seviyesinde beyaz arka plan üzerinde şu kontrast oranlarını garanti eder: primary 12.6:1, secondary 7.0:1, muted 4.5:1 (AA eşiği), link 7.5:1, border 4.5:1. Tüm bileşenler bu değişkenleri referans aldığında, gelecekte yapılacak renk güncellemeleri tek noktadan yönetilir.

Focus Durumunda Kontrast Gereklilikleri

Klavye navigasyonu kullanan kullanıcılar için focus göstergesi hayati önem taşır. WCAG 2.2 Başarı Kriteri 2.4.7, odaklanılan öğenin görsel olarak belirgin şekilde işaretlenmesini gerektirir. Focus halkasının hem öğe arka planıyla hem de sayfa arka planıyla en az 3:1 kontrast oranı sağlaması zorunludur.

CSS'te varsayılan tarayıcı focus stilini kaldırmak (outline: none) ve yerine kontrast uyumlu bir alternatif koymamak en yaygın erişilebilirlik hatalarından biridir. Doğru yaklaşım:

    
:focus-visible {
  outline: 3px solid #0055aa;
  outline-offset: 2px;
}    
    

outline-offset: 2px tanımı, focus halkası ile öğe kenarı arasında boşluk yaratır. Bu boşluk, focus halkasının öğe arka planıyla karışmasını önler ve kontrastı artırır. :focus-visible seçicisi yalnızca klavye navigasyonunda tetiklenir, fare tıklamalarında focus halkası gösterilmez.

CSS Forced Colors Mode ve Yüksek Kontrast Desteği

Windows işletim sisteminin Yüksek Kontrast modu, CSS'te tanımlanan tüm renkleri geçersiz kılar ve sistem renklerini uygular. Bu mod, düşük görme kapasitesine sahip kullanıcılar tarafından aktif olarak kullanılır. forced-colors: active media query'si ile bu modda özel stiller tanımlanabilir.

    
@media (forced-colors: active) {
  .btn {
    border: 2px solid ButtonText;
    background: ButtonFace;
    color: ButtonText;
  }
  
  a {
    color: LinkText;
  }
}  
    

Sistem renk anahtar kelimeleri (ButtonText, ButtonFace, LinkText, CanvasText) Yüksek Kontrast modunda her zaman yeterli kontrastı garanti eder. Bu media query bloğu eklenmediğinde, özel tasarım renkleri sistem tarafından zorla değiştirilir ve öngörülemeyen görsel sonuçlar ortaya çıkar.

Renk Kontrastı İçin Tasarım Sistemi Entegrasyonu

Tek seferlik düzeltmeler yerine tasarım sistemine kontrast kurallarını yerleştirmek kalıcı çözüm sağlar. Design token yapısında her renk çifti kontrastıyla birlikte tanımlanır ve token güncellendiğinde kontrast otomatik olarak doğrulanır.

Figma'da Stark eklentisi ile tüm frame'ler toplu taranır ve uyumsuz çiftler tek listede gösterilir. Kod tarafında ise Stylelint'in a11y/no-low-contrast kuralı CSS dosyalarında tanımlanan renk çiftlerinin kontrastını build aşamasında kontrol eder. stylelint --config .stylelintrc.json "src/**/*.css" komutuyla proje genelinde kontrast ihlalleri tespit edilir. Tasarım tokeni ile linting kuralını birleştirmek kontrast hatalarını hem tasarım hem de kod aşamasında engelleyen çift katmanlı bir güvence mekanizması oluşturur.

Yasal Uyumluluk ve Kontrast İhlallerinin Hukuki Riski

Avrupa Erişilebilirlik Yasası (EAA) Haziran 2025'te yürürlüğe girdi ve AB pazarına hizmet sunan tüm dijital ürünleri kapsar. WCAG 2.2 AA seviyesi, EN 301 549 standardı aracılığıyla yasal referans noktası olarak kabul edilmektedir. Kontrast ihlalleri, bu yasa kapsamında erişilebilirlik uyumsuzluğu olarak değerlendirilir.

ABD'de ADA (Americans with Disabilities Act) kapsamında web erişilebilirliği davaları 2025 yılında 4.000'i aşmıştır. Kontrast yetersizliği, bu davalarda en sık başvurulan teknik gerekçeler arasında yer almaktadır. Türkiye'de ise 5378 sayılı Engelli Hakları Kanunu dijital erişilebilirliği dolaylı olarak kapsar. Yasal risk değerlendirmesi yapılırken kontrast uyumluluğunun yalnızca teknik değil hukuki bir gereklilik olduğu göz önünde tutulmalıdır.

Kontrast Denetim Protokolü ve CI/CD Entegrasyonu

Kontrast uyumluluğunun sürdürülebilir olması için otomatik denetim pipeline'ı kurulmalıdır. Lighthouse CI, axe-core ve Pa11y araçları bu altyapının temel bileşenleridir.

    
npx pa11y-ci --config .pa11yci.json --reporter cli 
    

.pa11yci.json dosyasında test edilecek URL'ler ve kurallar tanımlanır:

    
{
  "defaults": {
    "standard": "WCAG2AA",
    "runners": ["axe"],
    "ignore": []
  },
  "urls": [
    "https://site.com/",
    "https://site.com/urunler",
    "https://site.com/iletisim"
  ]
}
    

Bu yapılandırma, belirlenen URL'lerde WCAG 2 AA standardına göre axe-core motoruyla kontrast denetimi çalıştırır. CI/CD pipeline'ına eklenen bu adım, kontrast ihlali içeren kodun production ortamına ulaşmasını engeller. Her pull request'te otomatik çalışan bu denetim, kontrast uyumluluğunu bir kerelik düzeltme değil sürekli bir mühendislik pratiği haline getirir.