Mobil ve Web Uygulamaları / Uygulama rehberi

Modal ve Dialog Erişilebilirliği: Klavye Focus Yönetimi Nasıl Test Edilir?

Web uygulamalarında modal açıldığında focus taşıma, focus trap, Escape davranışı ve kapanışta odağı geri verme senaryolarını klavye ile test edin.

Ganz Dijital · 11 Eylül 2026 · Yaklaşık 4 dk okuma

Problemi doğru sınırlandırın

Web uygulamalarında modal açıldığında focus taşıma, focus trap, Escape davranışı ve kapanışta odağı geri verme senaryolarını klavye ile test edin.

Bu rehberin odak noktası fare kullanmadan dialog akışının eksiksiz çalışması. Örnek senaryo gerçek bir müşteri vakası değil, karar mantığını görünür kılmak için hazırlanmış varsayımsal bir çalışma örneğidir: Sipariş düzenleme modalı görsel olarak doğru; ancak klavye kullanıcısı Tab ile arka sayfadaki butonlara geçebiliyor.

Mobil ve web uygulamalarında gerçek kullanıcı koşulları laboratuvardan daha dağınıktır: zayıf ağ, eski cihaz, birden fazla sekme, arka plan kısıtları ve erişilebilirlik gereksinimleri aynı akışı etkileyebilir.

Karar çerçevesi

Bu durumda temel karar şudur: Focus davranışını CSS ayrıntısı değil fonksiyonel gereksinim olarak kabul edin; açılış, gezinme, kapatma ve geri dönüşün tamamını test senaryosuna yazın. Bu kararın değeri, ekip tarafından aynı şekilde yorumlanabilmesi ve testle kanıtlanabilmesidir. Belirsiz ifadeler yerine gözlenebilir davranış, sorumlu sistem ve hata halinde beklenen sonuç yazılmalıdır.

Test matrisini yalnızca ideal bağlantı ve tek cihazla sınırlamamak, durum bilgisini kullanıcıya görünür kılmak ve geri dönüş senaryolarını ölçmek ürün kalitesini belirgin biçimde yükseltir.

Dört uygulama ve kabul kontrolü

Birinci kontrol “Modal açılınca anlamlı ilk öğeye focus verin” olmalıdır. Bunun için önce mevcut durumdan örnek kayıt veya trafik seçin, beklenen sonucu önceden yazın ve değişiklikten sonra aynı örnekleri yeniden çalıştırın. Kontrolün sahibi ile kanıtın saklanacağı yer belli değilse, test tamamlandı denmemelidir.

İkinci kontrol “Tab/Shift+Tab ile focus'un dialog içinde kaldığını doğrulayın” maddesidir. Bu kontrol yalnızca başarılı senaryoda değil; boş veri, gecikme, tekrar, yetkisiz kullanıcı veya bağlantı sorunu gibi sınır koşullarında da denenmelidir. Böylece sistemin yalnızca demo sırasında değil gerçek operasyon baskısı altında nasıl davrandığı anlaşılır.

Üçüncü kontrol “Escape davranışını ürün kuralına göre belirleyin” olarak tanımlanmıştır. Uygulama ekibi teknik logları izlerken operasyon ekibi aynı olayın kullanıcı veya iş sonucu üzerindeki etkisini görebilmelidir. İki görünüm arasında ilişki kurulması, sorunun kaynağını daha hızlı ayırmaya yardımcı olur.

Yayın öncesinde fare kullanmadan dialog akışının eksiksiz çalışması bağlamında kapanınca focus'u tetikleyen kontrole geri verin için hazırlığı somutlaştırmalısınız. Bu kontrol hangi test verisiyle yapılacak, beklenen davranış nasıl ölçülecek, arızalı sonucun kullanıcıya görüntüsü ne olacak, ve bulunursa veri nasıl düzeltilecek—tüm bunlar yazılı olmalıdır. Sorumlu kişi, kanıt deposu ve geri alma adımları belirlenmek üzere bir form doldurmalısınız.

Örnek kabul kontrolü
#KontrolKanıtZaman
1Modal açılınca anlamlı ilk öğeye focus verinÖrnek veri + beklenen sonuç + sorumluYayın öncesi
2Tab/Shift+Tab ile focus'un dialog içinde kaldığını doğrulayınÖrnek veri + beklenen sonuç + sorumluYayın öncesi
3Escape davranışını ürün kuralına göre belirleyinÖrnek veri + beklenen sonuç + sorumluYayın öncesi
4Kapanınca focus'u tetikleyen kontrole geri verinÖrnek veri + beklenen sonuç + sorumluYayın öncesi

Riskleri yayın öncesinde görünür kılın

Yayından sonra ilk 24 saat kritiktir. Normal durumda beklediğiniz sinyalleri (işlem sayısı, hata oranı, yanıt süresi) önceden yazın; hangi değerler alarm üreteceği ve kim baktığını belirleyin. arka içerikleri ekran okuyucuya açık bırakmak gerçekleşirse geri alma kararını kimin vereceği ve kaç dakika içinde uygulanacağı belli olmalıdır. Ardından kapanınca focus'u tetikleyen kontrole geri verin yeniden çalıştırarak değişikliğin hala güvenli olduğunu kanıtlayın.

