HTML5 videoya VTT altyazı ekleme

Video oynuyor ancak yazı görünmüyorsa önce dosyanın yüklenip yüklenmediğini, ardından zaman aralığını kontrol edin.

İzi videoya bağlayın

Videoyu ve UTF-8 VTT dosyasını aynı sitede barındırın. track öğesini video içine yerleştirin. Göreli yol sayfaya göre çözülür. srclang sesin değil altyazı metninin dilidir; her dile ayrı bir etiket verin.

<video controls src="lesson.mp4">
  <track kind="subtitles" src="example-en.vtt"
         srclang="en" label="English" default>
</video>

Tek altyazı parçasıyla deneme yapın

Örnek videoyu ve VTT dosyasını indirip deneme sunucusunda HTML sayfasıyla aynı klasöre koyun. Örnek kodda adları lesson.mp4 ve example-en.vtt olmalıdır. Yerel dosya kısıtlamalarını elemek için sayfayı web adresinden açın.

Örnekte yalnızca atölye duyurusu vardır. Sekizinci saniyede duraklatıp cümleyi karşılaştırın; on üçüncü saniyede kaybolmuş olmalıdır. Altyazıyı kapatınca da görünüyorsa başka bir parçayı veya görüntüye gömülü yazıyı kontrol edin.

Menü boşsa dosya isteğini izleyin

Geliştirici araçlarında Ağ sekmesini açın, yenileyip İngilizceyi seçin. .vtt isteği yoksa yayımlanan video öğesini inceleyin: editör kayıt sırasında track öğesini kaldırmış olabilir. İstek varsa tam adresi yükleme klasörüyle karşılaştırın.

Yanıt WEBVTT, boş satır ve zaman kodlarıyla başlamalıdır. Giriş sayfası da 200 döndürebilir. CORS hatasında önce dosyayı sayfayla aynı kökende deneyin, ardından sunucunun izin verdiği kökeni ve crossorigin ayarını inceleyin.

Kaymanın biçimine göre kesmeyi bulun

Üç belirgin cümlenin ses başlangıcını altyazıyla karşılaştırın. Kayma eşitse jeneriği inceleyin. Yalnız üçüncü cümle geçse ikinci ve üçüncü arasındaki kesmeye bakın. Fark büyüyorsa önce oynatıcının hangi video sürümünü sunduğunu kontrol edin.

Yayımlanan sayfada her dili seçip bir cümleyi doğrulayın ve altyazıyı kapatın. Kalan yazıyı özgün görüntüyle karşılaştırın. Sorunu bildirirken video dosyasını, seçili parçayı ve oynatma zamanını belirtin.

İş akışı örneği

EasySub’ın kendi metninden üretilmiş İngilizce sentetik sestir. Örnek, ilk SRT dosyasının üçüncü satır grubunu kullanır; yeni bir dışa aktarım veya profesyonel insan düzeltmesi değildir.

WEBVTT

3
00:00:07.950 --> 00:00:12.149
Our next workshop starts on June 15 at 9:30.

WebVTT · EN · Örnek videoyu indir · Özgün SRT (İngilizce)

Bilinen bir aralığı sınayın

Örnekte English seçip sekizinci saniyeye gidin. Cümle on üçüncü saniyede görünmemeli. VTT adresini doğrudan açın: 200 yanıtı veren bir giriş sayfası altyazı dosyası değildir. text/vtt türünü, farklı alan adında ise crossorigin ve CORS yanıtını kontrol edin.