WebVTT Nədir?

WebVTT (Web Video Text Tracks Format), videolara zamanlanmış mətn izləri əlavə etmək üçün istifadə olunan mətin əsaslı altyazı formatıdır. HTML5-də <track> elementi vasitəsilə dəstəklənən rəsmi formatdır və sizə aşağıdakını əlavə etməyə imkan verir:

• Altyazılar (tərcümə olunmuş nitq)
• Başlıqlar (nitq və səs effektləri)
• Təsvirlər (ekran oxuyucular üçün vizual məlumat)
• Fəsillər (videodakı naviqasiya nöqtələri)
• Metadata

WebVTT-nin Əsas Quruluşu

• WebVTT faylı aşağıdakılardan ibarətdir:
  • İstəyə bağlı başlıq (WEBVTT).
  • İstəyə bağlı metadata (şərhlər və ya stil/skript blokları).
  • Cue-lar (zamanlama və məzmunu olan mətn seqmentləri).

1. Cue Formatı

Cue aşağıdakı struktura malikdir:

[HH:]MM:SS.mmm --> [HH:]MM:SS.mmm [cue settings]
Text payload...

• Zamanlama: HH:MM:SS.mmm formatında başlanğıc və son vaxtlar.
• Parametrlər (istəyə bağlı):
  • vertical (şaquli mətn üçün lr/rl)
  • line (yerləşdirmə)
  • position (üfüqi düzülüş)
  • size (eni/faizi)
  • align (başlanğıc/ortaq/son)

2. Cue Məzmunu

• Sadə mətn ola bilər və ya işarələmə daxil edə bilər:
  • Teqlər: <b>, <i>, <u>, <ruby>, <lang> və s.
  • Zaman möhürləri (<00:00:05.000>) karaoke stilində mətn üçün.

3. Stil və CSS

Stil aşağıdakı yollarla tətbiq oluna bilər:

• Inline cue-lar (teqlərdən istifadə edərək).
• CSS pseudo-elementləri (::cue, ::cue-region) HTML-də.

4. Metadata İzləri

WebVTT interaktiv tətbiqlər üçün metadata (JSON və s.) daşıya bilər.

5. Fayl Kodlaması

• UTF-8 kodlamalı olmalıdır.
• Sətirlər \r\n, \n və ya \r ilə bitməlidir.

6. Emal Qaydaları

• Parserlər səhv formatlı faylları incəliklə idarə etməlidir.
• BOM (Byte Order Mark) istəyə bağlıdır.

7. HTML5 İnteqrasiyası

<track> elementi ilə istifadə olunur:

<video>
  <track src="subtitles.vtt" kind="subtitles" srclang="en" default>
</video>

• kind subtitles, captions, descriptions, chapters və ya metadata ola bilər.

8. Brauzer Dəstəyi

Müasir brauzerlərdə (Chrome, Firefox, Safari, Edge) geniş dəstəklənir.

9. İstifadə Halları

• Altyazılar/Başlıqlar əlçatanlıq üçün.
• Zamanlanmış mətnlə karaoke mahnı sözləri.
• Videolarda fəsil naviqasiyası.
• İnteraktiv video tətbiqləri üçün metadata.

WebVTT Faylının Nümunəsi:

WEBVTT

00:00:00.000 --> 00:00:03.000
Welcome to our tutorial on WebVTT.

00:00:04.000 --> 00:00:08.000
In this video, you'll learn how to add subtitles to your HTML5 videos.

Axtarış motorları videonuzu “izləyə” bilməz—lakin mətin əsaslı məzmunu oxuya bilərlər. WebVTT fayllarını istifadə edərək indekslənə bilən mətn əlavə edirsiniz ki:

• Kəşfiyyatı artırır: Google başlıqları və transkriptləri indeksləyir, videolarınızın daha çox axtarış nəticəsində görünməsini təmin edir.
• İştirakı artırır: Altyazılı videolar istifadəçiləri daha uzun müddət saxlayır—sessiya müddətini artırır və bounce rate-ni azaldır.
• Əlçatanlığı gücləndirir: Başlıqlar eşitmə problemi olan istifadəçilər üçün vacibdir və SEO reytinq alqoritmlərində üstünlük təşkil edir.

