Sesli Betimleme veya Medya Alternatifi (Önceden Kaydedilmiş)

Kısaca

Bir videoda ekranda gösterilen ama seste anlatılmayan bilgiler (grafikler, slayttaki metinler, yapılan işlemler, kişilerin eylemleri) görmeyen kullanıcıya ulaşmaz. Bu kriter, bu bilgilerin sesli betimleme veya metin temelli bir medya alternatifiyle sunulmasını ister.

A seviyesinde iki yoldan biri yeterlidir: videonun sesli betimlemeli bir sürümü ya da görsel bilgileri de içeren ayrıntılı bir metin alternatifi. Anlatımda tüm görsel bilgi zaten sözlü olarak veriliyorsa ek bir şey gerekmez.

Neleri kapsar?

• Sesli betimleme: Konuşma aralarına yerleştirilen ve ekranda olanı anlatan ek ses kaydı.
• Metin temelli medya alternatifi: Konuşmaların yanında görsel bilgileri de sırasıyla anlatan ayrıntılı metin.
• Görsel bilgi türleri: Ekrandaki grafikler, slayt metinleri, menüde yapılan seçimler, kişilerin eylemleri, sahne değişiklikleri.
• İstisna: Yalnızca konuşmaya dayalı ve görsel bilgisi seste zaten aktarılan videolar; ya da açıkça belirtilmiş bir metnin alternatifi olarak sunulan videolar.
• Kapsam dışı notlar: Konuşmaların altyazısı bir önceki kriterin (Altyazılar) konusudur.

Kimleri etkiler?

Kör ve az gören kullanıcılar bu kriterden doğrudan yararlanır. Ekranda neyin gösterildiğini göremedikleri için "şimdi buraya tıklıyoruz" gibi bir anlatım onlara bilgi vermez. Metin alternatifi ayrıca hem görme hem işitme kaybı olan ve içeriği kabartma ekranla okuyan kullanıcılar için de çoğu zaman tek erişim yoludur. Bilişsel engelli kullanıcılar da adım adım yazılmış bir metinden yarar görür.

Kontrol listesinde

Bu kriter, Bakanlığın A Seviyesi Kontrol Listesi'nde 24–25 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. Sesli betimlemeli sürümü sunmak

En açık yöntem, betimleme sesi eklenmiş ikinci bir video dosyası hazırlamak ve ona görünür bir bağlantıyla ulaşılmasını sağlamaktır.

<video controls src="/video/e-imza-kurulumu.mp4">
  <track kind="captions" src="/video/e-imza-kurulumu.tr.vtt" srclang="tr" label="Türkçe">
</video>

<video controls src="/video/e-imza-kurulumu.mp4">
  <track kind="captions" src="/video/e-imza-kurulumu.tr.vtt" srclang="tr" label="Türkçe">
</video>
<p>
  <a href="/video/e-imza-kurulumu-sesli-betimlemeli">
    E-imza kurulumu videosunun sesli betimlemeli sürümünü izleyin
  </a>
</p>

2. Sürümler arasında geçiş düğmesi

Aynı oynatıcı içinde sürüm değiştirmek isterseniz bunu gerçek bir düğmeyle yapın ve seçili durumu aria-pressed ile bildirin.

<button type="button" id="betimleme" aria-pressed="false">
  Sesli betimleme
</button>

<script>
  const video = document.querySelector("video");
  const dugme = document.getElementById("betimleme");
  const kaynaklar = {
    normal: "/video/e-imza-kurulumu.mp4",
    betimlemeli: "/video/e-imza-kurulumu-betimlemeli.mp4"
  };

  dugme.addEventListener("click", () => {
    const acik = dugme.getAttribute("aria-pressed") === "true";
    const zaman = video.currentTime;
    video.src = acik ? kaynaklar.normal : kaynaklar.betimlemeli;
    video.currentTime = zaman;
    dugme.setAttribute("aria-pressed", String(!acik));
  });
</script>

3. Metin temelli medya alternatifi

Yalnızca konuşmaları içeren bir döküm bu kriteri karşılamaz. Metin alternatifi ekranda olanları da sırasıyla anlatmalıdır.

<p>Anlatıcı: Şimdi buraya tıklıyoruz ve
bu alanı dolduruyoruz. Sonra da kaydediyoruz.</p>

<p>[Ekranda: Başvuru sayfası, sağ üstte
"Yeni Başvuru" düğmesi]</p>
<p>Anlatıcı: Şimdi buraya tıklıyoruz.</p>
<p>[Ekranda: "Yeni Başvuru" düğmesine basılıyor,
form açılıyor. İlk alan "T.C. Kimlik No".]</p>
<p>Anlatıcı: Bu alanı dolduruyoruz.
Sonra da kaydediyoruz.</p>
<p>[Ekranda: Formun altındaki "Kaydet"
düğmesine basılıyor, yeşil onay mesajı çıkıyor:
"Başvurunuz kaydedildi."]</p>

4. Metin alternatifini videoyla ilişkilendirmek

Metin alternatifi videonun hemen yakınında ve kolayca bulunur olmalıdır. <details> ile sayfayı kalabalıklaştırmadan sunabilirsiniz.

<figure>
  <video controls src="/video/e-imza-kurulumu.mp4"
         aria-describedby="video-aciklama"></video>
  <figcaption id="video-aciklama">
    E-imza kurulumu (4 dk). Görsel adımlar dahil metin
    alternatifi aşağıdadır.
  </figcaption>
</figure>

