Web Erişilebilirliği Nedir? Erişilebilir Web Tasarım Standartları Neden Önemli?

Web erişilebilirliği, sitenizi görme, işitme, hareket ya da bilişsel farklılığı olan herkesin kullanabilmesi demektir. Bu yazıda WCAG 2.2 düzeylerini, Avrupa Erişilebilirlik Yasası'nın ihracat yapan firmalara etkisini, test araçlarını ve sahada en sık gördüğüm hataları anlatıyorum. Hukuki tavsiye vermiyorum; tasarımcı ve danışman olarak gördüğüm tabloyu paylaşıyorum.

Web erişilebilirliği nedir?

Web erişilebilirliği, bir web sitesinin engelli bireyler dahil herkes tarafından algılanabilir, kullanılabilir, anlaşılabilir ve sağlam biçimde tasarlanmasıdır. Ekran okuyucu kullanan, yalnızca klavyeyle gezinen, düşük görme keskinliği olan ya da dikkat güçlüğü yaşayan ziyaretçi, sitenizde aynı işi aynı kolaylıkla bitirebilmelidir.

Bu tanımı dar okumamanızı öneririm. Erişilebilirlik yalnızca kalıcı engellilikle ilgili değildir. Örneğin güneş altında telefondan bakan biri düşük kontrastlı metni okuyamaz. Kolu alçıda olan biri tek elle gezinmek zorundadır. Yaşlanan müşteri kitlesi küçük yazıyı ve küçük düğmeyi zor kullanır. Kısacası erişilebilir tasarım, geçici ve durumsal zorlukları da kapsar.

Ben bu konuyu projelerde bir "ek özellik" olarak değil, kalite ölçütü olarak ele alıyorum. Çünkü erişilebilir bir sayfa, genellikle daha düzenli kodlanmış, daha net yazılmış ve daha kolay kullanılan bir sayfadır.

WCAG nedir ve kim yayımlar?

WCAG (Web Content Accessibility Guidelines), W3C bünyesindeki Web Erişilebilirliği Girişimi (WAI) tarafından yayımlanan uluslararası standarttır. Güncel sürüm WCAG 2.2'dir; ilk kez Ekim 2023'te W3C önerisi oldu ve W3C'nin resmi WCAG 2.2 sayfasında güncel metni okuyabilirsiniz.

Standart dört ilke üzerine kuruludur ve İngilizce baş harfleriyle POUR diye anılır:

• Algılanabilir: Bilgi, ziyaretçinin algılayabileceği bir biçimde sunulmalı; örneğin görsele alternatif metin eklemelisiniz.
• Kullanılabilir: Tüm işlevler klavyeyle çalışmalı ve ziyaretçiye yeterli süre tanımalısınız.
• Anlaşılabilir: Metin ve arayüz davranışı tahmin edilebilir olmalı; hata mesajları ne yapılacağını söylemeli.
• Sağlam: Kod, ekran okuyucu gibi yardımcı teknolojilerle uyumlu çalışmalı.

Her ilkenin altında yönergeler, her yönergenin altında da test edilebilir başarı kriterleri yer alır. Yani WCAG soyut bir niyet beyanı değildir; tek tek kontrol edebileceğiniz maddelerden oluşur. Bu yüzden ekip içinde "erişilebilir mi?" tartışmasını ölçülebilir bir zemine taşır.

A, AA ve AAA düzeyleri arasındaki fark nedir?

WCAG başarı kriterlerini üç uygunluk düzeyine ayırır. A düzeyi en temel gereklilikleri içerir; bunlar karşılanmazsa bazı kullanıcılar siteyi hiç kullanamaz. AA düzeyi, yaygın engelleri kaldıran orta düzeydir. AAA ise en yüksek düzeydir ve her içerik türü için ulaşılabilir olmayabilir.

Pratikte hedef neredeyse her zaman AA düzeyidir. Avrupa'daki uyum standardı EN 301 549 de web içeriği için WCAG AA kriterlerine dayanır. Bu nedenle müşterilerime "AAA'yı tüm sitede hedeflemeyin; AA'yı eksiksiz sağlayın, uygun sayfalarda AAA'ya yaklaşın" diyorum.

WCAG 2.2 ile neler değişti?

