WCAG 1.2.4: Altyazılar (Canlı)

Bu Kuralın Anlamı

\n

WCAG 1.2.4 (Altyazılar — Canlı) eşzamanlı medya içindeki tüm canlı ses içeriği için altyazı sağlanmasını gerektirir. Eşzamanlı medya, bilgiyi sunmak için kullanılan başka bir formatla veya web yayını, canlı yayın ya da web üzerindeki gerçek zamanlı yayın gibi zamana dayalı etkileşimli bileşenlerle eşzamanlı olan ses veya video içeriği olarak tanımlanır.

\n

Pratikte bu, bir web sitesinde veya web uygulamasında yayımlanan ve ses içeren herhangi bir canlı etkinliğin — bir haber sitesinde yayınlanan basın toplantısı, bir şirketin tüm çalışanlara yönelik yayını, bir devlet oturumu, canlı çevrim içi ders veya spor yorum yayını — gerçekleşirken söylenenleri doğru şekilde yansıtan gerçek zamanlı altyazılar göstermesi gerektiği anlamına gelir.

\n

Geçer sayılan durum: Bir canlı yayın, eşzamanlı ve doğru gerçek zamanlı altyazılar oynatma sırasında kullanıcıya görünür olduğunda bu kritere uyar. Altyazılar, tüm diyalogu ve ilgili konuşma dışı ses bilgilerini (örneğin "[alkış]" veya "[alarm sesleri]") temsil etmelidir. Yaygın yaklaşımlar arasında profesyonel bir altyazı sağlayıcısı tarafından sunulan CART (Communication Access Realtime Translation), nitelikli bir canlı altyazı hizmetinden gelen otomatik konuşma tanıma (ASR) altyazıları veya yayın platformlarının sunduğu üçüncü taraf entegrasyonlar bulunur.

\n

Kalır sayılan durum: Bir canlı yayın, altyazı hiç yoksa, altyazılar konuşulan sesle eşzamanlı değilse, altyazılar diyalogların önemli bölümlerini atlıyorsa veya altyazı doğruluğu anlaşılırlığı ciddi biçimde bozacak kadar düşükse bu kriteri karşılamaz. Etkinlikten sonra bir transkript sağlamak bu gerekliliği karşılamaz — altyazılar canlı, gerçek zamanlı olarak mevcut olmalıdır.

\n

Resmi istisnalar: WCAG bu kurala bir istisna tanımlar: Metin için bir medya alternatifi olan ve bu şekilde açıkça etiketlenmiş medya muaf tutulur. Örneğin, bir röportajın ayrıntılı bir metin transkriptini yayımlayıp aynı içeriğin canlı sesli bir versiyonunu da metne sesli alternatif olarak açıkça etiketleyerek sunarsanız, altyazılar katı biçimde gerekli olmayabilir. Ancak bu istisna dardır ve pratikte nadiren uygulanabilir.

\n

Kriter, web üzerinde yayımlanan tüm eşzamanlı medya için geçerlidir — videonun önceden üretilmiş olup olmadığı veya gerçekten canlı olup olmadığı fark etmeksizin. Canlıymış gibi yayınlanan önceden kaydedilmiş bir web semineri tekrar yayını hâlâ 1.2.3 veya 1.2.5 kapsamına girer, ancak gerçek zamanlı bir yayın doğrudan 1.2.4 kapsamındadır.

\n\n

Neden Önemlidir

\n

Dünya Sağlık Örgütü’ne göre dünya genelinde yaklaşık 430 milyon kişinin engelleyici işitme kaybı vardır ve bu sayının 2050 yılına kadar 700 milyonun üzerine çıkması öngörülmektedir. Sağır ve işitme güçlüğü yaşayan kullanıcılar için gerçek zamanlı altyazılar bir kolaylık değil — canlı bağlamda sesli içeriğe erişmenin birincil veya tek yoludur. Altyazı olmadan bu kullanıcılar, herhangi bir canlı medya etkinliğine katılmaktan veya onu anlamaktan tamamen dışlanmış olur.

\n

Sağırlık ve işitme kaybının ötesinde, canlı altyazılar çok daha geniş bir kitleye fayda sağlar. Gürültülü ortamlardaki kullanıcılar — havaalanları, açık ofisler, toplu taşıma — sesi kullanamayabilir. Sessiz ortamlarda kulaklık olmadan izleyen veya cihazlarını sessize almış kullanıcılar, içeriği takip etmek için altyazılara güvenir. Anadili olmayan kullanıcılar, özellikle konuşmacılar karmaşık kelime dağarcığı, aksanlar veya teknik jargon kullandığında, altyazıları anlamak için vazgeçilmez bulur. Bilişsel ve dil işleme farklılıkları da altyazıları doğru anlama için hayati hâle getirebilir.

