Bu kural ne anlama gelir

WCAG 1.2.2, önceden kaydedilmiş eşzamanlanmış medyanın — ses parçası içeren videoların — altyazı içermesini zorunlu kılar. Altyazılar, konuşulan diyalog ve anlamlı ses efektlerinin medya zaman çizelgesiyle eşzamanlanmış metin versiyonlarıdır. Altyazılar, alt yazılardan farklı olarak müzik, kahkaha veya çevresel sesler gibi konuşma dışı ses ipuçlarını da tanımlar.

Bu kriter, ses parçası içeren tüm önceden kaydedilmiş video içerikleri için geçerlidir. Yalnızca ses veya yalnızca video içeriklere (1.2.1 tarafından kapsanır) veya canlı içeriğe (1.2.4 tarafından kapsanır) uygulanmaz.

Neden önemlidir

Dünya genelinde yaklaşık 466 milyon kişi engelleyici düzeyde işitme kaybı yaşamaktadır. Altyazılar olmadan bu kullanıcılar video içeriklerinden tamamen dışlanır. Altyazılar ayrıca sessiz ortamlarda izleyenlere, ana dili farklı olanlara ve yazılı metni daha etkili işleyen bilişsel engelli kullanıcılara fayda sağlar.

Hukuki açıdan, altyazı sağlama en sık atıfta bulunulan erişilebilirlik gereksinimlerinden biridir. Altyazı eksikliği, özellikle eğitim ve eğlence sektörlerinde çok sayıda erişilebilirlik davasının temelini oluşturmuştür.

Altyazılar isteğe bağlı değildir — her video içerik stratejisinin temel bir parçası ve çoğu yargı alanında yasal bir gerekliliktir.

İlgili axe-core kuralları

video-caption — <video> öğelerinin kind="captions" özelliğine sahip bir <track> öğesi içerdiğini kontrol eder.

Otomatik tarama, altyazı parçalarının yokluğunu tespit eder ancak altyazı kalitesini, eşzamanlama doğruluğunu veya eksiksizliği değerlendiremez. Otomatik testi her zaman manuel incelemeyle destekleyin.

Nasıl test edilir

Sayfadaki her önceden kaydedilmiş videoyu oynatın ve altyazıları etkinleştirin.
Altyazıların konuşulan sesle 1-2 saniye içinde eşzamanlandığini doğrulayın.
Tüm diyaloğun doğru şekilde yazıya döküldüğünü, birden fazla konuşmacı varsa konuşmacı tanımlamasının yapıldığını onaylayın.
Anlamlı konuşma dışı seslerin (örn. [kapı çarpması], [telefon çalması], [hafif müzik]) tanımlandığını kontrol edin.
Altyazıların önemli görsel içeriği engellemediğinden ve video arka planına karşı okunabilir olduğundan emin olun.
Altyazı parçası eksik olan <video> öğelerini işaretlemek için axe-core veya benzer bir otomatik aracı çalıştırın.

Nasıl düzeltilir

Standart yaklaşım, WebVTT altyazı dosyasıyla HTML <track> öğesini kullanmaktır:

<video controls>
  <source src="/urun-demo.mp4" type="video/mp4" />
  <track
    kind="captions"
    src="/urun-demo-tr.vtt"
    srclang="tr"
    label="Türkçe Altyazı"
    default
  />
</video>

Bir WebVTT dosyası şu biçimi izler:

WEBVTT

1
00:00:01.000 --> 00:00:04.500
[Enerjik giriş müziği]

2
00:00:05.000 --> 00:00:08.200
Ürün demomuza hoş geldiniz.
Bugün kontrol panelini inceleyeceğiz.

3
00:00:09.000 --> 00:00:12.800
<v Ayşe>Analitik panelini göstereyim.

4
00:00:13.500 --> 00:00:16.000
[Fare tıklama sesi]
Burada gerçek zamanlı verileri görebilirsiniz.

Dinamik olarak yüklenen video oynatıcılar için altyazı parçasının programatik olarak ilişkilendirildiğinden emin olun:

const video = document.querySelector("video");
const track = video.addTextTrack("captions", "Türkçe", "tr");
track.mode = "showing";
track.addCue(new VTTCue(0, 4.5, "[Enerjik giriş müziği]"));
track.addCue(new VTTCue(5, 8.2, "Ürün demomuza hoş geldiniz."));

Sık yapılan hatalar

Yalnızca otomatik oluşturulan altyazılara güvenmek — doğruluk oranları %60-70 kadar düşük olabilir.
Birden fazla kişi konuşurken konuşmacı tanımlamasını atlamak.
Müzik, ses efektleri veya dramatik etki için kullanılan sessizlik gibi konuşma dışı sesleri altyazıya dahil etmemek.
Videoya gömülü açık altyazıları düşük kontrast veya çok küçük fontlarla kullanmak.
Video izleyicileri çok dilli olduğunda altyazıları yalnızca tek bir dilde sunmak.
Altyazı zamanlamasını rahat okuma hızı için çok hızlı ayarlamak (saniyede en fazla 3 kelime hedefleyin).

1.2.2 Altyazılar (Önceden Kaydedilmiş)