screen-reader-testingyazan Seth Hobson

Screen Reader Testing Skill.

Claude Code ve Codex için tasarım inceleme skill'i: web uygulamalarını VoiceOver, NVDA ve JAWS ekran okuyucularıyla test eder.

Tasarım İncelemesi & Erişilebilirlik
İnceleme raporu

OpenDesign İndir Kullanım kılavuzunu görüntüle

wshobson/agents · plugins/accessibility-compliance/skills/screen-reader-testing/SKILL.mdSKILL.md

--- name: screen-reader-testing description: Test web applications with screen readers including VoiceOver, NVDA, and JAWS. Use when validating screen reader compatibility, debugging accessibility issues, or ensuring assistive technology support. --- ## When to Use This Skill ## Core Concepts ## VoiceOver (macOS) ## VoiceOver Testing Checklist ## NVDA (Windows) ## NVDA Test Script

Üst akış dosyasından 2026-09-14 tarihinde okunan ön bilgi ve bölüm başlıkları · tam metinde 12.020 karakter

01 Ne yapar

Claude Code ve Codex'te screen-reader-testing Skill'i Ne Yapar

Özet, iş akışı ve çıktılar; hepsi skill'in SKILL.md dosyasından okundu.

SKILL.md'den14-09-2026 tarihinde okundu · kayıtlı bir çalıştırma değil

Skill'in Kendi İfadeleriyle

Web uygulamalarını macOS, Windows, iOS ve Android platformlarında VoiceOver, NVDA, JAWS, TalkBack ve Narrator ekran okuyucularıyla test eder. Gerçek ekran okuyucularla yapılan uygulamalı testlerle ekran okuyucu uyumluluğunu doğrular, yardımcı teknoloji sorunlarını giderir ve doğru ARIA uygulamalarını sağlar.

Gezinme, formlar, dinamik içerik duyuruları, odak yönetimi ve modal iletişim kutularını kapsar. Yaygın erişilebilirlik desenleri için platforma özel komutlar, test kontrol listeleri ve kod örnekleri sunar. Farklı ekran okuyucu modlarında (tarama, odak, uygulama) test yapmaya önem verir ve tamamlayıcı bir geliştirme olarak ARIA ile birlikte semantik HTML'yi önceliklendirir.

Neler üretir

Sayfa yükleme, gezinme, bağlantılar, formlar, dinamik içerik ve tabloları kapsayan VoiceOver Test Kontrol Listesi
İlk yükleme, işaret noktaları, başlıklar, formlar, etkileşimli öğeler ve dinamik içerik için adım adım talimatlar içeren NVDA Test Betiği
Etiketsiz düğmeler, duyurulmayan dinamik içerik ve form hataları gibi yaygın sorunlar için erişilebilir kalıpları ve çözümleri gösteren HTML kod örnekleri
Modal iletişim kutuları, odak yakalama ve sekme arayüzü klavye gezinmesi dahil odak yönetimi için JavaScript kodu

Örnek istemi görün ↗

Nasıl Çalışır

