Duyusal Özellikler

Kısaca

"Sağdaki düğmeye basın", "yuvarlak simgeye dokunun", "sinyal sesini duyunca devam edin" gibi talimatlar, ekranı göremeyen veya sesi duyamayan bir kullanıcı için anlamsızdır. Ekran okuyucu "sağ" ya da "yuvarlak" kavramını aktaramaz.

Bu kriter, talimatların yalnızca duyusal özelliklere dayanmamasını ister. Konum veya şekil yine kullanılabilir, ama öğenin adı ya da görünür metni gibi herkesin algılayabileceği bir bilgiyle birlikte verilmelidir.

Neleri kapsar?

• Konum ve yön: "Sağda", "aşağıda", "yan sütunda" gibi ifadeler.
• Şekil ve boyut: "Kare simge", "büyük düğme", "ok işareti" gibi ifadeler.
• Renk: "Yeşil düğme", "kırmızı alan" gibi talimatlar (rengin bilgi taşımak için kullanılması ayrıca Renk Kullanımı kriterinin konusudur).
• Ses: "Bip sesini duyduğunuzda" gibi yalnızca sesle verilen yönlendirmeler.
• Kapsam: Kriter talimatlar ve yönlendirmeler içindir; form yardım metinleri, işlem adımları, eğitim içerikleri ve hata açıklamaları buna dahildir.

Kimleri etkiler?

Kör ve az gören kullanıcılar konum, şekil ve renk bilgisini algılayamaz. Ekranı büyüten kullanıcılar sayfanın yalnızca bir bölümünü gördükleri için "sağda" ifadesini doğru yorumlayamayabilir. Renk körlüğü olan kişiler renge dayalı, işitme engelli kişiler sese dayalı talimatları takip edemez. Ayrıca mobilde düzen değiştiğinde "sağdaki" öğe aşağıya inebilir; bu durum herkes için kafa karıştırıcıdır.

Kontrol listesinde

Bu kriter, Bakanlığın A Seviyesi Kontrol Listesi'nde 49–50 numaralı soruları kapsar. Yönlendirme soruları sayfada ilgili içerik olup olmadığını belirler; yoksa liste sizi sonraki soruya geçirir. Aşağıdaki açıklamalar sorulardan alıntı değil, özetidir. Soruların tam metni için resmî listeye bakın.

Resmî kontrol listesini indirin (PDF), yeni sekmede açılır

Web için kod örnekleri

1. Konuma dayalı talimat

Düğmenin yeri yerine görünür adını kullanın. Konum bilgisini isterseniz ek ipucu olarak bırakabilirsiniz.

<p>Bilgilerinizi kontrol ettikten sonra
sağ alttaki düğmeye basın.</p>
<button type="submit">Başvuruyu Tamamla</button>

<p>Bilgilerinizi kontrol ettikten sonra
"Başvuruyu Tamamla" düğmesine basın.</p>
<button type="submit">Başvuruyu Tamamla</button>

2. Şekle dayalı talimat

Simgenin şekli değil, erişilebilir adı talimatta geçmelidir. Simgenin erişilebilir adı ile talimattaki ad aynı olmalıdır.

<p>Belgeyi kaydetmek için disket şeklindeki
simgeye tıklayın.</p>
<button type="button">
  <svg aria-hidden="true">…</svg>
</button>

<p>Belgeyi kaydetmek için "Kaydet" düğmesini
(disket simgesi) kullanın.</p>
<button type="button" aria-label="Kaydet">
  <svg aria-hidden="true" focusable="false">…</svg>
</button>

3. Renge dayalı talimat

<p>Yeşil renkli alanlar zorunludur.</p>

<p>"(zorunlu)" ile işaretlenmiş alanların
doldurulması gerekir.</p>
<label for="eposta">E-posta adresi (zorunlu)</label>
<input type="email" id="eposta" required>

4. Sayfadaki başka bir bölüme yönlendirme

"Yan sütundaki bilgilere bakın" yerine bölümün başlığını kullanın; mümkünse doğrudan bağlantı verin.

<p>Ücret bilgileri için sağdaki kutuya bakın.</p>

<p>Ücret bilgileri için
<a href="#ucretler">"Ücretler ve Muafiyetler"</a>
bölümüne bakın.</p>
…
<aside>
  <h2 id="ucretler">Ücretler ve Muafiyetler</h2>
  …
</aside>

5. Sese dayalı yönlendirme

