Ekran Okuyucu Nedir ve Nasıl Çalışır?

This is some text inside of a div block.

Ekran Okuyucu Nedir ve Nasıl Çalışır?

## Ekran Okuyucu Nedir? Bilgisayarınızı veya telefonunuzu kullanırken hiç düşündünüz mü görme engelli bir kullanıcının aynı içeriklere nasıl eriştiğini? Bu sorunun cevabı, teknoloji dünyasının en önemli erişilebilirlik araçlarından biri olan ekran okuyucularında saklı. ### Ekran Okuyucu (Screen Reader) Nedir? Ekran okuyucu, dijital içerikleri sesli olarak okuyan yardımcı teknoloji yazılımlarıdır. Bu araçlar, ekrandaki metinleri, butonları, menüleri ve diğer kullanıcı arayüzü öğelerini ses çıkışına dönüştürerek görme engelli veya görme zorluğu yaşayan kullanıcıların dijital platformlara erişimini sağlar. Ekran okuyucular sadece metinleri okumakla kalmaz, aynı zamanda sayfa yapısı, başlık hiyerarşisi, link bilgileri ve form öğeleri hakkında da detaylı bilgi verir. Kullanıcılar genellikle bu araçları oldukça hızlı ayarlarda kullanır - o kadar hızlı ki deneyimsiz kullanıcılar için neredeyse anlaşılmaz gelebilir. ### Temel Kavramlar #### Accessibility Tree (Erişilebilirlik Ağacı) Ekran okuyucuların çalışma mantığının temelinde Accessibility Tree kavramı yatar. Bu, tarayıcıların ekrandaki her UI öğesinin erişilebilirlik parametrelerini ekran okuyucuya ilettiği bir veri yapısıdır. Her buton, metin alanı, dropdown menü ve tab bu ağaç yapısında yer alır. #### Popüler Ekran Okuyucu Yazılımları - **iOS: VoiceOver** - Apple cihazlarında yerleşik olarak gelen ekran okuyucu - **Android: TalkBack** - Google'ın Android işletim sistemi için geliştirdiği çözüm - **Windows: Narrator** - Microsoft'un yerleşik ekran okuyucu yazılımı - **NVDA** - Windows için açık kaynak kodlu alternatif - **JAWS** - Profesyonel düzeyde kullanılan ticari yazılım #### Navigasyon Yöntemleri Ekran okuyucu kullanıcıları özel klavye kısayolları ve komutlarla web sayfalarında gezinir. Başlıklar arası atlama, link listesi görüntüleme ve form öğeleri arasında hızlıca geçiş yapma gibi özellikler kullanılır. ### Neden Önemli? Dijital tasarım ve geliştirme süreçlerinde ekran okuyucu bilgisine sahip olmak artık opsiyonel değil, zorunlu bir yetkinlik haline geldi. Bunun birkaç önemli sebebi var: **Yasal Zorunluluklar**: Birçok ülkede web erişilebilirliği yasal bir gereklilik. WCAG (Web Content Accessibility Guidelines) standartlarına uyum sağlamak hukuki sorumluluklardan korunmanızı sağlar. **Kullanıcı Kitlesi**: Dünya nüfusunun yaklaşık %15'i bir tür engellilik yaşıyor. Bu, göz ardı edilemeyecek büyüklükte bir kullanıcı kitlesini temsil ediyor. **İş Değeri**: Erişilebilir ürünler daha geniş pazarlara ulaşır ve marka değerini artırır. Ayrıca SEO performansını da olumlu etkiler çünkü erişilebilirlik iyileştirmeleri genellikle arama motorları için de faydalıdır. ### Örnekler #### E-ticaret Senaryosu Bir e-ticaret sitesinde ekran okuyucu kullanıcısı şu adımları izler: 1. Sayfa başlığını dinler 2. Ana navigasyon menüsünü keşfeder 3. Arama kutusunu bulur ve kullanır 4. Ürün listesinde başlıklar arası gezinir 5. "Sepete Ekle" butonunu tanımlar ve kullanır Bu süreçte her öğenin doğru etiketlenmesi ve anlamlı açıklamaları kritik öneme sahiptir. #### Haber Sitesi Deneyimi Bir haber sitesinde kullanıcı: - Başlık hiyerarşisini (H1, H2, H3) kullanarak içeriği tarar - Makale özetlerine odaklanır - Kategori linklerini keşfeder - Yorumlar bölümüne geçiş yapar Yanlış tasarlanmış bir sitede kullanıcı bu işlemleri gerçekleştiremez ve siteyi terk eder. ### İpuçları #### Tasarımcılar İçin - **Kontrast Oranları**: Yüksek kontrast oranları hem görme zorluğu yaşayan kullanıcılar hem de ekran okuyucu kullanıcılarının eş zamanlı görsel takibi için önemlidir - **Buton ve Link Tasarımı**: Tıklanabilir öğeler açık ve anlaşılır şekilde tasarlanmalı - **Form Tasarımı**: Her form alanı açık bir etikete sahip olmalı #### UX Designerlar İçin - **Bilgi Hiyerarşisi**: İçerik mantıklı bir sırada organize edilmeli - **Alternatif Metin**: Görseller için anlamlı alt metinler planlanmalı - **Hata Mesajları**: Anlaşılır ve yönlendirici hata mesajları tasarlanmalı #### Geliştirme Ekipleri İçin - **Semantic HTML**: Anlamsal HTML etiketleri kullanın - **ARIA Etiketleri**: Gerektiğinde ARIA (Accessible Rich Internet Applications) etiketleri ekleyin - **Klavye Navigasyonu**: Tüm işlevler klavye ile erişilebilir olmalı #### Test Süreci - Kendi cihazınızda ekran okuyucu açın ve test edin - Gerçek kullanıcılardan geri bildirim alın - Otomatik erişilebilirlik test araçları kullanın - Düzenli erişilebilirlik denetimleri yapın ### Sonuç Ekran okuyucu teknolojisi, dijital dünyanın kapılarını herkese açmanın anahtarıdır. Tasarımcılar, UX uzmanları ve ürün yöneticileri olarak bu teknolojinin nasıl çalıştığını anlamak, sadece etik bir sorumluluk değil, aynı zamanda daha iyi ürünler geliştirmenin de yoludur. Bugün hemen başlayabilirsiniz: telefonunuzda TalkBack'i (Android) veya VoiceOver'ı (iOS) açın, bilgisayarınızda Narrator'ı çalıştırın. İlk deneyimde belki garip gelecek, hatta cihazınızın bozulduğunu düşünebilirsiniz - ki bu tepki ne kadar bu konuya uzak olduğumuzu gösteriyor. Ama birkaç dakika sonra, kullanıcılarınızın dijital deneyimlerini kökten değiştirecek içgörüler kazanacaksınız. Çünkü teknoloji, herkesi kucaklayabildiğinde gerçekten güçlü oluyor.
This is some text inside of a div block.