01
Platforma Göre Başlıca Ekran Okuyucularla Test Edin
Windows'ta Firefox ile NVDA (%31 kullanım), macOS ve iOS'ta Safari ile VoiceOver (%15 kullanım), Chrome ile JAWS (%40 kullanım), Android'de TalkBack (%10 kullanım) ve Edge ile Narrator (%4 kullanım) kullanın.
02
Ekran Okuyucuya Özgü Komutlarla Gezinin
VoiceOver öğe gezinmesi için VO+Sağ Ok, NVDA başlık atlamaları için H, JAWS bağlantı listeleri için Insert+F7 ve TalkBack kaydırma için iki parmakla kaydırma gibi komutları çalıştırın.
03
Tarama ve Odak Modlarında Test Edin
Ekran okuyucuların, içeriği okumak için tarama modu ile form denetimleriyle etkileşime geçmek için odak modu arasında doğru şekilde geçiş yaptığını, mod duyurularını izleyerek doğrulayın.
04
Semantik Yapıyı ve ARIA'yı Doğrulayın
Başlıkların rotor veya öğe listesi aracılığıyla bulunabilir olduğunu, işaret noktalarının doğru şekilde etiketlendiğini, canlı bölgelerin güncellemeleri duyurduğunu ve dialog, tab ve progressbar gibi rollerin doğru şekilde uygulandığını kontrol edin.
05
Odak Yönetimini ve Klavye Etkileşimini Doğrulayın
Form gönderiminden sonra odağın hatalara taşındığından, modalların odağı doğru şekilde yakaladığından ve kapanışta odağı geri döndürdüğünden, sekme arayüzlerinin ok tuşlarına, Home ve End'e yanıt verdiğinden emin olun.
06
Dinamik İçerik Duyurularını Test Edin
İçerik güncellemelerini tetikleyin ve role="status" ile aria-live="polite"'ın değişiklikleri mevcut konuşmadan sonra duyurduğunu, role="alert"'ın ise anında araya girdiğini doğrulayın.

02 Uyumunuzu bulun

screen-reader-testing Skill Ne Zaman Kullanılır

Bu tür tasarım incelemesi işleri için Claude Code veya Codex'te screen-reader-testing skill'ini kullanın. Uygunluk ve sınırlar skill'in kendi dosyasından alınmıştır.

İyi Uyum

Bir web uygulamasının ekran okuyucu yazılımıyla doğru çalıştığını doğrulama
ARIA rollerinin, durumlarının ve özelliklerinin doğru uygulanıp uygulanmadığını test etme
Yardımcı teknoloji kullanıcılarını etkileyen sorunları giderme
Form denetimlerinin uygun etiketler ve hata duyurularıyla erişilebilir olmasını sağlama
Dinamik içerik güncellemelerinin ekran okuyucu kullanıcılarına duyurulduğunu test etme

Sınırları Bilin

Erişilebilirliği doğrulamak için yalnızca görsel incelemeye güvenme
Hata durumlarını ve uç durumları doğrulamadan yalnızca başarı yollarını test etme
iOS ve Android'de mobil ekran okuyucu testinin atlanması

03 Skill'in içinde

screen-reader-testing Skill'inin Claude Code ve Codex'e Verdiği Kurallar

SKILL.md'nin ajan için belirlediği 8 somut talimat, varsayılan ve sınır — dosyanın sonucu değiştiren kısmı.

Simülatörler Değil, Gerçek Ekran Okuyucularla Test Edin
Simülasyon araçları veya emülatörler yerine daima gerçek ekran okuyucu yazılımlarını (VoiceOver, NVDA, JAWS, TalkBack, Narrator) kullanarak test edin.
Önce Semantik HTML Kullanın, ARIA Tamamlayıcıdır
ARIA özellikleri eklemeden önce arayüzleri yerel HTML elemanlarıyla oluşturun. ARIA, semantik HTML'i geliştirir ama onun yerine geçmez.
Minimum Kapsam: macOS ve iOS'te NVDA+Firefox, VoiceOver+Safari
Uygulamayı doğrulanmış saymadan önce en azından Windows'ta Firefox ile eşleştirilmiş NVDA, macOS'te Safari ile VoiceOver ve iOS'te Safari ile VoiceOver ile test edin.
Hem Gezinme Hem de Odak Modunda Test Edin
Ekran okuyucular bu modlar arasında otomatik veya manuel olarak geçiş yaptığından, deneyimi gezinme modunda (ok tuşlarıyla içerik okumak için) ve odak modunda (kontrollerle etkileşim için) doğrulayın.
Ekran Okuyucu Testinden Önce Sadece Klavyeyle Gezinmeyi Test Edin
Ekran okuyucu erişilebilirliğinin temelini oluşturduğundan ve etkileşim sorunlarını erken yakaladığından, önce sadece klavyeyle test etmeyi tamamlayın.
Tek Sayfalık Uygulamalar için Odak Yönetimini Doğrulayın
Özellikle sayfa geçişlerinin tam yeniden yükleme olmadan gerçekleştiği SPA'larda, içerik dinamik olarak değiştiğinde odağın doğru şekilde yönetildiğinden emin olun.
Asla Tek Bir Ekran Okuyucuyla Test Etmeyin
Tek bir ekran okuyucuyla test etmek yetersizdir. Farklı ekran okuyucular platformlar arasında farklı davranışlara ve kullanım kalıplarına sahiptir.
Dinamik İçeriği ve Hata Durumlarını Her Zaman Test Edin
Dinamik olarak güncellenen içeriğin testini atlamayın veya testi mutlu yola sınırlamayın. Dinamik içerik ve hata yönetimi, erişilebilirlik sorunlarının en yaygın kaynaklarıdır.

