Bir Ekran Okuyucu ile Web Sitenizi Test Etmeye Nasıl Başlayabilirsiniz?

Yayınlanan: 2022-04-19

Erişilebilir web siteleri oluşturmanın önemi konusunda hiç şüphe yok. Web tasarım topluluğunda sürekli bir tartışma konusu. Ve bence, çoğu tasarımcı bunu doğru yapmak istiyor.

Erişilebilirlik şu veya bu şekilde hepimizi etkiler. Bir blog gönderisinde kullanılan belirli kelimeler veya sayfadan sayfaya gezinme yeteneği olup olmadığı önemlidir.

Ancak ekran okuyucu gibi yardımcı teknolojilere güvenen biri değilseniz, bağlantı kopabilir. Belirli bir özelliğin kullanıcıları nasıl etkilediğini gözden kaçırmak çok kolaydır. Bunun nedeni, bu bağlamda test etmemiş olmamızdır.

Bu alanda mücadele ettiğimi kabul ediyorum. Ve bahse girerim ki, buna sahip başka birçok tasarımcı da vardır. Fareyle gezinen, gören bir kullanıcı olarak ayrıcalığım, her zaman erişilebilirliğin bazı önemli yönlerini düşünmeme yol açmadı.

Doğru, otomatik araçlarla test ediyorum. Yazı tiplerinin okunaklı olduğundan, renk kontrastının WCAG standartlarını karşıladığından ve görüntülerin ALT özniteliğini kullandığından emin olurum. Bunların hepsi iyi şeyler. Yine de, bir web sitesi kullanma deneyimini tam olarak temsil etmezler.

Peki, işleri bir sonraki seviyeye nasıl taşırız? Web sitenizi bir ekran okuyucuyla test etmek, başlamak için harika bir yoldur. Neyin dahil olduğuna yeni başlayanlar için bir göz atalım. Oradan, denemem sırasında bulduklarımı paylaşacağım.

Bir Ekran Okuyucu Uygulaması Bulun

İşlemdeki ilk adım, uygun bir ekran okuyucu uygulaması bulmaktır. Bazı işletim sistemleri varsayılan olarak bir tane içerdiğinden çok uzağa gitmeniz gerekmeyebilir.

Mac kullanıcıları VoiceOver'a erişebilirken, Windows kullanıcıları Ekran Okuyucusu'na dokunabilir. Ek olarak, hemen hemen her işletim sistemi için kullanılabilecek başka seçenekler de vardır. Kendi adıma, açık kaynaklı uygulama NVDA ile gidiyorum. Kullanımı ücretsizdir (bağışlarla desteklenir) ve daha popüler seçenekler arasındadır.

Seçtiğiniz uygulama ne olursa olsun, nasıl çalıştığına dair temel bir anlayışa sahip olmak önemlidir. Ek olarak, önceden birkaç ince ayar yapmanız gerekebilir. Örneğin, okunan şeyi anlayabildiğinizden emin olmak isteyeceksiniz. Yazılımın içeriği okundukça vurgulayarak takip etmeyi kolaylaştırmasını da isteyebilirsiniz.

WebAIM, test amacıyla çeşitli ekran okuyucuları kurmak için bazı kullanışlı kılavuzları bir araya getirdi. Web sitenizin ne kadar erişilebilir olduğunu görmek için sizi iyi bir konuma getirecekler.

NVDA ekran okuyucu yazılımının ana sayfası.

Dolaşmak

Artık hazır bir güvenilir ekran okuyucunuz olduğuna göre, test zamanı! Kullanıcı deneyiminin tadına varmak için, ekran okuyucunun etkin olduğu bir klavye aracılığıyla web sitenizin çeşitli bölümlerinde gezinmeyi deneyin.

Bazı klavye komutları diğerlerinden daha evrenseldir. Örneğin, TAB tuşu sizi çeşitli bağlantılara ve form kontrollerine götürürken ENTER sizi bir bağlantının hedefine götürür. Çoğu, satırdan satıra geçmek için ok tuşlarını kullanıyor gibi görünüyor.

Ancak, bir ekran okuyucu uygulamasına özgü bazı özel komutlar olabilir. Başlıklar, başlıklar ve alt bilgiler gibi yer işaretleri arasında gezinmeye izin verirler. Bunun için belgelerine göz atmak isteyeceksiniz.

