Erisilebirlik Hizmeti

Herkes icin erisilebiLir.

WCAG 2.1 AA standartlarina tam uyumlu, Radix UI tabanli, ekran okuyucu destekli, klavye navigasyonlu ve hareket duyarliligi olan arayuzler. Dijital urunleriniz herkese acik olsun.

AA
WCAG 2.1 tam uyumluluk seviyesi
4.5:1
Minimum renk kontrast orani
%16
Dunya nufusunun engelli orani
100%
Klavye ile tam erisim orani

Erisilebirlik neden bu kadar onemli?

Dunya Saglik Orgutu verilerine gore dunya nufusunun %16'si bir engelle yasiyor. Bu, yaklasik 1.3 milyar insan demektir. Dijital urunleriniz erisilebiLir degilse, bu devasa kullanici kitlesini tamamen dislamis olursunuz. Ustelik erisilebirlik sadece kalici engeller icin degil — gecici yaralanmalar, yaslilik veya durumsal kisitlamalar (ornegin tek elle telefon kullanma) da erisilebirlikten faydalanir.

Hukuki acidan da erisilebirlik giderek zorunlu hale geliyor. Avrupa Birligi'nin European Accessibility Act (EAA) 2025'te yururluge girdi. ABD'de ADA davalari her yil artiyor. Turkiye'de de 5378 sayili Engelliler Hakkinda Kanun dijital erisilebirligi kapsiyor. Erisilebirligi ihmal etmek hukuki risk tasir.

Ticari acidan bakarsak, erisilebiLir siteler daha iyi SEO performansi gosterir. Anlamli HTML yapisi, dogru baslik hiyerarsisi ve alt text'ler arama motorlarinin icerigi daha iyi anlamasini saglar. Ayrica erisilebiLir arayuzler tum kullanicilar icin daha iyi bir deneyim sunar — bu da daha yuksek donusum oranlari ve musteri memnuniyeti demektir.

Neler sunuyoruz?

Her detay dusunulmus, her adim planlanmis.

01

WCAG 2.1 AA Tam Uyumluluk

Perceivable, Operable, Understandable ve Robust — WCAG'in dort temel ilkesine tam uyumluluk. Her basari kriterini (success criterion) tek tek degerlendiriyoruz: metin alternatifleri (1.1.1), altyazi destegi (1.2), uyarlanabilir icerik (1.3), ayirt edilebilirlik (1.4), klavye erisimi (2.1), yeterli zaman (2.2), nöbet guvenligi (2.3), navigasyon kolayligi (2.4), okunabilirlik (3.1), tahmin edilebilirlik (3.2), girdi yardimi (3.3) ve uyumluluk (4.1). Her kriter icin test senaryolari olusturuyor ve dogruluyoruz.

02

Radix UI Primitifleri ile Erisilebiir Bilesenler

Radix UI, erisilebirlik icin sifirdan tasarlanmis headless UI primitifleridir. Dialog, Dropdown Menu, Select, Tooltip, Tabs, Accordion, Toggle, Popover ve daha fazlasi — her biri ARIA pattern'lerine tam uyumlu, klavye navigasyonu dahili, focus yonetimi otomatik. Radix UI kullanarak bastan dogru yapilmis erisilebiLir bilesenler olusturuyoruz. Stil esnekligi sayesinde tasariminizdan odun vermeden tam erisilebirlik sagliyoruz.

03

ARIA Rolleri ve Etiketleri

Dogru ARIA (Accessible Rich Internet Applications) kullanimi, yardimci teknolojilerin arayuzunuzu anlamasini saglar. aria-label, aria-labelledby, aria-describedby, aria-live, aria-expanded, aria-hidden, role='alert', role='dialog', role='navigation' gibi ARIA ozelliklerini anlamli ve dogru sekilde uyguluyoruz. Gereksiz ARIA kullanimindan kaciniyoruz — ilk kural: dogal HTML elementi yeterliyse ARIA kullanma.

04

Focus Yonetimi ve Klavye Navigasyonu

Tab sirasi mantikli ve ongorulebilir. Focus gorunur ve belirgin (minimum 2px outline, yuksek kontrastli). Modal acildiginda focus modal icine kilitlenir (focus trap), kapatildiginda tetikleyici elemente geri doner. Skip navigation linkleri sayfa basinda yer alir. Tum etkilesimli elementler Enter ve Space ile calisir. Dropdown menulerde ok tuslari ile navigasyon desteklenir. Custom bilesenler roving tabindex pattern'i kullanir.

05

Renk Kontrasti ve Gorsel Erisilebirlik

