Bir bileşen odak aldığında pencere açma ya da odağı taşıma gibi bir bağlam değişikliği başlatmamasını ister.
Klavye ve ekran okuyucu kullanıcıları, sayfada ne olduğunu öğrenmek için odağı sayfada gezdirir. Bir kontrole gelmek bile pencere açıyor, formu gönderiyor ya da odağı başka yere atıyorsa, sayfayı keşfetmek imkânsız olur ve kullanıcı yerini kaybeder.
Bu kriter, herhangi bir kullanıcı arayüzü bileşeni odak aldığında bir bağlam değişikliği başlatmamasını ister.
Her kontrolün üzerinden odağı geçiren klavye kullanıcıları. Sayfanın tamamını göremeyen ve öngörülebilir davranışa güvenen ekran okuyucu kullanıcıları. Beklenmedik değişikliklerin kafa karışıklığına yol açtığı bilişsel engelli kişiler. Sayfanın yalnızca küçük bir bölümünü gören, büyüteç kullanan az görenler. Yanlışlıkla sekmeyle geçen ya da tıklayan hareket engelli kişiler.
Avrupa Erişilebilirlik Yasası (Direktif (AB) 2019/882) 28 Haziran 2025'ten sonra piyasaya sunulan kapsamdaki ürün ve hizmetler için geçerlidir. Yasanın 47. gerekçesi web siteleri ve mobil uygulamalar için dört ilkeyi sayar: algılanabilirlik, işletilebilirlik, anlaşılabilirlik ve sağlamlık. Odakta öngörülebilir davranış, "anlaşılabilirlik" ilkesinin parçasıdır.
Teknik karşılığı EN 301 549 standardında bulunur. Standart, WCAG 3.2.1'i atıfla alır ve ortama göre ayrı maddelere dönüştürür.
| Madde | Ortam | Ne ister? |
|---|---|---|
| 9.3.2.1 | Web sayfaları | Web içeriğinin WCAG 3.2.1 kriterini karşılamasını ister. |
| 10.3.2.1 | Web dışı dokümanlar (PDF, Office dosyaları) | Standardın kriteri dokümanlara uyguladığı yerlerde, bir bileşen odak aldığında doküman bağlamı değiştirmemelidir. |
| 11.3.2.1 | Web dışı yazılım (yerel mobil uygulamalar) | Yazılım, bir bileşen odak aldığında bağlam değişikliği başlatmamalıdır. |
Kriterin web dışı dokümanlara uygulanıp uygulanmadığı ve nasıl uygulandığı standardın 10. maddesinde belirtilir. Madde numaraları EN 301 549'un "9. + WCAG numarası" düzenine göredir. V3.2.1'de yazılım maddesi, açık ve kapalı işlevsellik için ayrı alt maddelere bölünmüştür. Kaynak gösterirken tam numaraları standarttan kontrol edin.
Standart sürümü: EN 301 549 V4.1.1 (Eylül 2026), WCAG 2.2'yi esas alan ve EAA için hazırlanan ilk sürümdür. Henüz AB Resmî Gazetesi'nde atıf almamıştır; bu nedenle EAA gereksinimlerini karşılamanın gönüllü teknik yolu olarak görülmelidir. Atıf yapıldığında EAA ile ilgili uygunluk karinesi sağlayacaktır. 3.2.1 kriterinin metni WCAG 2.1 ve 2.2'de aynıdır.
EAA bağlamında dikkat: Yasanın Madde 2/4 hükmü bazı içerikleri gereksinimlerin dışında bırakır; örneğin 28 Haziran 2025'ten önce yayımlanmış ofis dosya biçimleri ve bu tarihten sonra güncellenmeyen arşivler. Bu tarihten sonra yayımladığınız ya da değiştirdiğiniz içerik bu istisnaların kapsamında değildir.
Directive (EU) 2019/882, EUR-Lex, İngilizce, yeni sekmede açılır
Odağı yeni bir sayfaya atlayan bir listenin üzerinden geçmek, sayfanın geri kalanını erişilemez yapar. Bunun yerine etkinleştirmede gezinin (G107).
EN<select onfocus="location.href=this.value">…</select><label for="go">Git</label>
<select id="go">…</select>
<button type="button" onclick="location.href=go.value">Git</button>Yeni pencere açmak bir bağlam değişikliğidir. Bunu bir düğmeden açın.
<input onfocus="window.open('/yardim')"><input id="code">
<a href="/yardim" target="_blank" rel="noopener">Kodunuzu bulma yardımı (yeni sekmede açılır)</a>Odağı otomatik olarak sonraki alan gibi başka bir bileşene taşımak, kontrolü kullanıcıdan alır.
first.addEventListener("focus", () => second.focus());<!-- Odağın nereye gideceğine kullanıcı karar versin -->
<input id="first"> <input id="second">Kip penceresi açmak odağı taşır ve sayfayı yeniden düzenler. Tıklamada ya da Enter'da açın.
search.addEventListener("focus", openFullScreenSearch);openSearchBtn.addEventListener("click", openFullScreenSearch);Bir öğe odak aldığında blur() çağırmak sayfayı klavyeyle kullanmayı zorlaştırır ya da imkânsız kılar (F55).
link.addEventListener("focus", () => link.blur());/* Odağı kaldırmayın. Bunun yerine biçimlendirin */
a:focus-visible { outline: 3px solid #0b5fff; outline-offset: 2px; }Bir alan odak aldığında yardımcı metin göstermek, odak taşınmadığı ve hiçbir yere gidilmediği için bağlam değişikliği değil, içerik değişikliğidir.
<input onfocus="location.href='/sonraki'"><label for="pw">Parola</label>
<input id="pw" type="password" aria-describedby="pw-hint">
<p id="pw-hint">En az 12 karakter.</p>Mobilde odak, ekran okuyucu kullanıcısı kaydırdığında ya da klavye kullanıcısı sekmeyle geçtiğinde taşınır. Bir odak geri çağrısından gezinmeyin ya da sayfa açmayın. Kontrolün etkinleştirmesini kullanın.
import SwiftUI
struct HomeView: View {
@State private var showHelp = false
var body: some View {
// Yardım sayfasını etkinleştirme açar; düğmeye yalnızca odaklanmak açmaz
Button("Yardım") { showHelp = true }
.sheet(isPresented: $showHelp) { HelpView() }
// Kaçının: odak değişikliklerine gezinerek ya da sayfa sunarak tepki vermek
// .onChange(of: focusedField) { _, _ in showHelp = true }
}
}import androidx.compose.material3.Button
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
@Composable
fun HelpButton(onOpenHelp: () -> Unit) {
// Yardımı etkinleştirme açar; odak almak açmaz
Button(onClick = onOpenHelp) { Text("Yardım") }
// Kaçının: Modifier.onFocusChanged { if (it.isFocused) onOpenHelp() }
}focus() veya blur() çağıran focus ve onfocus işleyicilerini arayın.blur() çağrısı (F55).Corpowid, dijital erişilebilirlik alanındaki yenilikçi yaklaşımı ve performansı nedeniyle dünyanın önde gelen araştırma ve danışmanlık şirketlerinden biri olan Gartner tarafından takdir edilmiştir. Bu rozetler, yapay zeka destekli ve kapsayıcı web deneyimleri oluşturma konusundaki kararlılığımızı yansıtmaktadır.