WebVTT faylı bir veb səhifədə videoya əlavə edildikdə, Google bu zamanlanmış mətnləri təhlil edib başa düşə bilir, bu da məzmunu müəyyən sorğular üçün daha əlaqəli edir.

HTML5 Videoya WebVTT Necə Əlavə Etmək

Videonuza WebVTT faylını <track> elementi ilə əlavə edə bilərsiniz:

<video controls>
  <source src="video.mp4" type="video/mp4">
  <track src="subtitles.vtt" kind="subtitles" srclang="en" label="English">
</video>

• src: .vtt faylınızın yolu
• kind: mətn izinin növü (subtitles, captions, chapters və s.)
• srclang: dil kodu (məsələn, en, es)
• label: oynatıcıda göstərilən iz etiketi

WebVTT vs SRT: Fərq Nədir?

WebVTT Fayllarını Yaratmaq və Redaktə Etmək üçün Alətlər

.vtt fayllarını yaratmaq və ya redaktə etmək üçün aşağıdakıları istifadə edə bilərsiniz:

• Mətn Redaktorları: VS Code, Sublime Text
• Altyazı Redaktorları: Subtitle Edit, Amara, Aegisub
• Konvertorlar: SRT fayllarını VTT-ə və əksinə çevirmək üçün alətlərdən istifadə edin

WebVTT Faylını Necə Açmaq?

WebVTT (.vtt) faylını açmaq üçün istənilən mətn redaktoru və ya altyazı redaktoru istifadə edə bilərsiniz.

Mətn Redaktorunda Açmaq

• Windows: Notepad, Notepad++, VS Code
• macOS: TextEdit, Sublime Text
• Linux: Gedit, nano, Vim

.vtt faylları sadə mətn olduğu üçün onları istənilən adi mətn faylı kimi görüntüləyə və redaktə edə bilərsiniz.

Altyazı Redaktorunda Açmaq

• Subtitle Edit (Windows)
• Aegisub (çox platformalı)
• Amara (veb əsaslı)

Brauzerdə Açmaq

1. <video> və <track> teqləri olan sadə bir HTML faylı yaradın.
2. HTML faylını brauzerdə açın ki, videonu altyazılarla görə biləsiniz.

ASS Fayllarının Əsas Xüsusiyyətləri

Tez-tez Soruşulan Suallar

S1: WebVTT və SRT arasındakı fərq nədir?
Cavab: WebVTT SRT-yə əsaslanır, lakin mətn yerləşdirmə, səs teqləri, CSS stilizasiya və metadata dəstəyi kimi vacib xüsusiyyətlər əlavə edir, həmçinin HTML5 video ilə yerli inteqrasiya təmin edir.

S2: WebVTT altyazılarını YouTube-a necə əlavə etmək olar?
Cavab: Videonuza altyazı əlavə edərkən .vtt faylınızı yükləyin, ya da YouTube-un avtomatik başlıqlarını istifadə edin və yaradılan WebVTT faylını redaktə üçün yükləyin.

S3: WebVTT faylları şəkilləri daxil edə bilərmi?
Cavab: WebVTT spesifikasiyası birbaşa daxil edilmiş şəkilləri dəstəkləmir, lakin URL-lərlə metadata cue-larından istifadə edərək və JavaScript vasitəsilə xüsusi şəkil göstərməyi həyata keçirə bilərsiniz.

S4: Niyə WebVTT stillərim tətbiq olunmur?
Cavab: STYLE bloklarının ilk cue-dan əvvəl göründüyünə, boş sətir içermədiyinə və ::cue pseudo-elementini düzgün istifadə etdiyinizə baxın. Həmçinin brauzer uyğunluğunu yoxlayın.

S5: WebVTT faylları HLS kimi axın protokolları ilə işləyirmi?
Cavab: Bəli, HLS (HTTP Live Streaming) videoyla birlikdə altyazıların səmərəli axını üçün seqmentləşdirilmiş WebVTT-ni dəstəkləyir.

İstinadlar

• WebVTT: Web Video Mətn İzləri Formatı