04 İşe koyun

screen-reader-testing'i Claude Code veya Codex'e yükleyin

Bir npx skills add komutu, ardından ajanınızda ilk görev ve sonuç için bir kontrol listesi.

screen-reader-testing'i Claude Code, Codex veya Ajanınıza Ekleyin

Projenizde çalıştırın; kurulum aracı, bunun hangi ajana ekleneceğini sorar.

Terminal

npx skills add https://github.com/wshobson/agents --skill screen-reader-testing

plugins/accessibility-compliance/skills/screen-reader-testing/SKILL.md için genel skills CLI biçimi; depo kendi yolunu belgeleyebilir.

Beceriye İlk Tasarım İnceleme Görevi Verin

Skill'in kendi terimleriyle yazıldı; köşeli parantezli bölümleri kendi malzemenizle değiştirin.

Starter prompt

Test the [checkout form] on [staging.example.com] with NVDA and VoiceOver to verify that all field labels are announced, required field indicators are read correctly, validation errors are communicated when the form is submitted with invalid data, and focus moves to the first error. Also confirm that the loading state during payment processing is announced and the success confirmation is read by the screen reader.

Kaynak: SKILL.md'den, skill'in kendi terimleriyle yazıldı.

İlk Sonucu Kontrol Edin

SKILL.md'nin doğru bir sonucun nasıl göründüğüne dair söyledikleri:

Sayfa yüklendiğinde sayfa başlığının duyurulduğunu doğrulayın
Tüm başlıkların rotor (VoiceOver) veya öğe listesi (NVDA, JAWS) kullanılarak keşfedilebilir olduğunu doğrulayın
Etiketlerin, ilişkili giriş alanlarıyla birlikte okunduğunu kontrol edin
Geçersiz verilerle form gönderildiğinde hata mesajlarının duyurulduğundan emin olun
Odağın modal diyaloglar içinde doğru şekilde tutulduğunu ve dışına çıkamadığını doğrulayın

OpenDesign içinde screen-reader-testing'i SKILL.md bağlantısından içe aktarın: Plugins → Add → Skill → Import from link, ardından üst çubuktan seçin.

OpenDesign İndir Hızlı başlangıcı okuyun

05 Açık kaynak, izlenebilir

Kaynak, Lisans ve Doğrulama

Bu sayfadaki bilgilerin nereden geldiği ve en son ne zaman kontrol edildiği.

Author: Seth Hobson
Repository: github.com/wshobson/agents Branch main
Skill dosyası: plugins/accessibility-compliance/skills/screen-reader-testing/SKILL.md İçerik sağlama toplamı doğrulamada kaydedildi; commit 4236bb9
License: MIT LICENSE dosyasından.
Repository yıldızları: 39.635 GitHub anlık görüntüsü 2026-09-14 tarihinde, 18 skill içeren wshobson/agents deposunun tamamı için alındı. screen-reader-testing için bir değerlendirme veya kullanım sayısı değildir.
OpenDesign tarafından doğrulandı: 2026-09-14 Kaynak dosya, yol, lisans metni ve yıldız sayısı kontrol edildi. OpenDesign ana sürümünde dahil değil (2026-08-28 kontrol edildi); bu sayfada canlı bir çalıştırma kaydedilmedi.

