Skip to main content
Web Tasarım

Erişilebilirlik Testi Rehberi: WCAG 2.2 Standartları ve Test Araçları

Mart 29, 2026 6 dk okuma 3 views Raw
Ayrıca mevcut: en
Web erişilebilirlik testi yapılan bilgisayar ekranı
İçindekiler

Web Erişilebilirlik Testi Nedir ve Neden Önemlidir?

Web erişilebilirlik testi, web sitelerinin ve uygulamaların engelli bireyler dahil tüm kullanıcılar tarafından etkili bir şekilde kullanılabilir olmasını sağlama sürecidir. Dünya Sağlık Örgütü verilerine göre dünya nüfusunun yaklaşık %16'sı bir tür engelle yaşamaktadır. Bu durum, erişilebilirliğin yalnızca etik bir sorumluluk değil, aynı zamanda yasal bir gereklilik ve iş stratejisi olduğunu ortaya koymaktadır.

Türkiye'de 5378 sayılı Engelliler Hakkında Kanun ve Avrupa Birliği'nin European Accessibility Act (EAA) düzenlemesi, dijital erişilebilirliği zorunlu kılmaktadır. 2025 yılından itibaren AB ülkelerinde faaliyet gösteren tüm işletmeler, web sitelerinin erişilebilir olmasını sağlamak zorundadır.

WCAG 2.2 Standartlarını Anlamak

Web Content Accessibility Guidelines (WCAG) 2.2, W3C tarafından yayımlanan en güncel erişilebilirlik standardıdır. Bu standart dört temel ilke üzerine kurulmuştur:

1. Algılanabilirlik (Perceivable)

Bilgi ve kullanıcı arayüzü bileşenleri, kullanıcıların algılayabileceği şekilde sunulmalıdır. Bu ilke kapsamında:

  • Metin dışı içeriklere alternatif metin sağlanmalıdır
  • Zamana bağlı medya için alternatifler sunulmalıdır
  • İçerik farklı şekillerde sunulabilir olmalıdır
  • Kullanıcıların içeriği görmesi ve duyması kolaylaştırılmalıdır

2. Çalıştırılabilirlik (Operable)

Kullanıcı arayüzü bileşenleri ve navigasyon çalıştırılabilir olmalıdır:

  • Tüm işlevsellik klavye ile erişilebilir olmalıdır
  • Kullanıcılara içeriği okumak ve kullanmak için yeterli zaman verilmelidir
  • Nöbet tetikleyebilecek içerik tasarlanmamalıdır
  • Kullanıcıların navigasyon yapması ve içerik bulması kolaylaştırılmalıdır

3. Anlaşılabilirlik (Understandable)

Bilgi ve kullanıcı arayüzünün işleyişi anlaşılabilir olmalıdır:

  • Metin içeriği okunabilir ve anlaşılabilir olmalıdır
  • Web sayfaları öngörülebilir şekilde görünmeli ve çalışmalıdır
  • Kullanıcıların hata yapmasını önleyecek ve düzeltmesine yardımcı olacak mekanizmalar bulunmalıdır

4. Sağlamlık (Robust)

İçerik, yardımcı teknolojiler dahil çeşitli kullanıcı aracıları tarafından güvenilir şekilde yorumlanabilecek kadar sağlam olmalıdır.

WCAG 2.2'deki Yeni Kriterler

WCAG 2.2, önceki sürümlere dokuz yeni başarı kriteri eklemiştir. Bu kriterlerden en önemlileri şunlardır:

KriterSeviyeAçıklama
2.4.11 Focus Not Obscured (Minimum)AAOdaklanan öğe en az kısmen görünür olmalıdır
2.4.12 Focus Not Obscured (Enhanced)AAAOdaklanan öğe tamamen görünür olmalıdır
2.4.13 Focus AppearanceAAAOdak göstergesi yeterli boyut ve kontrasta sahip olmalıdır
2.5.7 Dragging MovementsAASürükleme gerektiren işlevler alternatifle sunulmalıdır
2.5.8 Target Size (Minimum)AAEtkileşimli hedefler en az 24x24 CSS pikseli olmalıdır
3.2.6 Consistent HelpAYardım mekanizmaları tutarlı konumda olmalıdır
3.3.7 Redundant EntryADaha önce girilen bilgiler tekrar istenmemelidir
3.3.8 Accessible Authentication (Minimum)AABilişsel işlev testleri olmadan kimlik doğrulama sağlanmalıdır
3.3.9 Accessible Authentication (Enhanced)AAANesne tanıma bile gerektirmeden kimlik doğrulama sağlanmalıdır