\n

Somut bir senaryo düşünün: Türkiye’de bir belediye, resmi web sitesinde canlı bir belediye meclisi toplantısı yayınlıyor. Sağır bir sakin, mahallesindeki imar değişiklikleriyle ilgili tartışmayı takip etmek istiyor. Gerçek zamanlı altyazılar olmadan bu sakin, yurttaş katılımından tamamen dışlanmış olur. Aynı durum, özel bir okulun öğrenim yönetim sistemi üzerinden canlı çevrim içi derse katılan sağır bir öğrenci veya bir bankanın canlı ürün tanıtım web seminerini takip etmeye çalışan bir müşteri için de geçerlidir.

\n

Pratik açıdan bakıldığında, canlı altyazı altyapısı aynı zamanda arama motorları tarafından indekslenebilen bir transkript üretir ve bu da video içeriğinin bulunabilirliğini artırır. Canlı altyazıya yatırım yapan kuruluşlar, transkript çıktısının etkinlik sonrası dokümantasyon, özetler ve arşiv aramaları için değerli bir kaynak hâline geldiğini sıklıkla görür.

\n\n

İlgili Axe-core Kuralları

\n

WCAG 1.2.4 manuel test gerektirir. Hiçbir otomatik axe-core kuralı canlı altyazıların varlığını veya kalitesini güvenilir şekilde tespit edemez ve bu, erişilebilirlik denetimi stratejinizi planlarken anlaşılması önemli bir ayrımdır.

\n

\n
• Manuel test gerekli — canlı altyazı varlığı: axe-core gibi otomatik araçlar, bir <video> öğesi üzerinde kind='captions' özelliğine sahip bir <track> öğesinin varlığını tespit etmek için DOM’u tarayabilir, ancak canlı yayınlar neredeyse hiçbir zaman basit bir HTML <video> öğesi ve <track> ile sunulmaz. Genellikle JavaScript tabanlı oynatıcılar (Video.js, JW Player veya yerel platform oynatıcıları gibi) üzerinden sunulan uyarlanabilir bit hızına sahip formatlar (HLS, DASH) kullanılır. Bu oynatıcılar altyazıları, axe-core’un içini göremeyeceği şekilde dinamik olarak oluşturur. Bir araç, canlı yayını gerçek zamanlı izleyemez, altyazı doğruluğunu değerlendiremez, eşzamanlama gecikmesini ölçemez veya bir altyazı katmanının gerçekten konuşulan içeriği yansıtıp yansıtmadığını ya da statik bir yer tutucu olup olmadığını belirleyemez.
\n
• Manuel test gerekli — altyazı kalitesi ve doğruluğu: Otomatik bir araç bir altyazı akışının var olduğunu tespit edebilse bile, altyazıların doğru, eksiksiz veya kabul edilebilir düzeyde eşzamanlı olup olmadığını değerlendiremez. CART ile üretilmiş altyazılar ve düşük kaliteli otomatik oluşturulmuş altyazılar, bir araç için her ikisi de "altyazı mevcut" olarak görünebilir, ancak yalnızca biri WCAG 1.2.4’ü karşılar. Uygunluğu doğrulamanın tek güvenilir yolu, canlı etkinlik sırasında insan incelemesidir.
\n
• Manuel test gerekli — oynatıcı içindeki altyazı erişilebilirliği: Otomatik araçlar genellikle özel bir medya oynatıcısındaki altyazı kontrollerinin klavye ile erişilebilir olup olmadığını, altyazı görüntüsünün kullanıcı tarafından yeniden boyutlandırılıp özelleştirilebilip bilmediğini veya altyazı stilinin kullanıcıların ihtiyaçlarını karşılayıp karşılamadığını belirleyemez. Bu yönler, gerçek klavye gezinmesi ve ekran okuyucu kullanımıyla yapılan uygulamalı testler gerektirir.
\n

\n\n

Nasıl Test Edilir

\n