<details>
  <summary>Videonun metin alternatifi (görsel betimlemeler dahil)</summary>
  <!-- Örnek 3'teki gibi ayrıntılı metin -->
</details>

5. Betimlemeye yer açan anlatım

En kolay çözüm çoğu zaman, video çekilirken görsel bilgiyi sözle de vermektir. Senaryoda yapılacak bu küçük değişiklik ayrı bir betimleme ihtiyacını ortadan kaldırabilir.

Anlatıcı: Gördüğünüz gibi oranlar
bu yıl epey değişti.

Anlatıcı: Grafikte görüldüğü gibi
e-başvuru oranı bu yıl yüzde 42'den
yüzde 61'e yükseldi.

Mobil için kod örnekleri

iOS (SwiftUI)

Videoda sesli betimleme ayrı bir ses izi olarak (örneğin HLS'te) tanımlıysa, oynatıcıya bu izi tercih etmesi söylenebilir. Sistem ayarlarında sesli betimleme açık olan kullanıcılar için de doğru iz seçilir.

import SwiftUI
import AVKit

struct KurulumVideosu: View {
    @State private var oynatici = AVPlayer(
        url: URL(string: "https://ornek.gov.tr/video/e-imza.m3u8")!
    )

    var body: some View {
        VStack(alignment: .leading, spacing: 12) {
            VideoPlayer(player: oynatici)
                .frame(height: 220)

            // Kendi ekranınız: görsel betimlemeleri içeren metin alternatifi
            NavigationLink("Videonun metin alternatifini okuyun") {
                MetinAlternatifiEkrani()
            }
        }
        .onAppear {
            let kriter = AVPlayerMediaSelectionCriteria(
                preferredLanguages: ["tr"],
                preferredMediaCharacteristics: [.describesVideoForAccessibility]
            )
            oynatici.setMediaSelectionCriteria(kriter, forMediaCharacteristic: .audible)
        }
    }
}

Android (Jetpack Compose)

Media3 ExoPlayer'da betimleme içeren ses izi, rol bayrağı üzerinden tercih edilebilir. Kullanıcının bunu açıp kapatabileceği görünür bir anahtar da sunulmalıdır.

import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.media3.common.C
import androidx.media3.exoplayer.ExoPlayer

@Composable
fun BetimlemeAnahtari(oynatici: ExoPlayer) {
    var betimleme by remember { mutableStateOf(false) }

    Row(verticalAlignment = Alignment.CenterVertically) {
        Text("Sesli betimleme", modifier = Modifier.weight(1f))
        Switch(
            checked = betimleme,
            onCheckedChange = { acik ->
                betimleme = acik
                oynatici.trackSelectionParameters =
                    oynatici.trackSelectionParameters.buildUpon()
                        .setPreferredAudioRoleFlags(
                            if (acik) C.ROLE_FLAG_DESCRIBES_VIDEO else 0
                        )
                        .build()
            }
        )
    }
}

Bu örnekte Text ve Switch görsel olarak yan yana durur; ekran okuyucunun ikisini tek bir öğe olarak okuması için satırı Modifier.toggleable ile tek bir denetime dönüştürmek daha iyi bir yöntemdir. Bu konu Bilgi ve İlişkiler kriterinin kapsamındadır.

Nasıl test edilir?

• Ekrana bakmadan dinleyin: Videoyu görüntüsüz dinleyin. İçeriği anlamak için ekranı görmeniz gereken anlar var mı? Varsa bunları not edin.
• Alternatifi karşılaştırın: Not ettiğiniz görsel bilgilerin her biri sesli betimlemede veya metin alternatifinde yer alıyor mu?
• Bulunabilirliği kontrol edin: Betimlemeli sürüm veya metin alternatifi videonun yakınında, klavye ve ekran okuyucu ile ulaşılabilir durumda mı?
• Mobilde sistem ayarıyla deneyin: Cihazın sesli betimleme tercihi açıkken uygulama betimleme izini seçiyor mu?
• Otomatik araçların sınırı: Otomatik araçlar bu kriteri neredeyse hiç değerlendiremez. Videoda hangi görsel bilginin seste eksik kaldığını yalnızca içeriği izleyen bir kişi belirleyebilir.

Sık yapılan hatalar

• Altyazıyı yeterli saymak: Altyazı işitme engelliler içindir; görsel bilgiyi görmeyen kullanıcıya aktarmaz.
• Yalnızca konuşma dökümü vermek: Görsel olayları içermeyen bir döküm, medya alternatifi sayılmaz.
• "Buraya", "şuraya" diye anlatmak: Ekranı göstererek yapılan anlatım, görmeyen kullanıcıya hiçbir şey söylemez.
• Yalnızca kind="descriptions" izine güvenmek: Bu iz türü HTML'de tanımlıdır ancak tarayıcı ve ekran okuyucu desteği tutarsızdır. Tek çözüm olarak kullanılmamalıdır.
• Alternatifi başka bir sayfaya gömmek: Metin alternatifi var ama videodan bağlantı verilmemişse kullanıcı onu bulamaz.
• Ekrandaki metinleri atlamak: Slayt başlıkları, telefon numaraları, adresler gibi yalnızca ekranda yazan bilgiler sık unutulur.

Kaynaklar

• Understanding SC 1.2.3: Audio Description or Media Alternative (Prerecorded) (W3C), İngilizce, yeni sekmede açılır
• Erişilebilirlik blogu — Uygulamadan örnekler ve güncel yazılar.
• Erişilebilirlik sözlüğü — Sesli betimleme, medya alternatifi, transkript 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.