WCAG Başarı Kriterleri · Level AA

WCAG 1.4.11: Metin Dışı Kontrast

WCAG 1.4.11, kullanıcı arayüzü bileşenlerinin ve grafiksel nesnelerin, bitişik renklere karşı en az 3:1 kontrast oranına sahip olmasını gerektirir; böylece az gören kişilerin, etkileşimli kontrolleri, odak göstergelerini ve anlamlı grafikleri yardımcı teknoloji olmadan algılayabilmesi sağlanır.

Bu Kuralın Anlamı

WCAG 1.4.11 Metin Dışı Kontrast, WCAG 2.1’de tanıtılan ve WCAG 2.2’ye taşınan Seviye AA ölçütüdür. Aşağıdaki iki içerik kategorisinin görsel sunumu ile bunlara bitişik renk(ler) arasında en az 3:1 kontrast oranı zorunlu kılınır:

  • Kullanıcı Arayüzü (UI) Bileşenleri: Metin girişleri, onay kutuları, radyo düğmeleri, anahtarlar, açılır menüler ve düğmeler gibi etkileşimli kontrolleri tanımlayan görsel sınırlar veya göstergeler. Buna hem bileşenin kendisi hem de tüm görsel durum değişiklikleri (ör. hover, odak, seçili, hata) dahildir.
  • Grafiksel Nesneler: İçeriğin anlaşılması için gerekli olan simgelerin, grafiklerin, diyagramların ve diğer anlamlı görsellerin parçaları. Bilgi ileten grafiklerin her bir parçası, çevresindeki renge karşı 3:1 eşiğini karşılamalıdır.

Kontrast oranı, ön plan öğesi ile ona hemen bitişik renk arasında ölçülür — genellikle arka plan rengi, kenarlık rengi veya bir grafiğin komşu bir segmenti. Hesaplama, WCAG 1.4.3’te tanımlanan aynı göreli parlaklık formülünü kullanır, ancak metin dışı öğeler biraz daha düşük kontrastla da ayırt edilebilir olduğundan eşik 4.5:1 yerine 3:1’dir.

Başarılı sayılması, bir UI bileşenini tanımlayan veya bir grafikte bilgi ileten her görsel göstergenin en az 3:1 oranına ulaşması demektir. Başarısızlık, bir kenarlık, simge çizgisi, grafik segmenti veya durum göstergesi bu oranın altına düştüğünde ve bileşen veya grafik bu görsel bilgi olmadan tanımlanamaz veya anlaşılamaz olduğunda ortaya çıkar.

WCAG spesifikasyonu birkaç önemli istisna tanımlar:

  • Etkin olmayan bileşenler: Devre dışı bırakılmış ve etkileşim için kullanılamayan UI bileşenleri muaf tutulur. Tıklanamayacak şekilde gri renge alınmış bir düğmenin kontrast gereksinimini karşılaması gerekmez.
  • Kullanıcı aracısı tarafından kontrol edilen görünüm: Görsel sunumu tamamen tarayıcının varsayılan stilleri tarafından kontrol edilen (yazar CSS’iyle geçersiz kılınmamış) bileşenler muaf tutulur, çünkü sorumluluk tarayıcı üreticisine aittir.
  • Temel veya dekoratif grafikler: Belirli sunumu aktarılan bilgi için temel olan (ör. ülkeleri temsil eden ulusal bayraklar) veya tamamen dekoratif olan grafiksel nesneler muaf tutulur. Logolar da genel olarak bu madde kapsamında muaf kabul edilir.
  • Metin: Metin ve metin görüntüleri zaten 1.4.3 ve 1.4.6 kapsamında ele alınır ve 1.4.11’e girmez.

Odak göstergeleri, WCAG 2.2’de özel dikkat gerektirir. 2.4.11 (Odak Görünümü) ölçütü odak görünürlüğü için daha sıkı gereksinimler ekler, ancak 1.4.11 hâlâ özel odak halkasının arka planına karşı kontrastı için geçerlidir. Odak göstergesi olarak kullanılan özel bir outline veya box-shadow, bu ölçütü bağımsız olarak karşılamak için bitişik renge karşı 3:1 oranına ulaşmalıdır.

Neden Önemlidir

