Web Erişilebilirliği: Sitenizi Herkes İçin Tasarlamak

Web Erişilebilirliği: Sitenizi Herkes İçin Tasarlamak

Web Erişilebilirliği: Sitenizi Herkes İçin Tasarlamak

Dünya nüfusunun yaklaşık yüzde on beşi bir tür engellilik ya da kısıtlılıkla yaşıyor. Görme güçlüğü, işitme kaybı, motor kısıtlamalar, bilişsel farklılıklar — bu kullanıcılar erişilemez web sitelerinde ciddi zorluklarla karşılaşıyor. Erişilebilirlik yalnızca etik bir sorumluluk değil; giderek yasal bir zorunluluk ve akıllı bir iş kararı haline geliyor.

WCAG Nedir?

WCAG (Web Content Accessibility Guidelines — Web İçeriği Erişilebilirlik Kılavuzu), W3C tarafından yayımlanan ve web erişilebilirliğinin uluslararası standardını oluşturan kılavuz belgedir. Üç uyumluluk seviyesi var: A (minimum), AA (önerilen) ve AAA (ileri düzey). Çoğu yasal düzenleme ve kurumsal politika AA seviyesini referans alıyor.

WCAG'ın dört temel ilkesi var: Algılanabilir, İşletilebilir, Anlaşılabilir ve Sağlam. Bu dört ilke İngilizce baş harfleriyle POUR olarak anılıyor ve erişilebilirlik değerlendirmesinin çerçevesini oluşturuyor.

Görme Engelli Kullanıcılar İçin Tasarım

Ekran okuyucular (screen reader), sayfadaki içeriği sesli olarak okuyan yardımcı teknolojilerdir. Bu araçlar görsel düzeni göremez; sayfanın HTML yapısına, başlık hiyerarşisine ve alternatif metinlere dayanır.

Alt metin her görselin ne olduğunu ekran okuyucuya anlatır. "img_1234.jpg" hiçbir anlam taşımaz. "Kırmızı çizgili beyaz bir kahve fincanı, masanın üzerinde" taşır. Dekoratif görseller için boş alt metin — alt="" — kullanmak ekran okuyucunun o görseli atlamasını sağlar.

Başlık hiyerarşisi sayfanın iskeletini oluşturur. H1 → H2 → H3 sırasına uymak ekran okuyucu kullanıcılarının sayfada hızlıca gezinmesini sağlar. Başlık etiketlerini stil amacıyla (büyük ve kalın görünsün diye) kullanmak bu hiyerarşiyi bozar.

Renk kontrastı yalnızca görme engelliler için değil, güneş altında ekrana bakan ya da yaşlı olan herkes için önemli. WCAG AA standardı metin ile arka plan arasında en az 4,5:1 kontrast oranı gerektiriyor.

Motor Kısıtlamaları Olan Kullanıcılar İçin Tasarım

Pek çok kullanıcı fareyi kullanamiyor; klavye veya alternatif giriş cihazlarıyla geziniyor. Sitenizin tüm etkileşimli öğeleri klavyeyle erişilebilir olmalı.

Tab tuşuyla sayfanızda gezinerek test edin. Hangi öğe odaklanılmış? Bunu görebiliyor musunuz? Odak göstergesi (focus indicator) genellikle CSS ile gizleniyor — estetik kaygıyla yapılan bu tercih klavye kullanıcılarını işlevsiz bırakıyor. Odak göstergesini kaldırmak yerine daha şık hale getirin.

Tıklanabilir alanların yeterince büyük olması da kritik. WCAG 2.5.8 standardı minimum 24x24 piksel önerirken pratik uygulama olarak 44x44 piksel çok daha konforlu bir hedef boyutu. Mobil cihazlarda küçük butonlar motor kısıtlaması olmayan kullanıcılar için de sorun oluşturuyor.

İşitme Engelli Kullanıcılar İçin Tasarım

Video içeriklerinizde altyazı (subtitle veya closed caption) zorunlu. Otomatik altyazı araçları hata içerebilir; özellikle teknik veya kurumsal içeriklerde manuel düzenleme şart. Ses içeriği için transkript sunmak hem erişilebilirliği artırıyor hem de SEO'ya katkı sağlıyor.

Ses çıkışı olmadan da anlaşılabilen tasarım, herhangi bir bilgiyi yalnızca sesle aktarmaktan kaçınmak anlamına geliyor. Form doğrulama hatalarını yalnızca sesli bildirimle değil görsel olarak da gösterin.

Bilişsel Erişilebilirlik

Dikkat eksikliği, disleksi veya hafıza sorunları olan kullanıcılar için sade dil, net yapı ve öngörülebilir navigasyon hayati önem taşıyor. Karmaşık cümleler, jargon dolu metinler ve tutarsız arayüz desenleri bu kullanıcı gruplarını dışlıyor.

Animasyonlar ve hareket eden içerikler bazı kullanıcılarda sağlık sorunlarını tetikleyebilir. CSS'in prefers-reduced-motion medya sorgusu, kullanıcının işletim sistemindeki animasyon azaltma tercihini algılayarak animasyonları otomatik devre dışı bırakmanızı sağlıyor.

Erişilebilirliği Test Etmek

Otomatik araçlar erişilebilirlik sorunlarının yaklaşık yüzde otuzunu tespit edebiliyor. Geri kalan yüzde yetmişi için manuel test şart.

axe DevTools tarayıcı eklentisi sayfayı tarayarak WCAG ihlallerini listeler ve nasıl düzeltileceğini açıklar. WAVE benzer işlevi görsel katmanla sunar. Lighthouse'un Erişilebilirlik sekmesi genel bir skor verir.

Gerçek kullanıcı testleri en değerli veri kaynağı. Ekran okuyucu kullanan biriyle birlikte sitenizi ziyaret etmek, otomasyon araçlarının yakalayamayacağı pek çok sorunu anında görünür kılıyor.

Erişilebilirlik SEO'yu da Güçlendiriyor

Erişilebilirlik uygulamalarının büyük bölümü SEO uygulamalarıyla örtüşüyor. Anlamlı alt metinler, temiz başlık hiyerarşisi, iyi yapılandırılmış HTML ve hızlı yükleme süreleri hem ekran okuyuculara hem de arama motoru botlarına hitap ediyor. Erişilebilir site yapmak SEO'ya yatırım yapmakla eş zamanlı ilerleyebilir.