WCAG 2.2, önceki sürüm 2.1'in üzerine dokuz yeni başarı kriteri ekledi ve eski 4.1.1 Ayrıştırma (Parsing) kriterini artık geçersiz sayarak kaldırdı. Yeni kriterlerin çoğu mobil kullanım, odak görünürlüğü ve giriş süreçleriyle ilgilidir.

• 2.4.11 Odak Gizlenmemeli (AA): Klavyeyle odaklanan öğe, yapışkan başlık ya da çerez bandı altında tamamen kaybolmamalı.
• 2.5.7 Sürükleme Hareketleri (AA): Sürükleyerek yapılan her işin tek dokunuşla yapılan bir alternatifi olmalı.
• 2.5.8 Hedef Boyutu (AA): Tıklanabilir hedefler en az 24x24 CSS pikseli olmalı ya da yeterli boşlukla ayrılmalı.
• 3.2.6 Tutarlı Yardım (A): Yardım bağlantısı veya iletişim bilgisi sayfalar arasında aynı yerde durmalı.
• 3.3.7 Tekrarlı Giriş (A): Kullanıcıdan aynı süreçte aynı bilgiyi ikinci kez istememelisiniz.
• 3.3.8 Erişilebilir Kimlik Doğrulama (AA): Girişte bulmaca çözme ya da ezber zorunluluğu olmamalı; parola yöneticisine ve yapıştırmaya izin vermelisiniz.

Kalan üç kriter (2.4.12, 2.4.13 ve 3.3.9) AAA düzeyindedir. Özellikle çerez bandı ve sabit menü kullanan sitelerde 2.4.11 kriterine sık takıldığını görüyorum; dolayısıyla tasarım aşamasında odak durumunu mutlaka kontrol edin.

Avrupa Erişilebilirlik Yasası Türk firmalarını neden ilgilendirir?

Avrupa Erişilebilirlik Yasası (European Accessibility Act, AB Direktifi 2019/882), 28 Haziran 2025'ten itibaren uygulanmaya başladı. Direktif; e-ticaret, bankacılık, elektronik iletişim, e-kitap ve ulaşım bilet hizmetleri gibi alanlarda AB pazarındaki tüketicilere sunulan ürün ve hizmetler için erişilebilirlik şartı getiriyor. Metnin tamamına EUR-Lex üzerindeki resmi direktif metninden ulaşabilirsiniz.

Bu yasa Türk firmalarını da ilgilendirir, çünkü belirleyici olan şirketin merkezi değil, hizmetin AB'deki tüketiciye sunulmasıdır. Örneğin Almanya'ya doğrudan satış yapan bir e-ticaret siteniz varsa, üye ülkenin ulusal mevzuatı (Almanya'da BFSG) sizi de kapsayabilir. Direktif, hizmet sunan mikro işletmeleri (10'dan az çalışan ve yıllık cirosu ya da bilanço toplamı 2 milyon avroyu geçmeyen) muaf tutar.

Kapsama girip girmediğiniz sektörünüze, satış modelinize ve hedef ülkeye göre değişir. Bu yüzden kesin değerlendirme için bir hukukçuya danışmanızı öneririm. Benim teknik tavsiyem ise basittir: AB'ye satış yapıyorsanız sitenizi WCAG 2.2 AA'ya göre planlayın. Çok dilli yapınız varsa çok dilli web sitesi SEO rehberimde anlattığım dil yapısını erişilebilirlik kontrolleriyle birlikte ele alın.

Web erişilebilirliği işletmeniz için neden önemli?

Web erişilebilirliği önemlidir, çünkü erişilemeyen bir sitede ziyaretçi satın alamaz, form dolduramaz ve size ulaşamaz. Engelli bireyler, yaşlanan kullanıcılar ve geçici zorluk yaşayanlar küçük bir kitle değildir. Dünya Sağlık Örgütü, dünya nüfusunun yaklaşık 1,3 milyar kişisinin, yani her altı kişiden birinin önemli bir engellilik yaşadığını belirtiyor.

Ticari açıdan tablo nettir. Formda etiketi olmayan bir alan, ekran okuyucu kullanan müşteri için boş bir kutudur. Klavyeyle açılmayan bir menü, fare kullanamayan ziyaretçi için kapalı bir kapıdır. Dolayısıyla erişilebilirlik hatası doğrudan kaçan satış demektir.