Normal metin icin minimum 4.5:1, buyuk metin icin minimum 3:1 kontrast orani. UI bilesenleri ve grafik elementler icin minimum 3:1 kontrast. Renk tek basina bilgi tasimaz — her renk kodlu bilgi yaninda ikon veya metin alternatifi bulunur. Dark mode ve light mode'da kontrast oranlari ayri ayri dogrulanir. Forced colors mode (Windows Yuksek Kontrast) destegi saglanir.

06

Hareket Duyarliligi ve Animasyon Kontrolu

prefers-reduced-motion medya sorgusu ile kullanicinin isletim sistemi tercihine saygi gosteriyoruz. Animasyonlar azaltilir veya tamamen devre disi birakilir. Otomatik oynatilan icerik yoktur — tum hareket kullanici tarafindan tetiklenir. Paralaks efektleri, sonsuz kaydirma ve buyuk olcekli gecis animasyonlari reduced-motion modunda kaldirilir. Vestibular bozukluklari olan kullanicilar icin guvenli bir deneyim sunuyoruz.

07

Otomatik ve Manuel Erisilebirlik Testleri

axe-core entegrasyonu ile CI/CD pipeline'inda otomatik erisilebirlik testleri. Her pull request'te erisilebirlik ihlalleri kontrol edilir. Lighthouse Accessibility skoru izlenir. Ancak otomatik testler tum sorunlarin sadece %30-40'ini yakalar. Bu nedenle NVDA, VoiceOver ve JAWS ekran okuyuculariyla manuel testler gerceklestiriyoruz. Gercek klavye navigasyonu testi, zoom testi (400%'e kadar) ve mobil erisilebirlik testi yapiyoruz.

08

Erisilebirlik Bildirimi ve Dokumantasyon

WCAG 2.1 AA uyumluluk bildirimi (Accessibility Statement) hazirliyoruz. Bildirimde desteklenen standartlar, bilinen kisitlamalar, test metodolojisi ve geri bildirim mekanizmasi yer alir. VPAT (Voluntary Product Accessibility Template) dokumani olusturuyoruz. Gelistirici ekibiniz icin erisilebirlik rehberi ve bilesenler icin erisilebirlik notlari hazirliyoruz. Surdurulebilir erisilebirlik icin ekibinizi egitiyoruz.

Neler dahil?

Teknik Altyapi

  • WCAG 2.1 AA uyumluluk denetimi
  • Radix UI bilesen entegrasyonu
  • ARIA rol ve etiket uygulamasi
  • Focus yonetimi ve tab sirasi
  • Skip navigation linkleri
  • Semantic HTML yapilandirmasi

Gorsel ve Etkilesim

  • Renk kontrasti duzeltmeleri (4.5:1)
  • Focus gostergesi tasarimi
  • prefers-reduced-motion destegi
  • Dark/light mode kontrast dogrulamasi
  • Responsive zoom destegi (400%)
  • Forced colors mode uyumlulugu

Test ve Dokumantasyon

  • axe-core CI/CD entegrasyonu
  • Ekran okuyucu ile manuel test
  • Klavye navigasyon testi
  • Erisilebirlik bildirimi (VPAT)
  • Gelistirici erisilebirlik rehberi
  • Aylik erisilebirlik raporu

Nasil calisiyoruz?

Tipik proje sureci: Ilk 2 hafta kapsamli denetim, 4. haftaya kadar bilesen duzeltmeleri, 6. haftada tam AA uyumluluk ve dokumantasyon.

01

Erisilebirlik Denetimi

Mevcut sitenizi veya uygulamanizi WCAG 2.1 AA kriterlerine gore kapsamli bir sekilde denetliyoruz. axe-core, Lighthouse ve WAVE ile otomatik tarama, NVDA ve VoiceOver ile manuel test. Her sayfa ve bilesen icin ihlal raporu cikariyoruz. Sorunlari kritik, yuksek, orta ve dusuk olarak onceliklendiriyoruz.

02

Strateji ve Yol Haritasi

Denetim sonuclarina dayanarak erisilebirlik yol haritasi olusturuyoruz. Hangi sorunlar once duzeltilecek, hangi bilesenler yeniden yazilacak, hangi alanlar Radix UI ile degistirilecek — her adim net. Zaman cizelgesi, kaynak ihtiyaci ve beklenen uyumluluk seviyeleri belirlenir.

03

Bilesen Gelistirme ve Duzeltme

