İçeriğe atla
ÖzelliklerFiyatlandırmaİş OrtaklığıBlogYardımHakkımızdaİletişim
BaşlaGiriş Yap
Bloga Dön
guides2026-10-266 dk okuma

Görme Engelli Müşteri için Sesli Menü Nasıl Yapılır? WCAG 2.2 AA

İstanbul Kadıköy'deki 12 masalı çay bahçesi VoiceOver/TalkBack uyumlu menüyle aylık 240 yeni ziyaretçi kazandı. Semantik HTML, ARIA live ve test rehberi.

th

thMenu Team

thmenu.com

İstanbul Kadıköy'de 12 masalı bir çay bahçesi, ekran okuyucu uyumlu QR menüye geçtikten sonra Türkiye Görme Engelliler Derneği'nin sosyal paylaşımıyla aylık 240 yeni ziyaretçi kazandı. Sesli menü artık "iyi olur" değil, doğrudan ciroya etki eden bir erişilebilirlik yatırımı.

WCAG 2.2 AA Temel Kuralları

VoiceOver (iOS) ve TalkBack (Android) okurken semantik HTML şarttır: ürün başlığı için h3, fiyat için data-label ve aria-describedby ile bağlanmış açıklama. Renk kontrastı en az 4.5:1, dokunma hedefleri minimum 44×44 px, klavye tab sırası mantıklı olmalı.

Allerjen ikonları yalnızca emoji olarak değil, görünmez aria-label="gluten içerir" ile etiketlenmeli. Görsel olmayan kullanıcılar bu sayede ürünü tam anlar.

ARIA Live Regions ile Sepet Geri Bildirimi

Sepete ürün eklendiğinde role="status" veya aria-live="polite" bir bildirim alanı kullanın. "Mercimek çorbası sepete eklendi, toplam 3 ürün" mesajı ekran okuyucu tarafından otomatik seslendirilir. Hata durumlarında role="alert" tercih edilmeli.

thMenu'nun ToastProvider bileşeni varsayılan olarak aria-live="polite" taşır. Alerjen empty state'lerinde "Personele danışın" yedek mesajı, görme engelli kullanıcıların güvenli karar vermesine yardımcı olur.

Test ve Yayın Öncesi Kontrol

iPhone'da Ayarlar → Erişilebilirlik → VoiceOver aktif edin, Android'de TalkBack açın ve menüyü sırayla okutun. Sesli yanıtlar arasında 1 saniyeden uzun boşluk varsa tabindex ve odak yönetimine bakın. Axe DevTools veya WAVE uzantısı kritik ihlalleri 30 saniyede bulur.

Yayına çıkmadan önce gerçek görme engelli bir kullanıcıyla test edin; otomatik araçlar kullanım akışındaki bağlam sorunlarını yakalayamaz.

SSS

QR menüye ayrı bir "sesli versiyon" linki gerekir mi? Hayır, doğru semantik HTML tek sayfada hem görsel hem sesli kullanıcılara hizmet eder.

Otomatik metin-konuşma (TTS) entegre etmeli miyim? İşletim sistemi ekran okuyucuları zaten TTS yapar; kendi TTS'inizi eklemek karışıklık yaratır.

WCAG sertifikası alabilir miyim? Resmi sertifika yok; VPAT veya bağımsız erişilebilirlik denetimi raporu en yakın kanıttır.

Faydalı buldunuz mu? Paylaşın.