Üstelik erişilebilirlik iyileştirmeleri herkesin deneyimini düzeltir. Daha iyi kontrast, daha büyük dokunma hedefleri ve daha açık hata mesajları tüm ziyaretçilerin işini kolaylaştırır. Hemen çıkma sorunu yaşıyorsanız hemen çıkma oranını düşürme yazısındaki kontrollerin bir kısmının erişilebilirlikle örtüştüğünü göreceksiniz.

Web sitelerinde en yaygın erişilebilirlik hataları nelerdir?

En yaygın hatalar şaşırtıcı derecede basittir. WebAIM'in her yıl bir milyon ana sayfayı otomatik taradığı WebAIM Million raporunun 2026 sürümüne göre ana sayfaların yüzde 95,9'unda tespit edilebilir WCAG hatası var ve sayfa başına ortalama 56,1 hata düşüyor.

1. Düşük kontrastlı metin: sayfaların yüzde 83,9'unda.
2. Görsellerde eksik alternatif metin: yüzde 53,1.
3. Etiketsiz form alanları: yüzde 51.
4. Boş bağlantılar (metni olmayan linkler): yüzde 46,3.
5. Boş düğmeler (adı olmayan butonlar): yüzde 30,6.
6. Belge dilinin tanımlanmaması: yüzde 13,5.

Rapor, tespit edilen tüm hataların yüzde 96'sının bu altı kategoriye girdiğini belirtiyor. Yani büyük bir bütçeye gerek kalmadan, bu altı başlığı düzelterek sitenizin durumunu belirgin şekilde iyileştirebilirsiniz. Ancak unutmayın: otomatik tarama hataların yalnızca bir kısmını yakalar.

Renk kontrastını nasıl kontrol edersiniz?

Renk kontrastı, metin rengi ile arka plan rengi arasındaki parlaklık oranıdır. WCAG AA, normal metin için en az 4,5:1, büyük metin için en az 3:1 oran ister. İkon, form kenarlığı ve odak halkası gibi metin dışı öğeler için de 3:1 sınırı vardır.

Sahada en çok gördüğüm sorun, açık gri metin ve marka renginin üzerine beyaz yazıdır. Özellikle turuncu, sarı ve açık yeşil gibi marka renkleri beyaz metinle çoğu zaman 4,5:1 oranını sağlamaz. Bu durumda marka rengini değiştirmek zorunda değilsiniz; rengin koyu bir tonunu metin için ayırabilirsiniz.

Kontrolü birkaç yoldan yaparsınız. Chrome DevTools'da bir metni incelediğinizde renk seçici kontrast oranını gösterir. Renk paletini kurarken HTML renk kodları aracı ile tonları belirleyip ardından oranı ölçebilirsiniz. Ayrıca bilgiyi yalnızca renkle vermeyin: hatalı alanı kırmızı yapmanın yanına mutlaka bir ikon ya da metin ekleyin. Kurumsal renk paletini yeniden ele alıyorsanız bunu marka kimliği çalışmasının içinde çözmek en temiz yoldur.

Klavye erişimi neden bu kadar kritik?

Klavye erişimi kritiktir, çünkü ekran okuyucu kullananlar, motor engelli ziyaretçiler ve pek çok ileri düzey kullanıcı fare yerine klavyeyle gezinir. Sitenizdeki her bağlantı, düğme, menü ve form alanına Tab tuşuyla ulaşılabilmeli, Enter veya boşluk tuşuyla çalışmalıdır.

Basit bir test önereceğim: fareyi bir kenara koyun ve ana sayfanızdan başlayıp iletişim formunu göndermeye çalışın. Test sırasında şu sorulara cevap arayın:

• Odaklanan öğeyi her an görebiliyor musunuz, yoksa odak halkası CSS ile kaldırılmış mı?
• Odak sırası sayfanın görsel sırasını mantıklı biçimde izliyor mu?
• Açılır menüler ve pencereler klavyeyle açılıp Esc ile kapanıyor mu?
• Bir modal açıldığında odak içeride kalıyor ve kapanınca geri dönüyor mu?
• Sayfanın başında "içeriğe atla" bağlantısı var mı?