SKILL.md içinde

Bu Skill Ne Zaman KullanılırUyumluluğu doğrulama, ARIA'yı test etme, yardımcı teknolojileri hataları ayıklama ve formlar ile gezinmeyi doğrulama gibi senaryoları listeler
Temel KavramlarPlatforma ve kullanıma göre başlıca ekran okuyucuları, minimum test önceliğini ve gezinme (browse) vs. odak (focus) vs. uygulama modlarını kapsar
VoiceOver (macOS)Kurulum talimatları, değiştirici tuşlarla temel komutlar, rotor gezinmesi, test kontrol listesi ve yaygın HTML/ARIA sorun düzeltmeleri
NVDA (Windows)Kurulum ve komutlar, başlık ve landmark gezinmesi, gezinme (browse) ile odak (focus) modu arasında geçiş ve adım adım test senaryosu
JAWS (Windows)Sanal imleç dahil temel komutlar, öğe türleri için hızlı tuşlar, form modu ve tablo gezinme kısayolları
TalkBack (Android)Kurulum anahtarı, gezinme ve etkinleştirme için dokunma hareketleri ve okuma denetimi ayrıntı düzeyi seçenekleri
Yaygın Test SenaryolarıOdak yakalamalı modal iletişim kutuları, canlı bölgeler ve klavye desteğine sahip sekme arayüzleri için kodlu erişilebilir kalıplar
Hata Ayıklama İpuçlarıÖğelerin erişilebilir adını, rolünü, durumunu ve ekran okuyucuların algıladığı şekliyle görünürlüğünü kaydeden JavaScript fonksiyonu
En İyi UygulamalarGerçek testi, semantik HTML önceliğini, mod testini, odak yönetimini ve tek bir ekran okuyucuyla doğrulamadan kaçınmayı kapsayan yapılması ve yapılmaması gerekenler

Skill'in Kendi Açıklaması

"VoiceOver, NVDA ve JAWS gibi ekran okuyucularla web uygulamalarını test edin. Ekran okuyucu uyumluluğunu doğrularken, erişilebilirlik sorunlarını ayıklarken veya yardımcı teknoloji desteğini sağlarken kullanın."

SKILL.md'den ön bilgi açıklaması. Tam dosya yaklaşık 12.020 karakterdir. Tam dosyayı GitHub'da okuyun.

Ekran Okuyucu Testi

screen-reader-testing'i Gerçek Bir Tasarım İnceleme Görevinde Çalıştırın.

OpenDesign'ı indirin, screen-reader-testing'i SKILL.md bağlantısından içe aktarın, yukarıdaki promptu yapıştırın ve sonuçtan önce planı okuyun.

OpenDesign'ı İndirin Tüm skill'lere göz atın

Terminal

npx skills add https://github.com/wshobson/agents --skill screen-reader-testing

Claude Code ve Codex'te screen-reader-testing Skill'i Ne Yapar

Skill'in Kendi İfadeleriyle

Nasıl Çalışır

screen-reader-testing Skill Ne Zaman Kullanılır

İyi Uyum

Sınırları Bilin

screen-reader-testing Skill'inin Claude Code ve Codex'e Verdiği Kurallar

Simülatörler Değil, Gerçek Ekran Okuyucularla Test Edin

Önce Semantik HTML Kullanın, ARIA Tamamlayıcıdır

Minimum Kapsam: macOS ve iOS'te NVDA+Firefox, VoiceOver+Safari

Hem Gezinme Hem de Odak Modunda Test Edin

Ekran Okuyucu Testinden Önce Sadece Klavyeyle Gezinmeyi Test Edin

Tek Sayfalık Uygulamalar için Odak Yönetimini Doğrulayın

Asla Tek Bir Ekran Okuyucuyla Test Etmeyin

Dinamik İçeriği ve Hata Durumlarını Her Zaman Test Edin