Ekran Okuyucuyla Mobilde Yazmak ve Gezinmek
Ekran okuyucu kullanan biri telefonda metni harf harf duyarak yazar, ekranı da nesne nesne dinleyerek gezer. Gören bir kullanıcının saniyeler içinde bitirdiği iş bu yolla kat kat uzun sürer, üstelik uzamanın sebebi çoğu zaman görme kaybı değil arayüzün yapısıdır. Dokunmatik ekranda referans noktası yoktur; parmağın nerede olduğunu söyleyen tek şey sestir.
Camda yazmak neden zor
Fiziksel klavyede tuşlar parmak altında ayrık durur, F ve J üzerindeki çentikler el konumunu her seferinde sıfırlar. Cam yüzeyde böyle bir işaret yok, yalnızca ekranın kenarları sınır işlevi görüyor. Ekran okuyucu basılan harfi sesli okuduğu için harf düzeyinde doğrulama mümkün, ama imleci kelimenin ortasına götürüp tek harfi düzeltmek kendi başına ayrı bir gezinme işi.
Bu yüzden kullanıcıların önemli bir kısmı düzeltmeyi hiç denemiyor. Araştırma görüşmelerinde sık duyulan cümle şu: “Hata yaptıysam çoğu zaman metnin tamamını silip baştan yazıyorum, düzeltmek daha zahmetli.”
Yaygın giriş yöntemleri
- Dikte: En hızlısı. Metni tek seferde söyleyip bırakmak, harf harf ilerlemekten çok daha az adım. Karşılığında sesteş kelimeler ve noktalama hataları çıkıyor, düzeltme yine aynı zorlukta olduğu için kullanıcılar genelde silip yeniden söylüyor.
- Sesli asistan: Mesaj göndermek, arama yapmak, alarm kurmak gibi işlerde uygulamayı açıp menülerde gezinme adımını tamamen atlatıyor.
- Braille klavye: Fiziksel braille ekran en kontrollü giriş yöntemi, ama pahalı ve taşıması zahmetli. Ekran üstündeki dijital braille klavye iki eli birden ister ve ekranın tamamını kaplar.
Gezinme sıralıdır, bu bir maliyettir
iOS'ta VoiceOver, Android'de TalkBack için temel hareket sağa kaydırmaktır: odak bir sonraki nesneye geçer, ekran okuyucu o nesneyi okur. Sıra görsel yerleşim değil, sayfadaki öğe sırasıdır.
Gözden kaçan şey bunun bedeli. Sağa kaydırma sıralı bir gezinme, yani ekrandaki 40. öğeye ulaşmak 39 kaydırma demek, ve bu bedel her ziyarette yeniden ödeniyor. Menüyü, filtreleri, kampanya şeridini geçmeden ürün listesine varılamayan bir sayfada asıl erişilebilirlik sorunu kontrast ya da alt metin değil, bu sayının kendisi. Başlık hiyerarşisi, landmark yapısı ve rotor benzeri mod menüleri tam olarak bunu kırmak için var: sıralı gezinmeyi rastgele erişime çeviriyorlar.
Kaydırmanın dışındaki hareketler
- Sürükleme: Parmak ekranda gezdirilir, altından geçen nesne okunur. Ekranın düzenini bilen kullanıcılar bunu tercih ediyor.
- Doğrudan dokunma: Öğenin yeri biliniyorsa oraya dokunup çift dokunuşla seçmek en kısa yol.
- Kesintisiz okutma: Uzun içerikte tüm metni baştan sona okutmak, iki parmakla dokunarak durdurmak.
- Mod değiştirme: iOS'taki rotor ve Android'deki okuma kontrolleri, aynı kaydırma hareketine başka anlam yükler; başlıktan başlığa ya da bağlantıdan bağlantıya atlamayı sağlar.
Tasarım tarafında ne değişir
Başlık sırası gerçekten hiyerarşi kursun, h2'den sonra h4 gelmesin. Buton etiketi işlevi söylesin, “daha fazla” demesin. Dokunma hedefleri parmakla ilk denemede tutulacak kadar büyük olsun. Ekrandaki her süs öğesi, sıralı gezinmede bir kaydırma daha demek olduğu için, azaltmak burada doğrudan hız kazancı.
Kodda karşılığı olan kontroller
- Okuma sırası DOM sırasıdır. Görsel sırayı CSS ile değiştirdiyseniz (flex order, grid yerleşimi) ekranda en üstte duran öğe seste en sonda okunabilir. Bunu görmenin en hızlı yolu stil dosyasını devre dışı bırakıp sayfayı yukarıdan aşağı okumak.
- Erişilebilir ad. Yalnızca ikon içeren butonun metni yoksa ekran okuyucu ya “buton” der ya da dosya adını okur. Görsel olarak gizlenmiş metin ya da aria-label ile ad verin.
- Alt metin. Bilgi taşıyan görselin alt metni yazılır, dekoratif olanınki boş bırakılır. Boş bırakmak eksiklik değil, o öğeyi gezinme sırasından çıkarma yoludur.
- Durum bildirimi. “Sepete eklendi” yazısını ekrana basmak yeterli değil; canlı bölge tanımlanmamışsa ekran okuyucu bunu hiç duyurmaz.
Bu dördü otomatik denetim araçlarının bir bölümünü geçer, gerçek cihazda VoiceOver açıp aynı akışı baştan sona denemenin yerini tutmaz (bu adımı atlayan denetimleri yarım sayıyorum).