Bu testi yapan müşterilerimin çoğu ilk beş dakikada en az bir kilitlenme noktası buluyor. Çoğu zaman sorun, tıklanabilir bir div ya da tasarımcının estetik nedenle kaldırdığı odak çizgisidir. Dolayısıyla gerçek düğme ve bağlantı öğelerini kullanmak sorunların büyük kısmını baştan çözer.

Görsellere alternatif metin nasıl yazılır?

Alternatif metin (alt metin), görselin ekran okuyucuya ve görsel yüklenmediğinde tarayıcıya sunduğu metin karşılığıdır. İyi bir alt metin, görselin sayfadaki işlevini kısa ve somut olarak anlatır. Görseli tarif etmekle yetinmez; bağlamdaki anlamını verir.

Ben alt metin yazarken şu kurallara uyuyorum:

• Bilgi taşıyan görselde içeriği yazın: "2025 teklif sürecinin 4 adımını gösteren şema" gibi.
• Bağlantı olarak çalışan görselde gideceği yeri yazın: "Ana sayfa" ya da "Sepete git".
• Süs amaçlı görselde alt değerini boş bırakın (alt=""), böylece ekran okuyucu onu atlar.
• "Resim", "görsel" ya da "fotoğraf" kelimeleriyle başlamayın; ekran okuyucu bunu zaten söyler.
• Anahtar kelime doldurmayın; alt metin SEO kutusu değildir.

Grafik ve infografiklerde kısa alt metin yetmez. Bu durumda verinin özetini görselin yanında metin ya da tablo olarak da vermelisiniz. Ürün görselleri binlerce adetse şablonla başlayıp en çok satan ürünlerden başlayarak elle düzeltmeyi öneririm.

Erişilebilir form nasıl tasarlanır?

Erişilebilir form, her alanın görünür ve programatik olarak bağlı bir etiketi olan, hataları açıkça bildiren ve klavyeyle eksiksiz doldurulabilen formdur. WebAIM verisine göre sayfaların yarısında etiketsiz form alanı var; bu da en çok kaçan dönüşümün formlarda yaşandığını düşündürüyor.

Formlarda en sık düzelttiğim noktalar şunlar:

1. Yer tutucu metni (placeholder) etiket yerine kullanmayın; yazmaya başlayınca kaybolur.
2. Her etiketi label ve for eşleşmesiyle alana bağlayın.
3. Hata mesajını yalnızca kırmızı çerçeveyle değil, alanın yanında metinle verin ve ne yapılacağını söyleyin.
4. Zorunlu alanları metinle belirtin; yalnızca yıldız işaretine güvenmeyin.
5. Ad, e-posta ve telefon alanlarında autocomplete özniteliğini kullanın.
6. Aynı bilgiyi ikinci adımda yeniden istemeyin; WCAG 2.2 bunu artık ayrı bir kriter olarak ele alıyor.

Teklif ve demo formlarının kurgusunu randevu, teklif ve demo formu tasarımı yazısında ayrıntılı anlattım. Erişilebilirlik tarafını bu listeyle birleştirirseniz hem daha çok form alırsınız hem de hatalı form gönderimi azalır.

Başlık yapısı ve semantik HTML neden önemlidir?

Ekran okuyucu kullanan ziyaretçi sayfayı baştan sona dinlemez; başlıklar arasında atlayarak aradığını bulur. Bu yüzden başlık hiyerarşisi, görme engelli kullanıcı için sayfanın içindekiler tablosudur. H1'den sonra H2, H2'nin altında H3 gelmeli; başlık düzeyini yazı boyutu için seçmemelisiniz.

Aynı mantık diğer semantik öğeler için de geçerlidir. Gezinme alanını nav, ana içeriği main, alt bilgiyi footer ile işaretlediğinizde yardımcı teknolojiler sayfanın bölgelerini tanır. Üstelik html etiketine lang özniteliği eklemek, ekran okuyucunun metni doğru dilde ve doğru telaffuzla okumasını sağlar. WebAIM raporunda sayfaların yüzde 13,5'inde bu tek satırın eksik olduğunu hatırlatayım.