Örnek risk ve tepki planı
#RiskKontrol yaklaşımı
1Sadece mouse ile QA yapmakErken sinyal, etki kapsamı ve geri alma adımı
2Focus outline'ı tasarım uğruna kaldırmakErken sinyal, etki kapsamı ve geri alma adımı
3Arka içerikleri ekran okuyucuya açık bırakmakErken sinyal, etki kapsamı ve geri alma adımı

Kabul kriterini operasyonla bağlayın

Dördüncü kontrol “Kapanınca focus'u tetikleyen kontrole geri verin” maddesidir. Bu son adım çoğu projede atlanır; oysa yayın öncesi kabul listesinin bir parçası olduğunda değişikliğin ne zaman gerçekten tamamlandığı netleşir. Kontrol sonuçları tarih, sürüm ve sorumlu ile kaydedilmelidir.

Birincil kaynaklarla teknik çerçeveyi doğrulayın

Risk analizi üç görünür başlıkta tutulabilir. Birincisi “Sadece mouse ile QA yapmak”. Bu risk için erken uyarı sinyali, etkilenebilecek kayıt veya kullanıcı kapsamı ve geri alma adımı yazılmalıdır. İkincisi “Focus outline'ı tasarım uğruna kaldırmak”; bunu yalnızca log hatası olarak değil veri veya müşteri etkisi olarak da ölçün. Üçüncüsü “Arka içerikleri ekran okuyucuya açık bırakmak”; bu risk gerçekleşmese bile test senaryosunda kasıtlı olarak tetiklenerek kontrolün işe yaradığı kanıtlanabilir.

Yayın, gözlem ve geri dönüş planı

Kabul tablosu proje yönetim aracı yerine geçmez; ekiplerin aynı 'bitti' tanımını kullanmasını sağlar. Her kontrol için örnek veri, beklenen sonuç, gözlem noktası ve sorumlu belirlemek; sonradan yaşanan tartışmayı yayın öncesi karara dönüştürür. Eğer bir kontrol otomatikleştirilebiliyorsa regresyon testine eklenmesi, manuel kalıyorsa tekrar çalıştırılabilecek kısa bir runbook'a bağlanması yararlıdır.

Teknik çerçeveyi kontrol ederken bu rehberde MDN — Keyboard accessibility birincil dokümantasyonları referans alınmıştır. Bu kaynaklar kullanılan kavramların ve platform davranışlarının resmi açıklamalarını sağlar; ancak sizin veri modeliniz, sözleşmeleriniz, trafik profiliniz ve güvenlik gereksiniminiz için nihai tasarım kararı değildir. Uygulama öncesinde kullanılan ürün/sürüm dokümantasyonu yeniden kontrol edilmelidir.

Yayın planında üç kapı kullanın: önce yapısal doğrulama, sonra sınırlı gerçek kullanım, son olarak genişletme. İlk kapıda şema, yetki, hata ve veri bütünlüğü test edilir. İkinci kapıda gerçek trafik veya temsil edici kullanıcı grubu üzerinden performans ve davranış izlenir. Üçüncü kapıya yalnızca belirlenen hata bütçesi ve iş metriği sınırları içinde kalındığında geçilir. Bu sıra, değişikliği yavaşlatmak için değil geri bildirim maliyetini düşürmek için vardır.

Sık sorulan sorular

Modal ve Dialog Erişilebilirliği için ilk adım nedir?

Önce problemi teknik çözüm adıyla değil iş etkisiyle sınırlayın. Bu rehberdeki senaryoda başlangıç noktası fare kullanmadan dialog akışının eksiksiz çalışması. Ardından mevcut davranışı ölçün ve ilk kabul kriterini modal açılınca anlamlı ilk öğeye focus verin şeklinde somutlaştırın.

Bu çalışma tek seferde canlıya alınmalı mı?

Genellikle hayır. En güvenli yaklaşım, değişikliği küçük bir kapsamda doğrulayıp gözlem sinyallerini izlemektir. Özellikle “Sadece mouse ile QA yapmak” riski gerçekleştiğinde geri dönüş veya telafi adımının önceden tanımlı olması gerekir.

Mobil ve Web Uygulamaları projesinde başarı nasıl kabul edilir?

Başarı yalnızca ekranın veya endpoint'in çalışması değildir. Tab/Shift+Tab ile focus'un dialog içinde kaldığını doğrulayın ve escape davranışını ürün kuralına göre belirleyin birlikte doğrulanmalı; hata, tekrar ve yetki gibi sınır durumları için de ölçülebilir kanıt üretilmelidir.

Bu akışı kendi sisteminize uyarlayalım.

Mevcut süreci, kullandığınız sistemleri ve çözmek istediğiniz darboğazı paylaşın. Kapsamı, entegrasyon sınırlarını ve kabul kriterlerini birlikte netleştirelim.

İlgili Ganz hizmetini inceleProjenizi konuşalım →

Bu içerikteki senaryo ve kabul örnekleri açıklama amacıyla hazırlanmış varsayımsal örneklerdir; müşteri sonucu, fiyat, sertifikasyon veya performans garantisi değildir. Platform davranışları uygulama tarihinde güncel birincil dokümantasyondan yeniden doğrulanmalıdır.