Bir işlemin tamamlandığını yalnızca sesle bildirmek yerine görünür ve ekran okuyucunun duyurabileceği bir mesaj da verin.

<p>Belge yüklendiğinde bir uyarı sesi
duyacaksınız, ardından devam edin.</p>

<p>Belge yüklendiğinde bu alanda
"Yükleme tamamlandı" mesajı görünür,
ardından "Devam" düğmesine basın.</p>
<div id="yukleme-durumu" role="status"></div>

<script>
  function yuklemeBitti() {
    document.getElementById("yukleme-durumu")
      .textContent = "Yükleme tamamlandı.";
    new Audio("/ses/bildirim.mp3").play(); // isteğe bağlı ek ipucu
  }
</script>

Mobil için kod örnekleri

Mobilde ekran boyutu ve yönelimi değiştikçe konum bilgisi daha da güvenilmez hâle gelir. Talimatlarda her zaman öğenin görünür ve erişilebilir adını kullanın.

iOS (SwiftUI)

import SwiftUI

struct OnayEkrani: View {
    var body: some View {
        VStack(alignment: .leading, spacing: 16) {
            // Hatalı: "Devam etmek için alttaki mavi düğmeye dokunun."
            Text("Bilgilerinizi kontrol edin, ardından \"Başvuruyu Tamamla\" düğmesine dokunun.")

            Button("Başvuruyu Tamamla") {
                // başvuruyu gönder
            }
            .buttonStyle(.borderedProminent)
        }
        .padding()
    }
}

Android (Jetpack Compose)

import androidx.compose.foundation.layout.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Share
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.unit.dp

@Composable
fun PaylasimTalimati(onPaylas: () -> Unit) {
    Column(verticalArrangement = Arrangement.spacedBy(12.dp)) {
        // Hatalı: "Sağ üstteki üç noktalı simgeye dokunun."
        Text("Belgeyi göndermek için \"Paylaş\" düğmesine dokunun.")

        IconButton(onClick = onPaylas) {
            // contentDescription, talimattaki adla aynıdır.
            Icon(Icons.Filled.Share, contentDescription = "Paylaş")
        }
    }
}

Nasıl test edilir?

• Talimatları listeleyin: Sayfadaki yardım metinlerini, adımları ve hata açıklamalarını tarayın; "sağ", "sol", "üst", "alt", "yanında", "yuvarlak", "büyük", renk adları ve "ses" gibi ifadeleri arayın.
• Ekrana bakmadan deneyin: Talimatı yalnızca ekran okuyucuyla takip edin. Hangi öğenin kastedildiğini bulabiliyor musunuz?
• Adları eşleştirin: Talimatta geçen ad, öğenin görünür metni ve erişilebilir adıyla aynı mı?
• Ekranı büyütün ve daraltın: Sayfayı yakınlaştırın veya mobil görünüme geçin. Konum bildiren talimatlar hâlâ doğru mu?
• Otomatik araçların sınırı: Otomatik araçlar talimat metinlerinin anlamını değerlendiremez; bu kriter tamamen elle kontrol edilir.

Sık yapılan hatalar

• Tasarım diline dayalı yardım metni: "Turuncu kutudaki bilgileri doldurun" gibi metinler tasarım değiştiğinde de yanlış kalır.
• Simge adı ile talimat adının farklı olması: Talimat "Gönder" derken simgenin erişilebilir adı "Uçak" ise kullanıcı düğmeyi bulamaz.
• Eğitim videolarında yalnızca gösterme: "Bu düğmeye basıyoruz" gibi anlatımlar hem bu kriteri hem sesli betimleme gereksinimini etkiler.
• "Yukarıdaki form" demek: Ekran okuyucu kullanıcısı için "yukarı" bir konum değil, okuma sırasında geride kalmış bir içeriktir; bölümün adını kullanın.

Kaynaklar

• Understanding SC 1.3.3: Sensory Characteristics (W3C), İngilizce, yeni sekmede açılır
• Erişilebilirlik blogu — Uygulamadan örnekler ve güncel yazılar.
• Erişilebilirlik sözlüğü — Duyusal özellik, erişilebilir ad, yardımcı teknoloji ve diğer terimler.

Kontrol listesi sürümü: V2.2.30.01 (2026). Bu sayfa bilgilendirme amaçlıdır; bağlayıcı metin için Aile ve Sosyal Hizmetler Bakanlığı'nın resmî kontrol listesini esas alın.