Bu yapı SEO ile de örtüşür. Temiz başlık hiyerarşisi ve anlamlı HTML, arama motorlarının içeriği anlamasına da yardım eder. Teknik taraftaki diğer temelleri teknik SEO ipuçları yazısında topladım.

ARIA etiketlerini ne zaman kullanmalısınız?

ARIA, HTML'in yetmediği durumlarda yardımcı teknolojilere ek bilgi veren öznitelikler bütünüdür. Örneğin yalnızca ikondan oluşan bir arama düğmesine aria-label ile "Ara" adını verebilir, açılır menünün açık ya da kapalı olduğunu aria-expanded ile bildirebilirsiniz.

Ancak W3C'nin kendi rehberindeki ilk kural şudur: yerel bir HTML öğesi işi görüyorsa ARIA kullanmayın. Gerçek bir button öğesi klavye desteğini, odağı ve rol bilgisini hazır getirir. Bir div'e role="button" eklediğinizde ise bu davranışların hepsini elle yazmanız gerekir. Hatalı ARIA, hiç ARIA olmamasından daha kötü sonuç verebilir; çünkü ekran okuyucuya yanlış bilgi aktarır.

Kısacası ARIA'yı bir yama malzemesi gibi değil, son çare olarak düşünün. Önce semantik HTML ile çözmeyi deneyin, gerekirse ARIA ekleyin ve ardından sonucu mutlaka bir ekran okuyucuyla dinleyin.

Erişilebilirlik overlay eklentileri sorunu çözer mi?

Kısa cevap: hayır. Overlay eklentileri, siteye tek satır kodla eklenen ve bir erişilebilirlik menüsü sunan araçlardır. Yazı büyütme, kontrast değiştirme gibi düğmeler eklerler ve çoğu zaman "tek tıkla uyum" vaadiyle satılırlar.

Ancak asıl sorunlar kodun içindedir. Etiketsiz form alanını, klavyeyle açılmayan menüyü ya da mantıksız odak sırasını bir üst katman güvenilir biçimde onaramaz. Üstelik ekran okuyucu kullanan pek çok kişi kendi yardımcı teknolojisini zaten ayarlamıştır; overlay bazen bu ayarlarla çakışır. W3C'nin WAI ekibi de otomatik araçların tek başına uygunluğu belirleyemeyeceğini açıkça vurgular.

Bu yüzden overlay bütçesini, gerçek hataları kaynak kodda düzeltmeye ayırmanızı öneririm. Sitenizde overlay varsa kaldırmadan önce altındaki gerçek durumu test edin. Çoğu zaman eklentinin gizlediği değil, hiç dokunmadığı hatalar çıkar.

Web erişilebilirliği nasıl test edilir?

Web erişilebilirliğini üç katmanda test edersiniz: otomatik tarama, elle kontrol ve gerçek kullanıcı testi. Otomatik araçlar hızlıdır ama WCAG kriterlerinin tamamını ölçemez. Örneğin bir alt metnin var olduğunu görür, doğru olup olmadığını anlayamaz.

Başlangıç için Lighthouse raporundaki erişilebilirlik puanı iyi bir ilk bakıştır; nasıl okunacağını Lighthouse ile site testi yazısında anlattım. Ancak 100 puan, sitenin erişilebilir olduğu anlamına gelmez; yalnızca otomatik olarak ölçülen kontrollerden geçtiğini gösterir.

Web erişilebilirliği SEO'yu nasıl etkiler?

Google, erişilebilirliği doğrudan bir sıralama faktörü olarak açıklamış değil. Yine de web erişilebilirliği ile SEO arasında güçlü bir örtüşme var: alt metin görsel aramada bağlam verir, doğru başlık yapısı içeriğin anlaşılmasını kolaylaştırır, anlamlı bağlantı metni hem ekran okuyucuya hem tarayıcıya hedef sayfayı anlatır.

Öte yandan erişilebilirlik iyileştirmeleri kullanıcı davranışını da düzeltir. Okunaklı metin, net düğmeler ve anlaşılır formlar ziyaretçinin sayfada kalmasına ve işini tamamlamasına yardım eder. Mobil kullanımda 24x24 piksellik hedef boyutu gibi kurallar, mobil uyumluluk testinde takıldığınız noktalarla doğrudan ilişkilidir.

