WCAG 2.5.3 · A Seviyesi

İsimlerin Kullanılan Etiketi İçermesi

Görünür bir metin etiketi olan arayüz bileşenlerinde erişilebilir adın bu görünür metni içermesini, tercihen onunla başlamasını ister.

Kısaca

Ses komutuyla bilgisayar kullanan biri, ekranda "Gönder" yazan düğmeyi çalıştırmak için "Gönder'e tıkla" der. Düğmenin erişilebilir adı kodda "Formu ilet" olarak tanımlanmışsa, yazılım bu düğmeyi bulamaz. Ekran okuyucu kullanan ama ekranı kısmen gören biri de duyduğu adla gördüğü metin arasındaki farktan kafası karışır.

Bu kriter, görünür metin etiketi olan bileşenlerde erişilebilir adın bu metni içermesini ister. İyi uygulama, erişilebilir adın görünür metinle aynı olması ya da onunla başlamasıdır. En kolay çözüm çoğu zaman aria-label eklememek ve görünür metnin ad olarak kullanılmasına izin vermektir.

Neleri kapsar?

  • Düğmeler ve bağlantılar: Görünür metni olan düğme ve bağlantıların erişilebilir adı.
  • Form alanları: Görünür etiketi olan alanlarda aria-label veya aria-labelledby ile verilen adın etiketle uyumu.
  • Metin içeren görseller: Üzerinde yazı bulunan düğme görsellerinde metin alternatifinin bu yazıyı içermesi.
  • Ek bilgi: Erişilebilir ada ek bilgi eklenebilir; ancak görünür metin adın başında kalmalıdır.
  • Kapsam dışı notlar: Görünür etiketi olmayan simge düğmeler bu kriterin değil, Metinsel Olmayan İçerik ve İsim, Rol, Değer kriterlerinin konusudur.

Kimleri etkiler?

Ses komutu yazılımı kullanan motor engelli kişiler, bileşenleri ekranda gördükleri adla çağırır; adlar eşleşmezse komut çalışmaz. Ekran okuyucuyu görme kalıntısıyla birlikte kullanan az gören kullanıcılar ve öğrenme güçlüğü olan kişiler, duyulan adla görülen metin aynı olduğunda arayüzü daha kolay takip eder. Metin okuma yazılımı kullanan disleksili kullanıcılar da tutarlılıktan yararlanır.

Kontrol listesinde

Bu kriter, Bakanlığın A Seviyesi Kontrol Listesi'nde 99–100 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.

BK 22 kapsamındaki sorular
SoruTürüNe kontrol eder?
99YönlendirmeSayfada kullanıcıya görünür bir metin etiketiyle sunulan bileşen (düğme, bağlantı, form alanı, menü öğesi vb.) olup olmadığını sorar.
100★ ZorunluBu bileşenlerin erişilebilir adının görünür etiketle aynı olup olmadığını ya da görünür etiket metniyle başlayıp başlamadığını kontrol eder.

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

Web için kod örnekleri

1. Görünür metinle çelişen aria-label

aria-label, görünür metnin yerine geçer. Görünür metinden farklıysa ses komutu kullanıcısı düğmeyi çağıramaz.

Hatalı
Doğru

2. Ek bağlam gerektiğinde

Bir bağlantıya bağlam eklemek istiyorsanız görünür metni adın başında tutun.

3. Form alanı etiketi

Görünür etiketi olan bir alana farklı bir aria-label vermek, görünür etiketin ad olarak kullanılmasını engeller.

Hatalı

Doğru


Başında 0 olmadan, 10 hane

Ek açıklamalar için aria-describedby kullanmak, adı değiştirmeden bilgiyi iletir.

4. Simge ve metin içeren düğme

Düğmede hem simge hem metin varsa simgeyi gizleyin; görünür metin ad olarak kullanılsın.

Hatalı
Doğru

5. Metin içeren görsel düğme

Üzerinde "Başvur" yazan bir görsel düğmede metin alternatifi bu yazıyla başlamalıdır.

Hatalı
Doğru

Mobil için kod örnekleri

Mobil platformlarda da standart düğmeler görünür metni erişilebilir ad olarak kullanır. Sorun genellikle görünür metni olan bir bileşene farklı bir erişilebilirlik etiketi verildiğinde ortaya çıkar.

iOS (SwiftUI)

import SwiftUI

struct AramaCubugu: View {
    @State private var sorgu = ""

    var body: some View {
        HStack {
            TextField("Hizmet ara", text: $sorgu)

            // Hatalı: görünür metin "Ara", VoiceOver ve Ses Denetimi "Sorgula" kullanır
            // Button("Ara") { ara() }.accessibilityLabel("Sorgula")

            // Doğru: görünür metin ad olarak kullanılır
            Button("Ara") { ara() }

            // Ek bilgi gerekiyorsa ipucu kullanılır; ad değişmez
            Button("Filtrele") { filtrele() }
                .accessibilityHint("Sonuçları ilçeye göre daraltır")
        }
    }

    private func ara() { }
    private func filtrele() { }
}

Android (Jetpack Compose)

import androidx.compose.foundation.layout.Row
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.semantics

@Composable
fun AramaDugmeleri(ara: () -> Unit) {
    Row {
        // Hatalı: görünür metin "Ara", erişilebilir ad "Sorgula"
        // Button(onClick = ara, modifier = Modifier.semantics { contentDescription = "Sorgula" }) {
        //     Text("Ara")
        // }

        // Doğru: Text içeriği erişilebilir ad olur
        Button(onClick = ara) { Text("Ara") }
    }
}

Nasıl test edilir?

  • Erişilebilir adı inceleyin: Tarayıcı geliştirici araçlarının erişilebilirlik panelinde her düğme, bağlantı ve form alanının hesaplanan adını görünür metinle karşılaştırın.
  • Ses komutuyla deneyin: Windows Sesli Erişim, macOS veya iOS Ses Denetimi ya da Android Voice Access ile bileşenleri görünür adlarıyla çağırın. Komut çalışıyor mu?
  • Ekran okuyucuyla dinleyin: Okunan ad, ekranda görünen metinle başlıyor mu?
  • Otomatik araçların sınırı: Bazı otomatik araçlar görünür metin ile aria-label değerinin uyuşmadığı düğme ve bağlantıları işaretleyebilir. Ancak görsel içindeki yazıları, CSS ile eklenen metinleri ve mobil uygulamaları güvenilir biçimde değerlendiremez; elle kontrol gerekir.

Sık yapılan hatalar

  • Her düğmeye aria-label eklemek: Görünür metni olan düğmelere alışkanlıkla aria-label eklemek çoğu zaman bu kriteri bozar.
  • Çeviri farkları: Görünür metin Türkçe, aria-label İngilizce kalmış bileşenler.
  • Ek bilgiyi başa koymak: "Su kesintisi duyurusu, devamı" gibi, görünür metni adın sonuna iten etiketler.
  • Simgenin adını kullanmak: Görünür metni "Yazdır" olan düğmenin adının "Yazıcı simgesi" olması.
  • Eş anlamlı terim kullanmak: Görünür etikette "Cep telefonu", erişilebilir adda "GSM numarası" gibi farklı terimlerin kullanılması.

Kaynaklar

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.

Sitenizde bu kriter nasıl görünüyor?

Ücretsiz tarama, bu kriterdeki sorunları ve diğerlerini Bakanlığın A Seviyesi Kontrol Listesi esas alınarak listeler.

Sitemi ücretsiz tara