Erisilebirligi ihlal eden bilesenler Radix UI primitifleri ile yeniden olusturulur veya mevcut bilesenler duzeltilir. ARIA rolleri, klavye navigasyonu, focus yonetimi ve renk kontrasti her bilesende tek tek uygulanir. Her duzeltme birim testleri ile dogrulanir.

04

Ekran Okuyucu ve Klavye Testi

Tum sayfalar ve etkilesim akislari gercek ekran okuyucularla test edilir. NVDA (Windows), VoiceOver (macOS/iOS) ve TalkBack (Android) ile kullanici senaryolari yurutulur. Klavye ile tum sayfa navigasyonu, form doldurma ve etkilesimler dogrulanir.

05

Dokumantasyon ve Egitim

Erisilebirlik bildirimi, VPAT dokumani ve gelistirici rehberi hazirlanir. Ekibinize erisilebirlik egitimi verilir: ARIA kullanimi, bilesen tasarimi, test metodlari. Yeni bilesenlerin erisilebiLir gelistirilmesi icin checklist ve sablonlar sunulur.

06

Surekli Izleme ve Iyilestirme

CI/CD pipeline'ina axe-core entegrasyonu ile her deploy oncesi otomatik erisilebirlik kontrolu. Aylik erisilebirlik raporu: yeni sorunlar, duzeltilen ihlaller, uyumluluk seviyesi. WCAG guncellemeleri ve yeni tarayici/ekran okuyucu surumleri takip edilir. Erisilebirlik surekli bir surectir, biz bu sureci yonetiriz.

Fark nerede?

Megis Erisilebirlik Yaklasimi

  • WCAG 2.1 AA tam uyumluluk, kriter kriter dogrulama
  • Radix UI ile bastan dogru yapilmis bilesenler
  • Otomatik + manuel test (axe-core + ekran okuyucu)
  • Focus yonetimi, skip nav, roving tabindex
  • prefers-reduced-motion ve forced colors destegi
  • Erisilebirlik bildirimi ve ekip egitimi

Geleneksel Yaklasim

  • Sadece Lighthouse skoru kontrolu
  • Custom bilesen, ARIA eksik veya yanlis
  • Sadece otomatik test, manuel dogrulama yok
  • Focus gorunmez, tab sirasi kaotik
  • Animasyonlar kontrol edilemez
  • Dokumantasyon ve egitim yok

Basari hikayeleri

Fintech Uygulamasi — Sifirdan WCAG 2.1 AA Uyumluluk

Sorun: 100.000+ aktif kullanicisi olan fintech uygulamasi hicbir erisilebirlik standardina uymuyordu. Ekran okuyucular formları okuyamiyordu, klavye ile islem yapmak imkansizdi, renk kontrastlari %60 basarisizdi. Yasal uyari almislardi.
Cozum: Tum form bilesenleri Radix UI ile yeniden yazildi. ARIA etiketleri ve roller eklendi. Focus yonetimi sifirdan tasarlandi. Renk paleti 4.5:1 kontrast oranina uygun olarak guncellendi. axe-core CI/CD pipeline'ina entegre edildi. VoiceOver ve NVDA ile 50+ senaryo test edildi.
Sonuc: 8 haftada tam WCAG 2.1 AA uyumluluk saglandi. Lighthouse Accessibility skoru 34'ten 98'e cikti. Yasal risk ortadan kaldirildi. Kullanici memnuniyeti skoru %23 artti — erisilebirlik iyilestirmeleri tum kullanicilara fayda sagladi.

E-Ticaret Platformu — Erisilebiir Alisveris Deneyimi

Sorun: Buyuk e-ticaret platformunda urun filtreleme, sepet islemleri ve odeme akisi klavye ile kullanilamiyordu. Urun gorselleri alt text icermiyordu. Ekran okuyucu kullanicilari alisveris yapamiyordu.
Cozum: Urun listesi, filtreleme, sepet ve odeme bilesenleri Radix UI tabanli erisilebiLir bilesenlerle degistirildi. 2.000+ urun gorseline otomatik ve manuel alt text eklendi. Odeme formlari ARIA live region'larla desteklendi. Focus trap ve skip navigation uygulandı.
Sonuc: Erisilebirligi iyilestirilen odeme akisinda terk orani %18 dustu. Engelli kullanicilarin siparis tamamlama orani %340 artti. Organik trafik %12 yukseldi — SEO iyilestirmeleri dogal bir yan etki oldu.

Sik sorulan sorular

Dijital urunlerinizi herkese acin.

Ucretsiz analiz ve danismanlik icin iletisime gecin. Projenizi birlikte buyutelim.

Ucretsiz Erisilebirlik Taramasi Alin