Bu nedenle ben erişilebilirliği SEO projelerinin içine de katıyorum. Teknik denetimde başlık hiyerarşisi, alt metin, bağlantı metni ve dil etiketi zaten kontrol listemde. Böylece aynı düzeltme hem arama görünürlüğüne hem kullanıcı deneyimine hizmet ediyor. Bu dengeyi SEO ve UX uyumu yazısında daha geniş ele aldım.

Video ve ses içeriklerinde nelere dikkat etmelisiniz?

Video ve ses içeriği, işitme engelli ziyaretçi için altyazı ya da metin dökümü olmadan erişilemez. WCAG, önceden kaydedilmiş videolarda A düzeyinde altyazı, AA düzeyinde ise görsel bilginin sesli betimlemesini ister. Canlı yayınlar için de AA düzeyinde altyazı beklenir.

Pratikte en sık gördüğüm sorun otomatik oluşturulan altyazılardır. YouTube'un otomatik altyazısı iyi bir başlangıçtır; ancak marka adlarını, teknik terimleri ve rakamları sık sık yanlış yazar. Bu yüzden altyazıyı yayından önce mutlaka gözden geçirin. Ayrıca videonun sesi olmadan da anlaşılır olmasına özen gösterin, çünkü mobilde pek çok kişi videoyu sessiz izler.

• Otomatik oynatılan videoya durdurma düğmesi koyun ve sesi kapalı başlatın.
• Podcast ve sesli içeriğe metin dökümü ekleyin.
• Oynatıcı kontrollerinin klavyeyle çalıştığını test edin.

Videonun dönüşüm üzerindeki rolünü web sitesinde video kullanımı yazısında ele aldım. Erişilebilir video, o yazıdaki kazanımları daha geniş bir kitleye taşır.

Hareket, animasyon ve zaman sınırları neden risklidir?

Hareketli içerik, bazı ziyaretçiler için yalnızca dikkat dağıtıcı değil, fiziksel olarak rahatsız edicidir. Vestibüler bozukluğu olan kişilerde büyük kaydırma efektleri baş dönmesi yapabilir. WCAG, saniyede üç kereden fazla yanıp sönen içeriği nöbet riski nedeniyle A düzeyinde sınırlar.

Otomatik kayan slaytlar ve kendiliğinden ilerleyen banner'lar da sorun yaratır. WCAG, beş saniyeden uzun süren otomatik hareket için durdurma, gizleme ya da duraklatma imkânı ister. Bu nedenle slayt gösterisi kullanıyorsanız görünür bir duraklatma düğmesi ekleyin. Üstelik işletim sistemindeki "hareketi azalt" ayarına saygı gösteren prefers-reduced-motion sorgusunu CSS'e eklemek birkaç satırlık iştir.

Zaman sınırları da aynı kategoriye girer. Ödeme sayfasında ya da uzun bir başvuru formunda oturum süresi dolmak üzereyse, kullanıcıyı önceden uyarmanız ve süreyi uzatma imkânı tanımanız gerekir. Aksi hâlde yavaş yazan ya da yardımcı teknoloji kullanan ziyaretçi, formu bitirmeden verisini kaybeder.

Erişilebilirlik beyanı nedir, siteye eklemeli misiniz?

Erişilebilirlik beyanı, sitenizin hangi standarda göre hazırlandığını, bilinen eksikleri ve ziyaretçinin sorun bildirebileceği iletişim kanalını anlatan bir sayfadır. AB'de kamu siteleri için zorunlu, kapsama giren özel sektör hizmetleri için de beklenen bir uygulamadır. W3C WAI, bu sayfayı hazırlamak için ücretsiz bir oluşturucu sunar.

Beyan sayfasına şu bilgileri koymanızı öneririm:

• Hedeflediğiniz standart ve düzey, örneğin WCAG 2.2 AA.
• Son değerlendirme tarihi ve yöntemi.
• Bilinen sınırlamalar ve planlanan düzeltme süresi.
• Erişim sorunu yaşayan ziyaretçinin ulaşabileceği e-posta ve telefon.