Bir web sitesinde bu şekilde etkili bir şekilde gezinmenin pratik gerektirdiğini de belirtmekte fayda var. İlk birkaç deneme biraz garip olabilir. Ancak çeşitli komutları bir kez kavradığınızda, işler daha sezgisel hale gelmelidir.

Ekran okuyucu, yazarın web sitesindeki geçerli satırı vurgular.

Ekran Okuyucu ile Deneyimim

Sadece havayı temizlemek için - Ben uzman bir ekran okuyucu kullanıcısı değilim. Benim bilgim en iyi ihtimalle ilkeldir. Ancak NVDA ile olan deneyimim aydınlatıcı oldu.

Test alanı olarak işletme web sitemin birkaç sayfasını kullandım. Ve bulduğum şey mutlaka büyük kusurlar değildi. Metin okunabilir ve sitede gezinilebilir.

Bunun yerine, bazı rahatsızlıklar keşfettim – kullanıcıları anlaşılır bir şekilde sinirlendirecek şeyler. Birkaç örneği gözden geçirelim:

Kesinti Yapan Bir Kaydırıcı

Erişilebilirlik uzmanı Taylor Arndt ile yaptığı bir röportajda, atlıkarıncalardan/slayt gösterilerinden erişilebilirliğe zarar verebilecek özellikler olarak bahsetti. Bir ekran okuyucu ile test yapmak bunu ön plana çıkarır.

Kullandığım otomatik atlıkarınca gezilebilirdi ancak sonraki slayt her görüntülendiğinde kendini duyurmak gibi kötü bir alışkanlığı vardı. Bu, ekran okuyucunun kesintiye uğramadan önce sayfanın diğer bölümlerine girmesini çok zorlaştırıyordu.

Yeterince basit bir düzeltme buldum. Kullandığım WordPress kaydırıcı eklentisi (Soliloquy), ARIA canlı bölgesini daha az agresif bir ayara değiştirme seçeneğine sahiptir. Bu, atlıkarınca için manuel navigasyon kullanımıyla birleştiğinde sıkıntıdan kurtuldu.

Tekrarlanan Metin

ALT niteliğini resimlerle kullanmak, yaygın bir erişilebilirlik tavsiyesidir. Ancak tamamen dekoratif görüntüler için açıklayıcı metin sağlamak gereksiz olabilir. Birkaç farklı vesileyle bununla karşılaştım.

Blog yazısı listeleri ana suçluydu. Hem gönderi başlığı hem de öne çıkan görsel ALT özellikleri aynıydı, yani ekran okuyucu bunları iki kez okudu. Sonuç, nispeten kısa bir gönderi listesinin bile acı verici bir UX oluşturmasıdır.

Yapışma noktası, kullandığım WordPress gönderi listeleme bloğunun boş ALT öznitelikleri bırakma seçeneği olmamasıdır. Bu nedenle, bir geçici çözüm gerekebilir.

İdeal kullanıcı deneyiminden daha azı için yapılmış bir atlıkarınca ve tekrarlayan ALT metni.

Web Sitesi Erişilebilirliğinin Pratikte Nasıl Çalıştığını Keşfedin

WCAG standartlarına uygun web siteleri oluşturmak tatmin edicidir ve web tasarımcıları olarak yapmamız gereken de budur. Ancak yapılacaklar listesindeki kutuları işaretlemek hikayenin tamamını anlatmaz.

Başkalarının işinizi nasıl deneyimleyeceğini daha iyi anlamak biraz ekstra çaba gerektirir. Bir ekran okuyucuyla test yapmak, daha fazla bilgi edinmek için bir yol sağlar. Ve bu hiçbir şekilde eksiksiz bir rehber olmasa da, umarım ilginizi çekmenize ve denemenize yardımcı olur.

Bulduğum gibi, bir öğe bir standardın harfi ile erişilebilir olarak kabul edilse bile, bu, kullanımının kolay olduğu anlamına gelmez. Bu yüzden biraz daha derine inmekte fayda var. Yalnızca kullanılabilir bir site ile mümkün olan en iyi deneyimi sağlayan site arasındaki fark olabilir.

Not: Yukarıda belirtildiği gibi, bu teknoloji söz konusu olduğunda acemiyim. Paylaşacak ekran okuyucu ipuçlarınız varsa, bana Twitter üzerinden ulaşmaktan çekinmeyin.