Générer un élément HTML track
Ou collez le texte d'un sous-titre
Options
Les sous-titres s'adressent aux spectateurs qui entendent l'audio et ont besoin des mots — une traduction, ou la même langue écrite. Les sous-titres pour sourds et malentendants s'adressent à ceux qui ne l'entendent pas : ils portent aussi ce que le son dit aux autres, musique, porte, téléphone qui sonne. Le même fichier peut servir l'un ou l'autre, raison pour laquelle la page demande au lieu de deviner, et la valeur ne peut plus être changée ensuite depuis l'élément. Descriptions, chapitres et métadonnées ne sont pas proposés : aucun ne peut être rempli avec le contenu d'un fichier de sous-titres.
Une étiquette de langue courte comme en, en-GB ou pt-BR, nommant la langue des mots des sous-titres, et non celle de la vidéo. Une piste qui se déclare « sous-titres » doit nommer une langue : vider ce cadre revient donc à en plutôt qu'à supprimer l'attribut — et comme chaque attribut est imprimé dans la sortie, vous voyez la valeur de repli avant même de coller quoi que ce soit.
Texte libre : Français, Français (SME), English. C'est la ligne que choisit un spectateur quand une page propose plusieurs pistes : écrivez-la comme votre public la reconnaîtrait. Vider le cadre supprime entièrement l'attribut plutôt que d'écrire un attribut vide, ce qui rend la dénomination au lecteur ; une étiquette vide mettrait une ligne sans nom dans ce menu.
Activé, les sous-titres apparaissent dès que la vidéo démarre. Un élément média ne peut avoir qu'une seule piste par défaut : laissez-le désactivé quand la page en porte déjà une. Une deuxième piste qui se dit par défaut fait choisir la mauvaise aux lecteurs, tandis que ne pas être par défaut signifie seulement que le spectateur l'active lui-même.
La fréquence d'images dans laquelle les temps sont comptés. Sur les pages de format, c'est ce dont MicroDVD a besoin, car il stocke les temps sous forme de numéros d'image. Sur les pages de fréquence d'images, c'est la cadence à laquelle le fichier a été minuté — la version pour laquelle les sous-titres ont été faits — et le second cadre de la page prend la cadence de la vidéo avec laquelle vous allez les utiliser. 23,976, 24, 25, 29,97, 30, 50, 59,94 et 60 sont les valeurs courantes. Se tromper décale toute la chronologie et, sur les pages de fréquence d'images, ce décalage est un rapport, pas un montant fixe.
Cette page place vos sous-titres dans une seule balise <track> que vous pouvez coller dans une page. La sortie est une ligne unique, avec la piste WebVTT intégrée dans son attribut src : le texte des sous-titres voyage donc avec le balisage lui-même, sans second fichier à téléverser, sans chemin à corriger et sans risque qu'un lecteur cherche quelque chose qui n'est pas là.
Cette intégration est tout l'objet de la page, et la raison tient à la façon dont les navigateurs traitent les fichiers locaux. Une piste est récupérée par le navigateur plutôt qu'affichée directement, et il refuse cette récupération quand la page a été ouverte depuis un disque : une balise <track src="film.vtt"> sur une page enregistrée sur votre bureau n'affiche rien du tout — aucune erreur à l'écran, un menu de sous-titres vide, et une ligne dans la console que la plupart des gens n'ouvrent jamais. Une URI data n'est jamais récupérée, puisque le texte est déjà dans l'attribut, et fonctionne donc dans ce cas. Le prix est la taille, chaque espace et chaque retour à la ligne du WebVTT devenant trois caractères, mais ce prix est justifié ici : la balise existe pour fonctionner toute seule.
Les attributs viennent des champs du panneau, car aucun ne peut être lu dans votre fichier. kind est le plus important : subtitles est une traduction destinée aux spectateurs qui ne suivent pas la langue audio, et captions la version plus complète qui porte aussi la musique et les effets sonores pour ceux qui n'entendent pas. Un fichier rempli de [porte claque] et de notes de musique peut relever des deux, et vous seul savez à quel public il était destiné : la page demande donc au lieu de deviner. Les trois autres attributs sont la langue du texte, le nom affiché dans le menu du lecteur et l'ouverture automatique de la piste.
Deux de ces champs se comportent différemment quand on les vide. Effacer le nom de menu retire l'attribut, car un libellé est facultatif et son absence remet simplement le choix au lecteur. Vider le champ de langue ne le retire pas : une piste qui se déclare comme sous-titres doit nommer une langue, donc un champ vide retombe sur en plutôt que de produire une balise à laquelle manque une information obligatoire. Ni l'un ni l'autre n'est une substitution silencieuse : la sortie imprime chaque attribut, et vous voyez ce que vos champs ont produit.
Le texte des sous-titres à l'intérieur de la balise est écrit par le même générateur WebVTT que les pages de conversion, si bien qu'un fichier arrivé en WebVTT conserve tout ce qu'il portait hors de ses blocs : le texte de la ligne WEBVTT, les blocs de commentaire et de style, et les réglages par bloc qui décident où se place une ligne à l'écran. Rien dans votre fichier n'est modifié, et rien n'est envoyé : les mots, les temps et le style repartent dans l'état où ils sont arrivés.
Exemples
Un fichier SRT, avec les champs par défaut
Entrée
1
00:00:01,000 --> 00:00:03,000
The room is dark.
2
00:00:04,000 --> 00:00:06,000
Nobody came.
Sortie
<track kind="subtitles" src="data:text/vtt;charset=utf-8,WEBVTT%0A%0A1%0A00%3A00%3A01.000%20--%3E%2000%3A00%3A03.000%0AThe%20room%20is%20dark.%0A%0A2%0A00%3A00%3A04.000%20--%3E%2000%3A00%3A06.000%0ANobody%20came.%0A" srclang="en" label="English" default>
Une seule ligne en sortie, et tout le fichier tient dedans : %0A est un retour à la ligne et %20 un espace, donc le WebVTT voyage dans l'attribut src au lieu de résider dans un fichier à côté de la page. Les quatre attributs correspondent aux quatre champs — la langue du texte, la ligne que le spectateur choisit dans le menu du lecteur, et default, qui fait ouvrir cette piste d'elle-même. Les numéros de bloc du SRT sont conservés comme identifiants de bloc.
Un fichier WebVTT repart en WebVTT identique
Entrée
WEBVTT - exported from the editing room
NOTE The first pass was done by hand.
STYLE
::cue { color: #f2f2f2; }
intro
00:00:01.000 --> 00:00:03.000 align:start position:10%
The room is dark.
2
00:00:04.000 --> 00:00:06.000
Nobody came.
Sortie
<track kind="subtitles" src="data:text/vtt;charset=utf-8,WEBVTT%20-%20exported%20from%20the%20editing%20room%0A%0ANOTE%20The%20first%20pass%20was%20done%20by%20hand.%0A%0ASTYLE%0A%3A%3Acue%20%7B%20color%3A%20%23f2f2f2%3B%20%7D%0A%0Aintro%0A00%3A00%3A01.000%20--%3E%2000%3A00%3A03.000%20align%3Astart%20position%3A10%25%0AThe%20room%20is%20dark.%0A%0A2%0A00%3A00%3A04.000%20--%3E%2000%3A00%3A06.000%0ANobody%20came.%0A" srclang="en-GB" label="English (UK)" default>
Tout ce qu'un fichier WebVTT contient hors de ses blocs survit : la remarque sur la ligne WEBVTT, le bloc NOTE, le bloc STYLE qui décide de l'apparence des sous-titres dans le lecteur, la ligne de nom du bloc, et le réglage align:start position:10% (le %25 qui s'y trouve est un signe pourcent, encodé parce qu'un pourcent nu n'est pas permis dans une URI). Un fichier arrivé en WebVTT repart en ce même WebVTT. Les deux champs disent en-GB et English (UK), parce que cette copie a été faite pour un public britannique : rien dans le fichier ne le disait.
Des sous-titres pour des spectateurs qui n'entendent pas
Entrée
1
00:00:01,000 --> 00:00:03,000
[door slams]
The room is dark.
2
00:00:04,000 --> 00:00:06,000
♪ Nobody came ♪
Sortie
<track kind="captions" src="data:text/vtt;charset=utf-8,WEBVTT%0A%0A1%0A00%3A00%3A01.000%20--%3E%2000%3A00%3A03.000%0A%5Bdoor%20slams%5D%0AThe%20room%20is%20dark.%0A%0A2%0A00%3A00%3A04.000%20--%3E%2000%3A00%3A06.000%0A%E2%99%AA%20Nobody%20came%20%E2%99%AA%0A" srclang="en" label="Tom & "the boss"" default>
Le fichier est rempli d'effets sonores et de musique, ce qui est exactement l'usage de kind="captions" — des sous-titres pour les spectateurs qui n'entendent pas — et seul le champ peut le dire. Séparément, le nom de menu saisi Tom & "the boss" ressort en Tom & "the boss" : un guillemet non échappé aurait fermé l'attribut à cet endroit et transformé la fin du nom en attributs incompréhensibles sur la balise.
Trois champs vidés ou désactivés
Entrée
1
00:00:01,000 --> 00:00:03,000
A cold night,
and no heating.
2
00:00:04,000 --> 00:00:06,000
Every night this week?
Sortie
<track kind="subtitles" src="data:text/vtt;charset=utf-8,WEBVTT%0A%0A1%0A00%3A00%3A01.000%20--%3E%2000%3A00%3A03.000%0AA%20cold%20night%2C%0Aand%20no%20heating.%0A%0A2%0A00%3A00%3A04.000%20--%3E%2000%3A00%3A06.000%0AEvery%20night%20this%20week%3F%0A" srclang="en">
Trois champs modifiés, trois résultats différents, parce que la spécification demande des choses différentes. Le nom de menu disparaît complètement de la balise : il est facultatif, et son absence remet la décision au lecteur. Le champ de langue est vide et produit tout de même srclang="en" : une piste déclarée comme sous-titres doit nommer une langue, une langue vide n'existe donc pas, et la valeur de repli est visible dans la sortie. L'interrupteur default est désactivé et l'attribut disparaît aussi : cette piste ne s'ouvrira pas d'elle-même, ce qui est le choix sûr quand une page en porte plusieurs.
Questions fréquentes
Ai-je encore besoin d'un fichier .vtt à côté de ma page ?
Non, et c'est l'intérêt de la page. Le WebVTT est écrit dans l'attribut src sous forme d'URI data, donc la balise porte ses propres sous-titres. Vous pouvez la coller dans une page, envoyer le fichier ou le déplacer dans un autre dossier, et les sous-titres apparaissent toujours. Le seul point d'attention est que tout tient dans un seul attribut : si vous ne copiez qu'une partie de cette longue ligne, vous avez cassé l'URI et la piste sera vide.
Cela fonctionne-t-il si j'ouvre simplement le fichier depuis mon ordinateur ?
Oui, et c'est ce cas qui justifie l'intégration des sous-titres. Quand une page est ouverte depuis un disque, un navigateur refuse de récupérer un fichier de piste séparé : une piste pointant vers film.vtt n'afficherait rien, sans erreur visible, juste un menu de sous-titres vide. Une URI data n'est pas récupérée du tout, le texte est déjà dans l'attribut, et elle fonctionne donc de la même façon sur votre bureau que sur un serveur.
Pourquoi la sortie est-elle tellement plus longue que mon fichier de sous-titres ?
Parce que chaque caractère qui n'est ni une lettre ni un chiffre devient trois caractères dans une URI : un espace devient %20 et un retour à la ligne %0A. Un fichier de cent kilo-octets devient quelques centaines de kilo-octets. Le base64 serait plus court, environ un tiers de plus que l'original plutôt que le double, mais le résultat serait un mur de caractères illisibles ; en l'état, vous pouvez lire l'attribut src et reconnaître votre dialogue, ce qui vaut la taille supplémentaire pour un fichier que vous allez coller dans une page et maintenir à la main.
Pourquoi l'attribut label a-t-il disparu après avoir vidé le champ ?
Parce qu'un nom de menu est facultatif : son absence ne signifie pas « pas de nom », elle signifie que le lecteur décide quoi afficher dans son menu de sous-titres, généralement la langue. Vider le champ retire donc l'attribut au lieu d'écrire un attribut vide, car label="" apparaîtrait comme une ligne blanche dans ce menu. Vous pouvez remettre un nom à tout moment : c'est une simple chaîne, et rien d'autre sur la page n'en dépend.
Quelle différence y a-t-il entre subtitles et captions ici ?
Le public visé. Subtitles suppose que le spectateur entend l'audio et a besoin des paroles traduites ou explicitées ; captions suppose qu'il ne l'entend pas, et porte donc aussi les informations que le son transmet à une audience entendante — musique, portes, téléphone qui sonne. Un fichier peut servir l'un ou l'autre, et le même texte est dans les deux cas, donc la page ne peut pas deviner lequel vous voulez. Le choix ne peut pas être changé plus tard dans la balise : sélectionnez celui dont votre public a besoin.
Quels autres types de piste avez-vous laissés de côté ?
Trois : descriptions, qui racontent l'image aux spectateurs qui ne voient pas ; chapters, qui relève de la navigation plutôt que des sous-titres et possède sa propre page sur ce site ; et metadata, qui n'est montré à personne. Aucun des trois ne peut être rempli avec le contenu d'un fichier de sous-titres, donc les proposer permettrait seulement de construire une balise qui n'affiche rien. Les deux proposés sont ceux qu'un fichier de sous-titres peut réellement servir.
Quelque chose change-t-il dans mes sous-titres à l'entrée ?
Le texte, les temps et le style sont inchangés, et un fichier WebVTT conserve ses propres blocs de commentaire, de style et de région ainsi que ses réglages par bloc. Ce qui change est la forme : les lignes sont réécrites en syntaxe WebVTT, que les lecteurs comprennent, donc la virgule d'un SRT dans 00:00:01,000 devient un point. Un octet est retiré volontairement : le marqueur initial qui déclare le fichier en UTF-8, parce que l'URI data indique elle-même l'encodage et que ce marqueur apparaîtrait sinon comme trois caractères parasites au début.