Dürüst bir beyan, "tamamen uyumluyuz" iddiasından daha güven vericidir. Ancak beyanı yazıp unutmayın; her büyük güncellemeden sonra tarihini ve eksik listesini yenileyin. Böylece sayfa, sitenizin gerçek durumunu yansıtmaya devam eder.

Erişilebilirlik hangi aşamada planlanmalı?

En ucuz aşama tasarımın başıdır. Renk paleti, tipografi ölçeği, bileşen kütüphanesi ve form şablonları erişilebilir kurulduğunda, sonraki her sayfa bu tabanı miras alır. Yayından sonra düzeltmek ise aynı işi sayfa sayfa tekrarlamak demektir.

Projelerde erişilebilirliği şu adımlarla sürece yerleştiriyorum:

1. Keşif aşamasında hedef düzeyi (genellikle WCAG 2.2 AA) teklif ve sözleşmeye yazıyorum.
2. Tasarımda renk kontrastını, odak durumlarını ve dokunma hedeflerini bileşen düzeyinde tanımlıyorum.
3. Geliştirmede semantik HTML ve gerçek düğme, bağlantı öğeleri kullanıyorum.
4. Test aşamasında otomatik tarama, klavye testi ve en az bir ekran okuyucu turu yapıyorum.
5. Yayından sonra içerik ekibine alt metin ve başlık kullanımı için kısa bir kılavuz bırakıyorum.

Son madde önemlidir, çünkü erişilebilirliği çoğu zaman tasarım değil, sonradan eklenen içerik bozar. Yeni tasarım fiyatı alırken "erişilebilirlik dahil mi, hangi düzeyde?" diye sormanızı öneririm. Bu soruyu UI/UX hizmeti almadan önce kontrol listesine eklemenizde fayda var.

Mevcut bir siteyi erişilebilir hale getirmek ne kadar sürer?

Süre; sitenin büyüklüğüne, kullanılan temaya ve hataların kaynağına göre değişir. Hataların çoğu ortak bir şablondan geliyorsa (menü, başlık, alt bilgi, form bileşeni), tek bir düzeltme yüzlerce sayfayı birden iyileştirir. Hatalar içerik düzeyindeyse, örneğin binlerce görselde alt metin eksikse, iş uzar.

Saha tecrübeme dayalı başlangıç aralığı şöyle; bu bir garanti değil. Tek şablonlu, 20-30 sayfalık bir kurumsal sitede temel AA düzeltmeleri birkaç hafta içinde tamamlanabiliyor. Özel geliştirilmiş, çok bileşenli bir e-ticaret sitesinde ise aynı iş birkaç aya yayılabiliyor. Ayrıca hazır tema ciddi yapısal sorun içeriyorsa yamalamak yerine yeniden kurmak daha mantıklı olabiliyor.

Ben işe her zaman önceliklendirmeyle başlıyorum: önce ödeme, iletişim ve teklif formu gibi para kazandıran akışlar, sonra şablonlar, en son içerik. Böylece ilk haftalarda bile ölçülebilir bir fark görürsünüz. E-ticaret tarafında bu akışları e-ticaret danışmanlığı kapsamında birlikte ele alıyoruz.

Web erişilebilirliği için nereden başlamalısınız?

Bugün başlamak için büyük bir projeye ihtiyacınız yok. Aşağıdaki kısa sıra, çoğu sitede en yüksek etkiyi en az emekle verir:

• Lighthouse ile ana sayfa, bir ürün ya da hizmet sayfası ve iletişim sayfasını tarayın.
• Fareyi bırakıp bu üç sayfada klavye testi yapın.
• Kontrast hatası veren renkleri koyu tonlarla değiştirin.
• Formlardaki etiketleri ve hata mesajlarını düzeltin.
• html etiketine doğru lang değerini ekleyin.
• İçerik ekibine alt metin kuralını yazılı olarak verin.

Kısacası web erişilebilirliği bir kerelik bir proje değil, sitenin bakımının parçasıdır. Kendi web tasarım projelerimde WCAG 2.2 AA hedefini baştan plana koyuyorum. Mevcut sitenizin durumunu birlikte değerlendirmek isterseniz iletişim sayfasından bana yazabilirsiniz; önce ölçer, sonra önceliklendiririz.