İlgili Videolar

2
 dk
Tanımlama

Ekran Okuyucu Nedir ve Nasıl Çalışır?

Transkript

Bu kadar konuştuktan sonra hani birçok takı ileriye bırakmadan... ...bir bence şeyi söylemek lazım. Yani bu kadar manuel testledik vs. Bir kulajı nasıl kullanıyor? Yani... Diğer birçok aracı test edebileceğiniz için, yani bir ekran büyütecinin nasıl kullanıldığını test edebileceğiniz için... ...Reduce Motion gibi özellikleri kullanabilmeyi test edebileceğiniz için... ...ben daha farklı olan ekran okuyucu özelinden gitmeye çalıştım aslında. Gitmek istiyorum çünkü bazen ekran okuyucuyu yanlışlıkla telefonda açan insanlar... ...cihazın bozulduğu için tamirciye gidiyorlar. O kadar uzak olduğumuz bir dünya. Bizden sonra da deneyin. Telefonunuzda bilgisayarınızda ayarlar... ...başı altında. Android kullanırsanız TalkBack, iOS'da VoiceOver... ...ve Mac'de. Windows'da Narrator diye bir program var. Ben Windows'da farklı bir yazılım kullanıyorum. Açık aydan kodlu. Onun sebebi de Microsoft'un ekonomi krizinin yeterli olmaması. Aslında. Şimdi sesini bir paylaşacağım sizinle. Bunun üzerinden bir şey yapalım. Şimdi ben hatta... Onunla duymuş olun. Neyse şöyle. İngilizce bir ses bulunuyor. Bence geldi. Duyabiliyor musunuz? Tam bir şey geldi. Kaçırdım. Geldi bir ses. Bir ses dediğin şey bu aynen. Çok hızlı bir ses. Bu aslında İngilizce bir ses. İngilizce bir ses de ben Türkçe okumayı tercih ediyorum. Daha hızlı tepkime dolayı. Bu da çok hızlı olacak. Şimdi diyeceksiniz ki bunu nasıl anlıyorsun? Ben çok hızlı zamanda kullandığım için anlıyorum. Mesela şu an epey yavaşlattım. Bir tane site söyleyin isterseniz. Birlikte bir deneyimleyelim. Ya da ben de bir sayfaya girebilirim ama temelde nasıl kullanıyor bir kullanıcı? İlk başta ben söyleyebilirim. Farklı gönüllü ya şu siteye bakalım diyen varsa onun üzerinden gidebiliriz. Yoksa ben bir site seçeyim. Evet yani katılımcılar aslında kendi sitenizde söyleyebilirsiniz. Nasılmış diye görmek isteyen varsa. Şu an ekranında siteyi mi paylaşmak istiyorsun? Yoksa sunum devam ediyor? Yok direkt şey paylaşacağım. Bir yandan bir siteye geçeceğim. Site üzerinden göstermenin daha farklı olacağını biliyorum. Bir ajet göstereceğim. Sayfaya geldim. Aslında sayfa açıldı benim için. Çok normal bir şekilde. Aslında ekran okuyucunun çalışma mantığını... ...aramızda çok teknik olanlar ve olmayanlar vardı. Temelde aslında ekrandaki UI UI'lerinin... ...belli parametrelerini ekran okuyucuya iletiyor. Parayıcılar. Buna da Accessibility Tree deniyor. Bir tık daha terminolojisine girersek... Aslında bizim ekrana her koyduğumuz UI öğesinin... Bir örneğin tab varın, bir butonun, bir yazı alanının... İşte bir dropdownın...

Aspect Component Library

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sodales leo id commodo ornare.

Aspect Component Library

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sodales leo id commodo ornare.

Aspect Component Library

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sodales leo id commodo ornare.