YamlBox

Convertisseurs de données · 5 minutes de lecture

SRT à VTT : sous-titres que le navigateur va réellement

Un élément vidéo HTML5 ignorera volontiers un fichier SRT : l'élément `<track>` du navigateur charge WebVTT et rien d'autre. La conversion de SRT en VTT est donc une étape de routine dans la publication de vidéos sur le Web — et les différences entre les deux formats sont plus petites que prévu, c'est exactement pourquoi la conversion mérite d'être comprise plutôt que d'être traitée comme une boîte noire.

Mis à jour

Ce qui change entre SRT et VTT

  • L'en-tête — Les fichiers WebVTT commencent par la ligne `WEBVTT`, éventuellement suivie d'un titre.
  • Timecodes — SRT écrit `00:00:12,500` avec une virgule avant les millisecondes ; VTT écrit `00:00:12.500` avec un point.
  • Identificateurs de repère — les deux autorisent un nom facultatif au-dessus du repère ; VTT les conserve plus utilement pour les scripts.
  • Codes temporels de fin — requis en SRT ; VTT peut déduire une fin à partir du signal suivant, bien qu'explicite soit plus sûr.
  • Fonctionnalités supplémentaires — VTT ajoute des paramètres de repère tels que la position de la ligne, l'alignement et le balisage du texte.

Style et balisage sûr

WebVTT autorise un ensemble limité de balises à l'intérieur d'un repère — `<b>`, `<i>`, `<u>` et `<c.classname>` pour les classes que vous stylisez avec CSS via `::cue`. Tout le reste est plus susceptible d'être rendu sous forme de texte littéral. C'est également pourquoi la conversion doit conserver un formatage simple lorsqu'il est présent et supprimer ce que le format ne peut pas exprimer, plutôt que d'échapper le balisage entre crochets visibles.

                WEBVTT

00:00:12.500 --> 00:00:15.000 align:start
That was the point.
              

Pourquoi c'est important au-delà de la lecture

Les sous-titres sont une exigence d'accessibilité sur la plupart des plateformes, et ils constituent également du matériel indexé : une piste de texte fournit aux moteurs de recherche et aux assistants un script lisible par machine que l'audio seul ne fournit pas. Un `<track kind="captions">` correctement encodé remplit donc une double fonction : respecter la conformité et donner à la vidéo une présence textuelle qui pourrait autrement lui manquer.

L'encodage est important : servez VTT en UTF-8 avec un jeu de caractères approprié. Un fichier avec des caractères accentués enregistré dans un encodage existant s'affichera sous forme de mojibake dans le lecteur et ressemblera à un bug de conversion plutôt qu'à un bug d'encodage.

Le flux de travail pratique

  1. Convertissez le SRT en VTT et vérifiez le premier et le dernier signal pour les codes temporels corrects.
  2. Enregistrez au format UTF-8 avec l'extension .vtt et servez-le avec un type de contenu texte/vtt où vous contrôlez le serveur.
  3. Référencez-le à partir de l'élément vidéo avec `<track kind="captions" srclang="en" label="English" default>`.
  4. Téléchargez le fichier de sous-titres avec le fichier vidéo afin que les chemins relatifs continuent de fonctionner après le déploiement.

Hors ligne et instantané

Les fichiers de sous-titres sont des documents texte volumineux et souvent des œuvres inédites : le script d’une version de révision ne doit être téléchargé nulle part. Le convertisseur SRT en VTT sur ce site s'exécute dans le navigateur, donc une transcription de deux heures est convertie en une fraction de seconde sans quitter votre ordinateur.

SRT à VTT — questions fréquemment posées

Pourquoi mon lecteur vidéo ignore-t-il mon fichier de sous-titres ?

Presque toujours parce que le fichier est SRT plutôt que WebVTT. HTML5 `<track>` accepte uniquement le VTT. Convertissez en VTT, confirmez que le fichier commence par la ligne WEBVTT, puis vérifiez que les timecodes utilisent des points et non des virgules.

YouTube et d'autres plateformes ont-ils besoin de VTT ?

YouTube accepte les téléchargements SRT et VTT et les convertit en interne, mais la plupart des lecteurs auto-hébergés et chaque élément vidéo HTML5 nécessitent WebVTT. La conversion avant le téléchargement permet de conserver le rendu des sous-titres de la même manière partout.

WebVTT peut-il être stylisé ?

Oui — dans le texte de repère, vous pouvez utiliser les balises grasses, italiques et soulignées ainsi que les étendues de classe, et vous stylisez les classes avec CSS par rapport au pseudo-élément `::cue`. Le positionnement est contrôlé par des paramètres de repère tels que la ligne, la position et l'alignement.

Outils mentionnés dans cet article

Parcourez la liste complète des 19 outils

Plus d'articles à lire

Tous les 19 messages →