Erişilebilirlik hataları iki aşamada bulunur: önce otomatik bir tarama aracı sayfayı denetler, sonra klavye ve ekran okuyucu ile elle kontrol yapılır. Otomatik tarama hataların bir bölümünü yakalar; kalanı yalnızca sayfayı fareye hiç dokunmadan kullanmayı denediğinizde ortaya çıkar.
Erişilebilirlik, siteyi görme, duyma, hareket ya da dikkat açısından farklı koşullarda kullanan kişiler için çalışır hale getirmektir. Pratikte işin büyük kısmı küçük düzeltmelerden oluşur: bir düğmeye isim vermek, renk kontrastını artırmak, formdaki alanı etiketiyle eşlemek.
Erişilebilirlik tam olarak neyi ölçer?
Ölçüt dört başlıkta toplanır: içeriğin algılanabilir olması, yani görseldeki bilginin metinle de verilmesi; işletilebilir olması, yani her işlemin klavyeyle yapılabilmesi; anlaşılabilir olması, yani dilin ve hata mesajlarının net olması; ve sağlam olması, yani yardımcı teknolojilerin sayfayı doğru okuyabilmesi. DigiWSS'in teknik denetim hizmetinde bu ölçüm WCAG 2.1 AA seviyesi ve axe-core tabanlı tarama ile yürütülür.
Burada önemli bir nokta var: erişilebilirlik ayrı bir "engelli sürümü" yapmak değildir. Aynı sayfanın daha iyi kurulmuş olmasıdır ve düzeltmelerin çoğu herkesin işine yarar. Etiketli form alanı, klavyeyle gezilebilen menü, yeterli kontrast — bunlar telefonla güneş altında siteye bakan müşteriye de fayda sağlar.
En sık karşılaşılan hatalar
- Görselde alternatif metin yok. Bilgi taşıyan görselin metni olmayınca içerik tamamen kaybolur. Süs amaçlı görselde ise alternatif metin boş bırakılır.
- Düğmenin adı yok. Yalnızca simge taşıyan düğmeler ekran okuyucuda sadece "düğme" olarak okunur; ne yaptığı anlaşılmaz.
- Yetersiz renk kontrastı. Açık gri zemin üzerine açık gri yazı, tasarım tercihi gibi görünse de okunamaz.
- Form alanı etiketsiz. Yer tutucu metin etiket yerine geçmez; yazmaya başlandığında kaybolur.
- Odak göstergesi kaldırılmış. Klavyeyle gezen kullanıcı sayfada nerede olduğunu göremez.
- Başlık hiyerarşisi bozuk. Başlıklar yalnızca görsel büyüklük için seçilmişse sayfanın yapısı okunamaz.
- Bağlantı metni anlamsız. "Buraya tıklayın" bağlantıları bir arada listelendiğinde hiçbir şey ifade etmez.
- Yalnızca renge dayalı bilgi. "Kırmızı alanları doldurun" uyarısı renk ayrımı yapamayan kullanıcı için boşluktur.
Otomatik tarama neyi yakalar, neyi yakalamaz?
Araçlar hızlıdır ve kurallara birebir uyar; ama bir metnin anlamlı olup olmadığına karar veremezler. Bu sınırı bilmek, denetim raporunu doğru okumanın anahtarıdır.
| Konu | Otomatik araç | Elle kontrol |
|---|---|---|
| Eksik alternatif metin | Yakalar | Gerekmez |
| Alternatif metnin anlamlı olması | Yakalamaz | Gerekir |
| Renk kontrast oranı | Yakalar | Gerekmez |
| Klavye sırasının mantıklı olması | Kısmen | Gerekir |
| Başlık etiketlerinin varlığı | Yakalar | Gerekmez |
| Başlıkların içeriği anlatması | Yakalamaz | Gerekir |
| Hata mesajının anlaşılırlığı | Yakalamaz | Gerekir |
Klavye ve ekran okuyucu ile elle kontrol
Elle kontrolün en basit biçimi fareyi bırakmaktır. Sekme tuşuyla sayfayı baştan sona gezin ve şu üç soruyu sorun: her duraksamada odağın nerede olduğu görünüyor mu, sıra sayfanın görsel düzeniyle uyuşuyor mu, her işlem klavyeyle tamamlanabiliyor mu? Menüler, sekmeli alanlar ve açılır pencereler bu testte en çok takılan yerlerdir.
Açılır pencerede iki ek kontrol gerekir: pencere açıldığında odak içine geçmeli ve kapatılana kadar dışına kaçmamalı, kapatıldığında da odak açan düğmeye dönmeli. Ekran okuyucu denemesi için işletim sisteminde hazır gelen okuyucuyu açıp ana sayfayı, bir ürün sayfasını ve iletişim formunu dinlemek, raporun neyi anlattığını kavramak için çoğu zaman yeterlidir.
Form, dokunma alanı ve mobil taraf
Erişilebilirlik hatalarının en pahalı olanları formlarda birikir, çünkü form işletmenin müşteriyle temas noktasıdır. Burada dört şey aranır: her alanın görünür bir etiketi, zorunlu alanların metinle de belirtilmesi, hata mesajının hangi alana ait olduğunu söylemesi ve hata oluştuğunda odağın o alana taşınması. "Lütfen formu kontrol edin" gibi genel bir uyarı, hangi alanın sorunlu olduğunu göstermediği için kullanıcıyı sayfada dolaştırır.
Mobil tarafta ise dokunma alanı boyutu öne çıkar. Yan yana duran küçük simgeler, parmakla kullanıldığında yanlış düğmeye basılmasına yol açar; aralarına boşluk koymak ve dokunulabilir alanı büyütmek çoğu zaman tek düzeltmedir. Metin boyutunun kullanıcı tarafından büyütülebilmesi de aynı başlığa girer: yakınlaştırma kapatılmışsa, metni okuyamayan ziyaretçinin başka bir seçeneği kalmaz.
Düzeltme sırası ve kimin işi
Bütün hatalar aynı değerde değil. Sırayı müşterinin yolunu kesen şeyden başlatmak gerekir.
- Dönüşümü engelleyenler: iletişim formu, sepet, randevu adımı. Burada bir etiket eksikliği doğrudan iş kaybıdır.
- Gezinmeyi engelleyenler: klavyeyle açılmayan menü, kaybolan odak göstergesi, tuzağa düşen odak.
- İçerik erişimini engelleyenler: alternatif metinler, başlık hiyerarşisi, bağlantı metinleri.
- Görsel düzeltmeler: kontrast oranları ve dokunma alanı boyutları.
İş bölümü de netleşir: kontrast, odak göstergesi ve dokunma alanı tasarım tarafının işidir; etiketler, başlık yapısı ve odak yönetimi geliştirme tarafının; alternatif metinler ve bağlantı metinleri içerik tarafının. Mobilde yana kayma gibi düzen hataları da erişilebilirlikle kesişir; ölçümünü yatay taşma yazısında anlattık.
Kısa kontrol listesi
Sekme tuşuyla sayfayı gezin ve odağın göründüğünü doğrulayın. Bilgi taşıyan her görselin metni olsun, süs görselinin metni boş kalsın. Form alanlarını görünür etiketleriyle eşleyin, yer tutucuya güvenmeyin. Simge düğmelerine okunabilir bir ad verin. Başlıkları yapı için, yazı büyüklüklerini biçim için kullanın. Bilgiyi yalnızca renkle vermeyin. Dokunma alanlarını parmakla kullanılabilecek genişlikte tutun ve sayfada yakınlaştırmayı kapatmayın. Otomatik taramayı başlangıç kabul edin, kararı elle kontrolle verin; rapordaki her satırı da düzeltme listesine aynı anda değil öncelik sırasıyla alın. DigiWSS teknik denetim tarafında bu ölçümleri yapıyor ve çıkan listeyi öncelik sırasına koyuyor.