\n
1. Sayfadaki tüm canlı medyayı belirleyin: Sayfayı canlı video veya ses akışları açısından inceleyin. Gömülü oynatıcıları, iframe’leri veya dinamik olarak yüklenen medya bileşenlerini kontrol edin. İçeriğin gerçekten canlı (gerçek zamanlı yayın) mı yoksa önceden kaydedilmiş mi olduğunu not edin. Yalnızca eşzamanlı medyadaki gerçekten canlı ses içeriği 1.2.4 kapsamına girer.
\n
2. axe DevTools veya Lighthouse ile otomatik tarama çalıştırın: Chrome DevTools içinde axe DevTools’u açın ve tam sayfa taraması yapın. axe canlı altyazıları doğrulayamasa da, medya oynatıcı kontrollerinde eksik aria-label, erişilemez oynat/duraklat düğmeleri veya eksik odak yönetimi gibi ilgili sorunları işaretleyebilir. İşaretlenen sorunları destekleyici kanıt olarak not edin, ancak temiz bir axe raporunun 1.2.4 uyumluluğunu doğrulamadığını unutmayın.
\n
3. Canlı etkinlik sırasında altyazı mevcudiyetini manuel olarak doğrulayın: Aktif bir yayın sırasında canlı akışa erişin. Altyazıların gösterilip gösterilmediğini kontrol edin. Oynatıcıda bir altyazı geçişi (CC düğmesi) varsa, bunu etkinleştirin ve konuşmacı konuştukça altyazıların görünüp neredeyse gerçek zamanlı olarak güncellendiğini doğrulayın. Altyazı gecikmesinin kabul edilebilir olduğunu doğrulayın — genellikle CART için birkaç saniyeden, ASR için ise biraz daha fazlasından uzun olmamalıdır.
\n
4. Altyazı doğruluğunu değerlendirin: Altyazıları okurken sesi dinleyin. Kaçırılan kelimeleri, sistematik hataları veya önemli atlamaları kontrol edin. Altyazıların birebir olması gerekmez, ancak konuşulan içeriğin tüm anlamını aktarmalıdır. Birden fazla konuşmacı varsa, konuşmacı kimliğini not edin — altyazılar, kimin konuştuğunun açık olmadığı durumlarda bunu belirtmelidir.
\n
5. NVDA + Firefox ile test edin: Sekme tuşunu kullanarak medya oynatıcıya gidin. Altyazı geçişi dâhil tüm oynatıcı kontrollerinin klavye ile erişilebilir ve kullanılabilir olduğunu doğrulayın. NVDA’nın altyazı düğmesinin durumunu (açık/kapalı) duyurduğunu doğrulayın. Altyazıları etkinleştirin ve kullanıcı oynatıcıya veya çevresine sekme ile geldiğinde altyazı metninin NVDA tarafından okunabildiği bir DOM öğesinde göründüğünü doğrulayın.
\n
6. VoiceOver + Safari (macOS veya iOS) ile test edin: Oynatıcıda gezinmek için VoiceOver hareketlerini veya klavye komutlarını kullanın. Altyazı geçişinin duyurulduğunu ve kullanılabildiğini doğrulayın. Altyazı metni değişikliklerinin oynatıcının erişilebilir bölgesi içinde uygun şekilde yansıtıldığını doğrulayın.
\n
7. JAWS + Chrome ile test edin: Sekme tuşunu kullanarak oynatıcı kontrollerine gidin. JAWS’ın tüm kontrol etiketlerini okuduğunu doğrulayın. Altyazı geçişinin uygun etiket ve durumla bir düğme olarak tanımlandığını doğrulayın. Altyazıları etkinleştirin ve altyazı görüntüsünün beklendiği gibi güncellendiğini doğrulayın.
\n
8. Altyazı görüntü özelleştirmesini kontrol edin: Oynatıcının kullanıcıların altyazı metnini yeniden boyutlandırmasına, renkleri değiştirmesine veya kontrastı ayarlamasına izin verip vermediğini doğrulayın. Bu, 1.2.4 tarafından katı biçimde zorunlu olmasa da, en iyi uygulama değerlendirme noktasıdır ve WCAG 1.4 kriterleriyle ilgilidir.
\n

\n\n

Nasıl Düzeltilir

\n

Altyazı parçası olmayan canlı yayın — Hatalı

\n

<!-- Altyazı yapılandırması olmadan gömülü bir canlı HLS yayını -->\n<video id='live-player' controls autoplay>\n  <source src='https://stream.example.com/live/event.m3u8' type='application/x-mpegURL'>\n  <!-- <track> öğesi yok ve oynatıcıda altyazı yapılandırması yok -->\n</video>

\n

Entegre CART altyazı parçası olan canlı yayın — Doğru

\n