Uyumluluk Seviyeleri: A, AA ve AAA

WCAG üç uyumluluk seviyesi tanımlar:

  1. Seviye A: En temel erişilebilirlik gereksinimleri. Bu seviyeyi karşılamayan siteler birçok kullanıcı için erişilemez durumdadır.
  2. Seviye AA: Çoğu yasal düzenlemenin gerektirdiği standart seviye. İşletmelerin hedeflemesi gereken minimum seviyedir.
  3. Seviye AAA: En yüksek erişilebilirlik seviyesi. Tüm siteye uygulanması genellikle mümkün olmasa da belirli içerikler için hedeflenebilir.

Otomatik Test Araçları

axe DevTools

Deque Systems tarafından geliştirilen axe, en popüler açık kaynaklı erişilebilirlik test aracıdır. Tarayıcı eklentisi olarak çalışır ve sayfadaki erişilebilirlik sorunlarını otomatik olarak tespit eder.

axe'in öne çıkan özellikleri:

  • Sıfır yanlış pozitif oranı hedefleyen doğruluk
  • WCAG 2.0, 2.1 ve 2.2 kurallarını destekleme
  • CI/CD pipeline'larına entegrasyon imkanı
  • Chrome, Firefox ve Edge eklentileri
  • axe-core kütüphanesi ile programatik erişim

Google Lighthouse

Chrome DevTools içinde yerleşik olan Lighthouse, performans, SEO ve erişilebilirlik denetimi yapan kapsamlı bir araçtır. Erişilebilirlik puanlaması 0-100 arasında yapılır ve aşağıdaki kontrolleri içerir:

  • Renk kontrastı yeterliliği
  • Alternatif metin varlığı
  • ARIA özniteliklerinin doğru kullanımı
  • Form etiketleri ve bağlantıları
  • Doküman dili tanımı

WAVE (Web Accessibility Evaluation Tool)

WebAIM tarafından geliştirilen WAVE, sayfa üzerinde görsel simgeler ile erişilebilirlik sorunlarını gösteren ücretsiz bir araçtır. Hataları, uyarıları ve en iyi uygulamaları farklı renk ve simgelerle işaretler.

Pa11y

Pa11y, komut satırı tabanlı bir erişilebilirlik test aracıdır. CI/CD süreçlerine kolay entegre edilir ve otomatik test senaryoları oluşturmak için idealdir:

Otomatik test araçları, erişilebilirlik sorunlarının yalnızca %30-40'ını tespit edebilir. Kapsamlı bir erişilebilirlik değerlendirmesi için mutlaka manuel testler de yapılmalıdır.

Ekran Okuyucu Testi

Ekran okuyucular, görme engelli kullanıcıların web içeriğine erişmek için kullandığı yardımcı teknolojilerdir. En yaygın ekran okuyucular şunlardır:

NVDA (NonVisual Desktop Access)

Windows için ücretsiz ve açık kaynaklı bir ekran okuyucudur. Test için en çok tercih edilen araçlardan biridir. NVDA ile test ederken dikkat edilmesi gerekenler:

  • Sayfa başlıkları ve yapısal öğelerin doğru okunması
  • Form alanlarının etiketlerinin tanınması
  • Dinamik içerik güncellemelerinin duyurulması
  • Tablo verilerinin mantıklı sırada okunması

VoiceOver

Apple cihazlarında yerleşik olarak bulunan VoiceOver, macOS ve iOS'ta test yapmak için kullanılır. Safari ile birlikte en iyi uyumu sağlar.

JAWS (Job Access With Speech)

Ticari bir ekran okuyucu olan JAWS, özellikle kurumsal ortamlarda yaygın olarak kullanılır. Internet Explorer ve Chrome ile en iyi uyumu sağlar.

