Korrekt WebVTT-struktur
Varje fil börjar med WEBVTT-rubriken och sätter punkt före millisekunderna – två detaljer som är lätta att missa vid konvertering för hand.
Skapa WebVTT-undertexter för webben, från en transkription du har granskat.
AutoCap transkriberar din video, låter dig rätta varje ord och varje timing och skriver en giltig .vtt-fil med WEBVTT-rubriken redan på plats.
Inget kort behövs · 2 gratisminuter varje månad · export till MP4, SRT och VTT
WEBVTT 00:00:01.200 --> 00:00:03.400En undertextfil är aldrig bättre 00:00:03.400 --> 00:00:05.100än sin timing. 00:00:05.300 --> 00:00:07.050De här är granskade.
WebVTT är undertextformatet som HTML-elementet track läser, vilket gör det till formatet som webbläsarens inbyggda videospelare förstår. Om din video spelas upp på din egen webbplats eller i en webbaserad kurs är det oftast den här filen du behöver.
En VTT-fil ser nästan ut som en SRT-fil, och det är den likheten som ger trasiga filer: en rubrikrad som saknas, eller kommatecken som blivit kvar i tidsstämplarna efter en snabb sök och ersätt. AutoCap får båda detaljerna rätt, utifrån en transkription du redan har stämt av mot videon.
WebVTT-filer gjorda för webbläsaren.
Textremsor tidsatta efter granskade ord
Varje textremsas start och slut kommer från timing på ordnivå som du har granskat, så undertexterna dyker upp i takt med talet i stället för före.
Redo för track-elementet
Hänvisa till filen från ett HTML5-<track> så kan webbläsarens egen spelare visa undertexterna, utan något insticksprogram.
En SRT-fil från samma projekt
Ladda även ner en SRT-fil för YouTube eller ett redigeringsprogram – orden och timingen matchar VTT-filen exakt.
Enkla textremsor du kan bygga på
Textremsorna skrivs utan placering eller stilsättning, så du kan lägga till egna inställningar eller ::cue-CSS för din spelare utan att behöva ångra något.
Skapa en VTT-fil i fyra steg.
- 01
Ladda upp källvideon
Använd en MP4- eller MOV-fil – det är ljudspåret som transkriberas.
- 02
Korrekturläs mot uppspelningen
Titta med undertexterna igång och rätta namn, siffror och felhörda fraser.
- 03
Justera textremsornas gränser
Dela eller slå ihop textrader så att varje textremsa rymmer en läsbar fras, och justera timingen för ord som ligger fel.
- 04
Ladda ner .vtt-filen
Exportera WebVTT-filen i ett betalt abonnemang och hänvisa sedan till den från din spelare eller ladda upp den till din plattform.
Vad en WebVTT-fil innehåller
WebVTT, kort för Web Video Text Tracks, är en W3C-specifikation. En fil är ren UTF-8-text som måste börja med ordet WEBVTT, följt av en tom rad och sedan en följd av textremsor.
Varje textremsa har en valfri identifierare, en tidsrad och själva undertexten. Tidsstämplarna har punkt före millisekunderna och får utelämna timmarna, och ett block som börjar med NOTE är en kommentar som tittarna aldrig ser.
WEBVTT NOTE Cue identifiers are optional 00:00:01.200 --> 00:00:03.400 Web players read this format natively. 00:00:03.600 --> 00:00:05.900 The header line always comes first.
Inställningar för textremsor och stilsättning med ::cue
WebVTT kan placera och stilsätta undertexter på sätt som SRT inte klarar. Efter tidsstämplarna på tidsraden styr valfria inställningar (cue settings) layouten: line flyttar en textremsa upp eller ner i bilden, position och size bestämmer var rutan hamnar i sidled och hur bred den är, och align styr textjusteringen inuti rutan.
Stilsättningen hör hemma i CSS. Pseudoelementet ::cue låter en webbsida bestämma färg, bakgrund och typsnitt på undertexterna i sin videospelare, och ::cue() med en selektor kan träffa enskilda textremsor.
AutoCap skriver enkla textremsor och lämnar placeringen till spelaren. Lägg till inställningar eller CSS för hand om din egen webbplats behöver det.
- line:10% – lyfter en textremsa till nära videons övre kant
- position:20% – flyttar textremsans ruta åt vänster
- size:50% – smalnar av rutan till halva videons bredd
- align:start – justerar texten mot början av varje rad
video::cue {
color: #ffffff;
background-color: rgb(0 0 0 / 0.7);
font-family: system-ui, sans-serif;
}När det är en VTT-fil du behöver
Välj WebVTT så fort det är en webbläsare som laddar undertexterna. HTML5-video som du själv står värd för tar emot filen via track-elementet, som i kodexemplet nedan, och spelare som bygger på det elementet förväntar sig oftast samma format.
På andra håll är det ofta ett alternativ bland flera. Canvas Studio tar emot undertexter i både SRT och VTT, och YouTube listar WebVTT bland sina format som stöds – även om hjälpsidorna tipsar nybörjare om SRT.
Har du redan en SRT-fil? Konvertera den i stället för att skapa undertexterna på nytt.
<video controls src="lesson.mp4"> <track kind="captions" src="lesson.vtt" srclang="en" label="English" default> </video>
Bra att veta.
Vad är en VTT-fil?
En WebVTT-fil (.vtt) är en undertextfil i ren text för webbvideo. Den börjar med rubriken WEBVTT, listar tidsatta textremsor och är formatet som HTML-elementet track använder.
Innehåller VTT-filen placering eller stilsättning?
Nej. AutoCap skriver vanliga textremsor med korrekt timing och utan några inställningar för placering, så varje spelare använder sin egen undertextstil om du inte lägger till inställningar eller CSS själv.
Varför visas inte min VTT-fil i webbläsaren?
Kontrollera att den första raden är exakt WEBVTT och att tidsstämplarna använder punkt, inte komma. En fil som ligger på en annan domän än sidan behöver dessutom CORS-headers och attributet crossorigin på video-elementet.
Kan jag få en VTT-fil gratis?
Nedladdning av VTT ingår i alla betalda abonnemang, från $9 per månad. Om du redan har en SRT-fil är konverteraren från SRT till VTT gratis och körs i din webbläsare.
Kan jag göra om VTT-filen till en SRT-fil?
Ja. Ladda ner SRT-filen från samma projekt i ett betalt abonnemang, eller kör VTT-filen genom den gratis konverteraren från VTT till SRT.
Testa det på nästa video du publicerar.
Gratisabonnemanget kräver inget kort. Ladda upp ett klipp, granska undertexterna själv och uppgradera först när du vill bli av med vattenstämpeln.