<!-- CART hizmeti tarafından beslenen canlı bir WebVTT altyazı parçası kullanan Video.js ile canlı yayın.\n     Parçanın src değeri, gerçek zamanlı olarak güncellenen canlı bir altyazı uç noktasını gösterir. -->\n<video\n  id='live-player'\n  class='video-js vjs-default-skin'\n  controls\n  autoplay\n  aria-label='Gerçek zamanlı altyazılı canlı konferans yayını'>\n  <source src='https://stream.example.com/live/event.m3u8' type='application/x-mpegURL'>\n  <track\n    kind='captions'\n    src='https://captions.example.com/live/event.vtt'\n    srclang='tr'\n    label='Turkish captions'\n    default>\n</video>\n<script>\n  var player = videojs('live-player');\n  // Erişilebilirlik için altyazıları varsayılan olarak etkinleştir\n  player.ready(function() {\n    player.textTracks()[0].mode = 'showing';\n  });\n</script>

\n

Gömülü kodda altyazıları devre dışı bırakılmış platformdan gömülü canlı yayın — Hatalı

\n

<!-- cc_load_policy=0 ile kapalı altyazıları açıkça devre dışı bırakılmış YouTube canlı gömme.\n     Bu, kullanıcının altyazıları etkinleştirme olanağını kaldırır ve 1.2.4 ihlaline neden olur. -->\n<iframe\n  src='https://www.youtube.com/embed/live_stream?channel=CHANNEL_ID&cc_load_policy=0'\n  title='Şirket tüm çalışanlar canlı yayını'\n  allowfullscreen>\n</iframe>

\n

Altyazıları etkinleştirilmiş platformdan gömülü canlı yayın — Doğru

\n

<!-- Kapalı altyazıları varsayılan olarak etkin (cc_load_policy=1) YouTube canlı gömme.\n     Platformun yerel altyazı altyapısı kullanılır; bu altyapı, YouTube Studio ayarlarında\n     yapılandırıldığında canlı otomatik altyazıları ve insan tarafından gözden geçirilmiş CART’ı destekler.\n     Ana sayfa ayrıca iframe ile etkileşime giremeyen kullanıcılar için altyazılı yayına\n     doğrudan bir bağlantı sağlar. -->\n<iframe\n  src='https://www.youtube.com/embed/live_stream?channel=CHANNEL_ID&cc_load_policy=1'\n  title='Altyazıları etkinleştirilmiş şirket tüm çalışanlar canlı yayını'\n  allowfullscreen>\n</iframe>\n<p>\n  <a href='https://www.youtube.com/watch?v=LIVE_VIDEO_ID'>\n    Altyazılarla doğrudan YouTube’da izle\n  </a>\n</p>

\n

Klavye ile erişilebilir olmayan altyazı geçişine sahip özel oynatıcı — Hatalı

\n

<!-- Altyazı geçişi etkileşimli olmayan bir <div> olarak uygulanmış.\n     Klavye kullanıcıları ve ekran okuyucu kullanıcıları bu denetimi etkinleştiremez. -->\n<div class='player-controls'>\n  <div class='cc-button' onclick='toggleCaptions()'>CC</div>\n</div>

\n

Erişilebilir altyazı geçişine sahip özel oynatıcı — Doğru

\n

<!-- Altyazı geçişi, açık bir etiket ve ARIA basılı durumu ile bir <button> olarak\n     uygulanmıştır; böylece klavye ve ekran okuyucu kullanıcıları bu denetimi keşfedip\n     kullanabilir. Durum, altyazılar değiştirildiğinde dinamik olarak güncellenir. -->\n<div class='player-controls'>\n  <button\n    class='cc-button'\n    id='captions-toggle'\n    aria-pressed='false'\n    aria-label='Altyazıları aç/kapat'\n    onclick='toggleCaptions(this)'>\n    CC\n  </button>\n</div>\n<script>\n  function toggleCaptions(btn) {\n    var isActive = btn.getAttribute('aria-pressed') === 'true';\n    btn.setAttribute('aria-pressed', String(!isActive));\n    // altyazı parçasını göster/gizle mantığı\n  }\n</script>

\n\n

Yaygın Hatalar

\n

\n
• Gerçek zamanlı altyazılar yerine etkinlik sonrası transkript sağlamak: Canlı bir etkinliğin bitiminden sonra metin transkriptini yayımlamak 1.2.4’ü karşılamaz. Altyazılar, sağır kullanıcıların içeriği görme engeli olmayan işiten kullanıcılarla aynı anda gerçek zamanlı olarak takip edebilmesini sağlamak için canlı sesle eşzamanlı olarak mevcut olmalıdır.
\n\n

(İçerik belirteç sınırı nedeniyle kesildi — lütfen bu makaleyi yeniden deneyin.)