Klavye Navigasyonu Testi

Klavye erişilebilirliği, motor engelli kullanıcılar ve ekran okuyucu kullanıcıları için kritik öneme sahiptir. Klavye testi sırasında kontrol edilmesi gereken noktalar:

Temel Klavye Etkileşimleri

  • Tab: İleri yönde odak değiştirme
  • Shift + Tab: Geri yönde odak değiştirme
  • Enter/Space: Buton ve bağlantı etkinleştirme
  • Ok tuşları: Menü ve sekmeler arasında gezinme
  • Escape: Modal ve açılır menüleri kapatma

Klavye Tuzakları

Klavye tuzağı, kullanıcının klavye ile bir bileşenden çıkamadığı durumu ifade eder. Bu, erişilebilirliğin en ciddi ihlallerinden biridir. Özellikle şu alanlarda dikkat edilmelidir:

  • Modal pencereler ve diyaloglar
  • Video oynatıcılar
  • Zengin metin editörleri
  • Tarih seçiciler ve özel bileşenler

Odak Yönetimi

Görünür odak göstergesi, klavye kullanıcıları için olmazsa olmazdır. CSS ile odak stillerini özelleştirirken :focus-visible seçicisini kullanarak yalnızca klavye navigasyonunda görünür odak halkaları oluşturabilirsiniz.

ARIA Rolleri ve Öznitelikleri

Accessible Rich Internet Applications (ARIA), HTML öğelerine ek anlamsal bilgi eklemek için kullanılan bir spesifikasyondur. Doğru kullanıldığında erişilebilirliği büyük ölçüde artırır.

Temel ARIA Rolleri

RolKullanım AlanıÖrnek
role="navigation"Navigasyon alanlarıAna menü, breadcrumb
role="main"Ana içerik alanıSayfa ana gövdesi
role="complementary"Tamamlayıcı içerikKenar çubuğu
role="alert"Önemli bildirimlerHata mesajları
role="dialog"Diyalog pencereleriModal pencereler
role="tablist"Sekme gruplarıSekmeli arayüzler

ARIA Durumları ve Özellikleri

  • aria-label: Öğeye erişilebilir bir etiket sağlar
  • aria-labelledby: Başka bir öğeyi etiket olarak referans gösterir
  • aria-describedby: Ek açıklama sağlayan öğeyi referans gösterir
  • aria-expanded: Genişletilebilir bir bileşenin durumunu belirtir
  • aria-hidden: Öğeyi yardımcı teknolojilerden gizler
  • aria-live: Dinamik içerik güncellemelerini duyurur

ARIA'nın birinci kuralı: Yerel HTML öğesi veya özniteliği amacınızı karşılıyorsa ARIA kullanmayın. Örneğin, <button> yerine <div role="button"> kullanmak yanlış bir yaklaşımdır.

Erişilebilirlik Test Stratejisi Oluşturma

Etkili bir erişilebilirlik test stratejisi, otomatik ve manuel testlerin birleşimini gerektirir:

  1. Geliştirme aşamasında: Linter kuralları ve otomatik testler ile erken tespit
  2. Kod incelemesinde: Erişilebilirlik kontrol listesi kullanarak inceleme
  3. QA aşamasında: Kapsamlı manuel testler ve ekran okuyucu testleri
  4. Yayın sonrasında: Düzenli denetimler ve kullanıcı geri bildirimleri
  5. Sürekli: Gerçek engelli kullanıcılarla kullanılabilirlik testleri

Sonuç

Web erişilebilirliği, bir defaya mahsus yapılacak bir görev değil, sürekli bir süreçtir. WCAG 2.2 standartlarına uyum sağlamak, hem yasal gereklilikleri karşılar hem de daha geniş bir kullanıcı kitlesine ulaşmanızı sağlar. Otomatik araçlar ile başlayıp, manuel testler ve gerçek kullanıcı geri bildirimleriyle devam eden kapsamlı bir test stratejisi oluşturarak, herkes için erişilebilir web deneyimleri yaratabilirsiniz.

Bu yazıyı paylaş