Dünya Sağlık Örgütü’ne göre dünya genelinde yaklaşık 2,2 milyar kişinin bir tür görme bozukluğu vardır. Bu kişilerin önemli bir kısmı — orta ila şiddetli görme kaybı yaşayan tahmini 253 milyon kişi de dahil — ekran okuyucu kullanmadan dijital arayüzleri algılamak ve onlarla etkileşime geçmek için yeterli kontrasta güvenir. Büyütme yazılımları, yüksek kontrast modları kullanan veya yalnızca zorlu ışık koşullarında gezinme yapan düşük görme yetisine sahip kullanıcılar, 1.4.11 ihlallerinden en doğrudan etkilenen gruplar arasındadır.

Pratik bir senaryo düşünün: glokomu olan bir kullanıcı, bir hastanenin web sitesinde sigorta talep formu dolduruyor. Form alanları, beyaz arka plan (#ffffff) üzerinde açık gri bir kenarlık (#cccccc) kullanıyor ve bu yalnızca 1.6:1 kontrast oranı veriyor — gerekli 3:1’in çok altında. Kullanıcı, giriş alanlarının nerede başlayıp nerede bittiğini göremiyor, bu nedenle bu alanlara güvenilir şekilde tıklayamıyor veya formun yapısını anlayamıyor. Formu tamamen bırakıyor; bu hem kişisel bir maliyet hem de kurum için hukuki bir sorumluluk doğuruyor.

Görme bozukluğunun ötesinde, bilişsel engeller de düşük kontrastlı UI bileşenlerini yorumlamayı zorlaştırabilir. Dikkat bozukluğu veya işlem zorluğu olan kullanıcılar, sayfa yapısını hızlıca anlayabilmek için etkileşimli ve etkileşimli olmayan öğeler arasında güçlü görsel ayrımlara güvenir. Benzer şekilde, büyük işaretçi hedefleri kullanan titreme veya motor bozukluğu olan kullanıcıların, kontrollerin sınırlarını net bir şekilde görmesi, doğru hedefleyebilmek için gereklidir.

İş açısından bakıldığında, 1.4.11’in karşılanması, tüm kullanıcılar için elverişsiz koşullarda kullanılabilirliği artırır — mobil ekranda parlak güneş ışığı, düşük kaliteli monitörler veya renk doğruluğu zayıf eski ekranlar gibi. Destek maliyetlerini azaltır, kitle erişimini genişletir ve zayıf kullanılabilirliğe bağlı hemen çıkma oranlarını düşürerek dolaylı olarak SEO’yu güçlendirir. Hukuki erişilebilirlik yükümlülüklerine tabi kuruluşlar için, bu ölçütte Seviye AA düzeyinde başarısız olmak doğrudan uyum riski oluşturur.

İlgili Axe-core Kuralları

  • color-contrast (kısmi kapsama): Axe-core color-contrast kuralı öncelikle WCAG 1.4.3 kapsamındaki metin kontrastını hedefler, ancak belirli bağlamlarda metin dışı öğeler için de kısmi kontroller yapar. Axe, bileşenin görsel sınırının veya arka planının 3:1 oranını karşılamadığını programatik olarak belirleyebildiğinde, düğmeler ve form kontrolleri gibi UI bileşenlerini işaretler. Ancak, metin dışı öğeler için birçok kontrast hatası otomatik analizle görünmez olduğundan, kuralın kapsamı 1.4.11 için açıkça kısmi olarak işaretlenmiştir. Örneğin, bir SVG simgesinin çizgisinin arka planına karşı kontrastı veya CSS pseudo-elementleriyle uygulanmış özel stilli bir onay kutusunun kenarlığı, render bağlamı olmadan DOM’dan güvenilir şekilde çıkarılamaz. Bir CSS kenarlığının hesaplanmış stili erişilebilirlik ağacında mevcut olabilir, ancak bitişik arka plan — özellikle bir gradyan, görsel veya üst üste binen bir öğe olduğunda — her zaman programatik olarak hesaplanabilir değildir. Bu nedenle axe, 1.4.11 ihlallerini birçok durumda needs review (gözden geçirilmesi gerekiyor) ibaresiyle color-contrast kuralı altında raporlar; bu, aracın potansiyel bir sorun tespit ettiği, ancak bir insanın öğeyi görsel olarak inceleyip gerçek render edilmiş pikselleri örneklemek için bir renk kontrast analiz aracı kullanarak bunu doğrulaması gerektiği anlamına gelir.

Otomatik araçlar metin dışı kontrast hatalarının yalnızca bir kısmını tespit edebildiğinden, manuel test zorunludur. Colour Contrast Analyser (TPGi), tarayıcı DevTools renk seçicileri veya Accessible Colors aracı gibi araçlar, ön plan ve arka plan renklerini doğrudan render edilmiş arayüzden örneklemek için kullanılmalıdır. Otomatik taramalar, kapsamlı bir denetim değil, ilk geçiş olarak değerlendirilmelidir.

Nasıl Test Edilir

  1. Axe DevTools veya Lighthouse ile otomatik tarama çalıştırın: Axe DevTools tarayıcı eklentisini kurun ve tam sayfa taraması yapın. Sonuçlar panelinde, WCAG 1.4.11 ile etiketlenmiş sorunları filtreleyin veya herhangi bir color-contrast ihlalini inceleyin. Metin dışı kontrast kategorisinde Needs Review olarak işaretlenen öğeleri not edin — bunlar için manuel takip gerekir. Lighthouse’ta (Chrome DevTools > Lighthouse sekmesi) bir Erişilebilirlik denetimi çalıştırın ve kontrastla ilgili bulguları inceleyin; Lighthouse’un kapsamının da metin dışı öğeler için kısmi olduğunu unutmayın.
  2. Renk kontrast analizörü ile manuel inceleme: TPGi Colour Contrast Analyser masaüstü uygulamasını indirin ve açın. Her UI bileşen sınırının (ör. bir metin girişinin kenarlığı, bir simgenin çizgisi, bir grafik çubuğunun dolgusu) ön plan rengini örneklemek için damlalık aracını kullanın ve ardından bitişik arka plan rengini örnekleyin. Araç, hesaplanan kontrast oranını gösterecektir. 3:1’in altındaki her oran bir hatadır. Tüm etkileşimli form kontrollerini, yalnızca simge içeren düğmeleri, odak göstergelerini ve veri görselleştirmelerini sistematik olarak gözden geçirin.
  3. Klavye ile gezinme ve odak göstergesi testi: Yalnızca klavyeyi kullanarak sayfanın tamamında sekme ile ilerleyin. Odak alan her etkileşimli öğe için, odak göstergesinin (halka, outline veya arka plan değişimi) görünür olduğunu doğrulayın. Odak göstergesi renginin, öğenin arka planına karşı 3:1 oranına ulaştığını doğrulamak için kontrast analizörünü kullanın. Öğenin beklenen sırada odak aldığını ve görsel göstergenin CSS ile outline: none kullanılarak eşdeğer bir yedek olmadan bastırılmadığını doğrulamak için NVDA + Firefox ve JAWS + Chrome’da test edin.
  4. Yüksek kontrast ve zorunlu renk modlarında test edin: Windows’ta, Yüksek Kontrast modunu etkinleştirin (Ayarlar > Erişim Kolaylığı > Yüksek Kontrast) ve sayfayı yeniden yükleyin. Chromium tabanlı tarayıcılarda DevTools’u açın, Rendering bölümüne gidin ve Emulate CSS media feature forced-colors: active seçeneğini etkinleştirin. UI bileşen sınırlarının görünür kalıp kalmadığını doğrulayın. Zorunlu renk modu uyumu 1.4.11 tarafından katı biçimde zorunlu tutulmasa da, bu modda test yapmak yalnızca düşük kontrastlı renk ipuçlarına dayanan öğeleri ortaya çıkarır.
  5. Grafiksel nesneleri bağlam içinde doğrulayın: Her grafik, simge, diyagram veya bilgi amaçlı görsel için, anlam ileten her segmenti veya yolu belirleyin. Grafiğin içinde bitişik renkleri (ör. iki komşu pasta grafik dilimi) ve çevresindeki sayfa arka planına karşı renkleri örneklemek için damlalık aracını kullanın. Bilgi ileten her ayrı parça, tek tek 3:1 oranına ulaşmalıdır.
  6. Tüm bileşen durumlarını kontrol edin: Etkileşimli öğelerin birden fazla durumu vardır — varsayılan, hover, odak, aktif, seçili, işaretli, hata ve başarı. Her durumu ayrı ayrı test edin. Varsayılan durumda geçen bir düğme kenarlığı, rengi düşük kontrastlı bir varyanta değişirse hover durumunda başarısız olabilir.

Nasıl Düzeltilir

Form Girdi Kenarlığı — Hatalı

<!-- Fails: light grey border (#cccccc) on white (#ffffff) = 1.6:1 ratio -->
<style>
  .form-input {
    border: 1px solid #cccccc;
    background-color: #ffffff;
    padding: 8px 12px;
  }
</style>
<label for='email'>Email Address</label>
<input type='email' id='email' class='form-input' />

Form Girdi Kenarlığı — Doğru

<!-- Passes: darker border (#767676) on white (#ffffff) = 4.54:1 ratio, exceeds 3:1 -->
<style>
  .form-input {
    border: 1px solid #767676; /* Darkened to achieve sufficient contrast */
    background-color: #ffffff;
    padding: 8px 12px;
  }
  .form-input:focus {
    outline: 3px solid #005fcc; /* Focus ring at 5.9:1 against white */
    outline-offset: 2px;
  }
</style>
<label for='email'>Email Address</label>
<input type='email' id='email' class='form-input' />

Yalnızca Simge İçeren Düğme — Hatalı

<!-- Fails: light grey icon (#aaaaaa) on white (#ffffff) = 2.32:1 ratio -->
<style>
  .icon-btn { background: none; border: none; color: #aaaaaa; }
</style>
<button class='icon-btn' aria-label='Delete item'>
  <svg aria-hidden='true' focusable='false' width='24' height='24'>
    <path d='M3 6h18M8 6V4h8v2M19 6l-1 14H6L5 6' stroke='currentColor' stroke-width='2' fill='none'/>
  </svg>
</button>

Yalnızca Simge İçeren Düğme — Doğru

<!-- Passes: dark icon (#595959) on white (#ffffff) = 7:1 ratio, well above 3:1 -->
<style>
  .icon-btn { background: none; border: none; color: #595959; cursor: pointer; }
  .icon-btn:focus-visible {
    outline: 3px solid #005fcc;
    outline-offset: 2px;
    border-radius: 4px;
  }
</style>
<button class='icon-btn' aria-label='Delete item'>
  <svg aria-hidden='true' focusable='false' width='24' height='24'>
    <!-- Darker stroke ensures the icon shape is perceivable -->
    <path d='M3 6h18M8 6V4h8v2M19 6l-1 14H6L5 6' stroke='currentColor' stroke-width='2' fill='none'/>
  </svg>
</button>

Özel Onay Kutusu — Hatalı

<!-- Fails: custom checkbox uses a light border (#d0d0d0) on white background -->
<style>
  .custom-checkbox-box {
    width: 18px; height: 18px;
    border: 2px solid #d0d0d0; /* 1.3:1 ratio against white — fails */
    border-radius: 3px;
    display: inline-block;
  }
</style>
<label>
  <input type='checkbox' style='position:absolute;opacity:0;width:0;height:0' />
  <span class='custom-checkbox-box'></span>
  I agree to the terms
</label>

Özel Onay Kutusu — Doğru

<!-- Passes: border (#5a5a5a) on white = 7.2:1. Checked state tick also uses sufficient contrast -->
<style>
  .custom-checkbox-input {
    position: absolute; opacity: 0; width: 0; height: 0;
  }
  .custom-checkbox-box {
    width: 18px; height: 18px;
    border: 2px solid #5a5a5a; /* Sufficient contrast against white background */
    border-radius: 3px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
  }
  .custom-checkbox-input:checked + .custom-checkbox-box {
    background-color: #005fcc; /* Blue fill on checked */
    border-color: #005fcc;
  }
  .custom-checkbox-input:checked + .custom-checkbox-box::after {
    content: '';
    display: block;
    width: 10px; height: 6px;
    border-left: 2px solid #ffffff; /* White tick on blue = 5.9:1 */
    border-bottom: 2px solid #ffffff;
    transform: rotate(-45deg) translateY(-2px);
  }
  .custom-checkbox-input:focus-visible + .custom-checkbox-box {
    outline: 3px solid #005fcc;
    outline-offset: 2px;
  }
</style>
<label class='custom-label'>
  <input type='checkbox' class='custom-checkbox-input' />
  <span class='custom-checkbox-box' aria-hidden='true'></span>
  I agree to the terms
</label>

Veri Grafiği — Hatalı

<!-- Fails: two adjacent pie chart segments use similar light hues with <3:1 contrast -->
<svg viewBox='0 0 200 200' aria-label='Market share chart' role='img'>
  <!-- Segment A: #f5c6cb (light pink) adjacent to Segment B: #ffeeba (light yellow) -->
  <!-- Contrast ratio between these two colors is approximately 1.1:1 — fails -->
  <path d='M100,100 L100,10 A90,90 0 0,1 190,100 Z' fill='#f5c6cb' />
  <path d='M100,100 L190,100 A90,90 0 0,1 100,190 Z' fill='#ffeeba' />
</svg>

Veri Grafiği — Doğru

<!-- Passes: use high-contrast segment fills OR add a visible border between segments -->
<svg viewBox='0 0 200 200' aria-label='Market share chart: Segment A 50%, Segment B 25%' role='img'>
  <!-- Option 1: Use a dark stroke between segments to separate them at 3:1 against both fills -->
  <path d='M100,100 L100,10 A90,90 0 0,1 190,100 Z' fill='#d63384' stroke='#ffffff' stroke-width='2' />
  <path d='M100,100 L190,100 A90,90 0 0,1 100,190 Z' fill='#0d6efd' stroke='#ffffff' stroke-width='2' />
  <!-- The white (#ffffff) stroke separates the two segments; each fill also has 3:1 against white bg -->
</svg>

Yaygın Hatalar

  • Düşük DPI’da görünmez hale gelen, 3:1’i geçen tek piksellik kenarlık kullanmak: Uygun bir renk bile düşük çözünürlüklü bir ekranda kenarlık yalnızca 1px genişliğinde ise algılanamaz hale gelebilir. Sınırın fiziksel olarak algılanabilir olmasını sağlamak için border: 2px solid veya uygun bir box-shadow’u, uyumlu bir renkle birlikte kullanın.
  • Arka planın her zaman beyaz olduğunu varsaymak: Bir form alanı veya simge, açık gri arka plana (#f5f5f5) sahip bir kart veya kenar çubuğu içinde göründüğünde, kontrast beyaza karşı değil, bu griye karşı ölçülmelidir. Beyaz üzerinde geçen bir kenarlık, tonlu bir arka planda başarısız olabilir.
  • Varsayılan odak outline’ını outline: none ile kaldırıp eşdeğer bir stil sağlamamak: Bu, en yaygın 1.4.11 hatalarından biridir. Küresel olarak :focus { outline: none; } ayarlamak, klavye kullanıcıları için odak görünürlüğünü yok eder. Her zaman, arka planına karşı en az 3:1 kontrast sağlayan özel bir odak stiliyle değiştirin.
  • Devre dışı durumu, tüm kontrast kontrollerini atlamak için bahane olarak kullanmak: Devre dışı bileşenler muaf tutulur, ancak geliştiriciler bazen disabled özniteliğini veya aria-disabled='true' değerini gerçekten eklemeden, düşük kontrastlı stillerle öğeleri görsel olarak devre dışı gibi gösterir. Devre dışı görünüp hâlâ etkileşimli olan bir öğe, yine de 1.4.11’i geçmelidir.
  • Ayrı bir çizgi kullanmadan, grafik segmentlerini yalnızca renge güvenerek ayırt etmek: Tek farkın ton olduğu (ör. açık mavi vs. açık yeşil) iki komşu grafik segmenti, kontrast oranları 3:1’in altındaysa başarısız olabilir. Segmentler arasında 2px beyaz veya koyu bir ayırıcı çizgi eklemek güvenilir bir çözümdür.
  • Kontrast düzeltmelerini yalnızca varsayılan duruma uygulayıp hover, odak, hata ve başarı durumlarını unutmak: Her etkileşimli durumun kendi görsel sunumu vardır. Varsayılan durumda geçen bir düğme kenarlığı, hover durumunda düşük kontrastlı bir renge kayabilir. Tüm durumlar bağımsız olarak test edilmelidir.
  • Simgeleri arka plan görseli olarak gömüp kontrast için CSS rengini kullanmaya çalışmak: HTML içinde satır içi kullanılan SVG simgeler color ve currentColor’a yanıt verir, ancak CSS background-image olarak kullanılan simgeler CSS ile yeniden renklendirilemez. Simge görsel dosyasının kendisi yetersiz kontrasta sahipse, varlık değiştirilmeden hiçbir CSS düzeltmesi sorunu çözemez.
  • Girdi alanlarındaki placeholder metninin 1.4.11 kapsamında olmadığını, ancak yine de düzenlendiğini unutmak: Placeholder metni 1.4.11 değil, 1.4.3 (4.5:1 metin kontrastı) kapsamına girer. Geliştiriciler bazen yanlışlıkla placeholder metne 3:1 eşiğini uygulayarak, fark edilmeyen ayrı bir 1.4.3 hatası yaratır.
  • Uyumsuz ara renkten geçen CSS geçişleri kullanmak: Bir öğe, uyumlu bir renkten, uyumsuz bir ara renge ve ardından başka bir uyumlu renge animasyonla geçebilir. Başlangıç ve bitiş durumları geçse bile, görsel bileşen geçiş sırasında teknik olarak uyumsuzdur. prefers-reduced-motion medya sorgularını dikkatli kullanın ve geçişleri düşük kontrastlı durumlardan geçirmemeye çalışın.
  • İlerleme çubuklarını, aralık girişlerini ve anahtarları göz ardı etmek: Bu özel UI bileşenleri sıklıkla 1.4.11 dikkate alınmadan stillenir. Bir ilerleme çubuğunun dolu kısmı, rayına karşı 3:1 kontrasta sahip olmalıdır; bir anahtarın düğmesi, anahtarın arka planına karşı; bir aralık girişinin tutamacı, rayına karşı kontrast sağlamalıdır.

Türkiye’nin Erişilebilirlik Mevzuatıyla İlişkisi

Türkiye’nin 2025/10 sayılı Cumhurbaşkanlığı Genelgesi, 21 Haziran 2025 tarihli ve 32933 sayılı Resmî Gazete’de yayımlanarak, Türkiye’de faaliyet gösteren çok geniş bir kamu ve özel sektör yelpazesi için zorunlu web ve mobil erişilebilirlik gereklilikleri getirmiştir. Genelge, WCAG 2.2’yi bağlayıcı teknik standart olarak benimser ve uyum için gerekli eşik Seviye AA’dır.

Seviye AA ölçütü olan WCAG 1.4.11 Metin Dışı Kontrast, bu nedenle Genelge kapsamında doğrudan uygulanabilir durumdadır. Düzenlemeye tabi kuruluşlar, dijital varlıklarındaki tüm UI bileşen sınırlarının, etkileşimli kontrol durumlarının ve anlamlı grafiksel nesnelerin 3:1 metin dışı kontrast gereksinimini karşıladığından emin olmalıdır.

2025/10 sayılı Cumhurbaşkanlığı Genelgesi kapsamındaki kuruluşlar arasında, tüm kademelerdeki kamu kurum ve kuruluşları, e-ticaret platformları, bankalar ve finans kuruluşları, hastaneler ve özel sağlık hizmeti sağlayıcıları, 200.000 veya daha fazla abonesi olan telekomünikasyon işletmecileri, seyahat acenteleri, özel ulaşım şirketleri ve Millî Eğitim Bakanlığı (MoNE) tarafından yetkilendirilmiş özel okullar yer alır. Bu kuruluşlar için 1.4.11’i uygulamamak, yalnızca iyi uygulama eksikliği değil, aynı zamanda düzenleyici bir uyumsuzluk anlamına gelir.

Aile ve Sosyal Hizmetler Bakanlığı tarafından verilen Erişilebilirlik Logosu, uyumlu dijital hizmetler için kamuya açık bir sertifikasyon işareti görevi görür. Bu logoyu almak ve kullanmak için, bir kuruluşun tüm ilgili WCAG 2.2 ölçütlerinde, 1.4.11 dahil, tam Seviye AA uyumunu göstermesi gerekir. Birçok Türk e-devlet portalı, bankacılık arayüzü ve sağlık formu, özel stilli form kontrolleri ve veri görselleştirmelerini yoğun şekilde kullandığından, metin dışı kontrast, denetçilerin sertifikasyon sürecinde özellikle değerlendirmesi muhtemel bir ölçüttür.

Accsible katman (overlay) bileşenini kullanan kuruluşlar, katman teknolojisinin, kullanıcıların yüksek kontrast temasını etkinleştirmesine izin vermek gibi belirli çalışma zamanı kontrast ayarlamalarının iyileştirilmesine yardımcı olabileceğinin, ancak 1.6:1 kenarlık kontrastıyla render edilen bir form girdisi gibi kalıcı yapısal hataların, gerçek uyum sağlamak ve Erişilebilirlik Logosu’na hak kazanmak için kaynak kod düzeyinde düzeltilmesi gerektiğinin farkında olmalıdır. Kaynak düzeyindeki düzeltmeleri, erişilebilirlik bileşeninin kullanıcıya dönük iyileştirme özellikleriyle birleştirmek, Türk hukuku kapsamında en savunulabilir uyum duruşunu temsil eder.