Converte legendas WebVTT numa transcrição HTML autónoma

Um ficheiro WebVTT (.vtt) começa com um cabeçalho literal WEBVTT, e depois lista as legendas como um intervalo de código de tempo seguido de uma ou duas linhas de texto de legenda. É o formato que a maioria das plataformas de reuniões, incluindo o Zoom, o Microsoft Teams e as legendas automáticas do YouTube, exporta quando descarregas uma transcrição; é construído para sincronizar legendas com vídeo, não para funcionar por si só como uma página web legível.

O conversor de VTT para HTML do SubToolDesk analisa o cabeçalho WEBVTT e os blocos de legenda localmente no teu navegador, descarta o cabeçalho, os códigos de tempo e quaisquer etiquetas de voz, reconstrói os fragmentos em parágrafos naturais, e envolve o resultado num documento HTML mínimo e válido com uma etiqueta <p> por parágrafo, pronto para abrir diretamente num navegador, alojar num servidor, ou inserir num site estático.

Como converter VTT para HTML (passo a passo)

• Arrasta o teu ficheiro .vtt para o conversor acima, ou clica em “Carregar ficheiro” para o procurares.
• Confirma que a etiqueta de formato detetado automaticamente mostra VTT.
• Deixa Unir em parágrafos ativado para obteres prosa fluida, ou desativa para manter uma legenda por linha.
• Ativa Remover etiquetas de orador se a tua exportação de reunião etiquetar cada linha com um nome (comum no Zoom e no Teams).
• Pressiona Descarregar para guardar um ficheiro .html autónomo.

Porquê converter WebVTT para HTML

Um ficheiro .vtt é construído para sincronizar legendas com um leitor de vídeo, não para funcionar por si só como uma página web. Transformá-lo em HTML é quase sempre sobre o que a transcrição precisa de fazer a seguir:

• Publicar a transcrição de uma reunião do Zoom ou do Teams como página de wiki interna para a qual a tua equipa possa criar ligações, pesquisar e ler sem reabrir a gravação.
• Inserir as legendas de uma sessão de formação num site de documentação como página autónoma, sem nenhum passo de compilação extra.
• Partilhar uma transcrição como ligação em vez de um ficheiro anexo .vtt, que a maioria das pessoas não saberia como abrir com sentido.
• Dar estilo à transcrição para corresponder a uma intranet ou a um site, já que etiquetas <p> semânticas e simples aceitam uma folha de estilos; o VTT em bruto não.
• Tornar o conteúdo de um vídeo legendado rastreável e acessível como a sua própria página legível para quem preferir ler em vez de ver.
• Arquivar a transcrição de uma reunião como página que continua a abrir corretamente em qualquer navegador muito depois de a própria gravação já não existir.

O que contém exatamente o ficheiro HTML

É um documento HTML completo e mínimo: uma declaração <!DOCTYPE html>, um <head> com uma codificação UTF-8 e um título de página, e um <body> que contém um elemento <p> por parágrafo. Nem o cabeçalho WEBVTT, nem as etiquetas de voz, nem as definições de legenda sobrevivem no resultado, apenas marcação semântica que podes abrir tal como está ou colar numa página maior e estilizar com o teu próprio CSS.

Antes e depois: um exemplo real

Uma breve exportação ao estilo Zoom, com etiquetas de voz, definições de legenda, um bloco NOTE e tudo o resto, convertida com Unir em parágrafos, Remover etiquetas de orador e Remover etiquetas de formatação todos ativados (o estado predefinido nesta página):

WEBVTT

NOTE
Transcrição gerada pelo Zoom

00:00:01.200 --> 00:00:03.900 align:start position:10%
<v Jordan>Olá a todos, obrigado por se juntarem hoje à chamada.

00:00:03.900 --> 00:00:06.450
<v Priya>Claro! Vamos começar.

00:00:06.450 --> 00:00:09.800
<v Jordan>Ótimo, então o primeiro ponto da agenda é o roteiro do terceiro trimestre.

<!DOCTYPE html>
<html lang="pt">
<head>
<meta charset="UTF-8">
<title>Transcrição</title>
</head>
<body>
<p>Olá a todos, obrigado por se juntarem hoje à chamada. Claro! Vamos começar. Ótimo, então o primeiro ponto da agenda é o roteiro do terceiro trimestre.</p>
</body>
</html>

O cabeçalho WEBVTT, o bloco NOTE, cada linha de marca de tempo e definição de legenda, e ambas as etiquetas de voz <v Jordan> desapareceram. O que resta é marcação válida e mínima, com o diálogo falado envolvido num único elemento <p>, pronto para abrir em qualquer navegador.

Porquê HTML em vez de texto simples?

Um ficheiro de texto simples precisa de outra aplicação para abrir com sentido; um ficheiro HTML abre diretamente em qualquer navegador já com o espaçamento de parágrafos correto. Isso importa quando a transcrição de uma reunião ou de uma entrevista precisa de viver na web, por exemplo, publicada numa wiki interna, num site de documentação, ou partilhada como ligação em vez de como ficheiro anexo.

Privacidade pela arquitetura, não por política

A transcrição de uma reunião é muitas vezes o ficheiro mais sensível da sala. A análise do VTT e a construção do ficheiro HTML acontecem ambas em JavaScript a correr no separador do teu navegador. Não existe nenhum ponto de carregamento para onde esta funcionalidade pudesse enviar algo.

Casos de uso comuns para VTT a HTML

• Páginas de wiki interna: publica a transcrição de uma reunião do Zoom ou do Teams como uma página para a qual a tua equipa possa criar ligações, pesquisar e ler sem abrir a gravação original.
• Sites de documentação: transforma as legendas de uma sessão de formação gravada numa página HTML autónoma que se insere na pasta de conteúdo de um gerador de sites estáticos.
• Arquivos públicos de transcrições: oferece uma transcrição HTML legível e rastreável junto a um vídeo publicado, por motivos de SEO e de acessibilidade.
• Visualização local rápida: abre o ficheiro descarregado diretamente a partir do teu sistema de ficheiros em qualquer navegador, sem necessidade de servidor.

Casos limite que o analisador trata

O analisador descarta o cabeçalho WEBVTT e ignora os blocos de metadados NOTE, STYLE, e REGION que algumas exportações incluem. Carateres que de outra forma quebrariam um HTML válido, como um &, <, ou > literal deixado no texto de diálogo já limpo, são escapados automaticamente para que o resultado seja sempre marcação válida.

O que este conversor preserva e remove

Preservado:

• Cada palavra do texto falado, pela ordem e pontuação originais.
• A estrutura em parágrafos, agora como elementos <p> reais, seja um por legenda original, seja parágrafos baseados em frases se Unir em parágrafos estiver ativado.
• Um documento HTML válido e completo, com doctype, cabeçalho UTF-8 e corpo, para que o ficheiro abra corretamente em qualquer navegador.

Removido:

• A linha de cabeçalho WEBVTT e os blocos de metadados NOTE, STYLE e REGION.
• As linhas de identificador de legenda, todos os intervalos de marca de tempo, e definições de legenda como align:start position:10%.
• Etiquetas de voz como <v Nome do Orador>, quando Remover etiquetas de formatação está ativado.
• Prefixos de orador em texto simples como Jordan:, quando Remover etiquetas de orador está ativado.
• Qualquer CSS, script, ou estilo; nenhum é adicionado, e nenhum é mantido a partir da origem.

Problemas comuns e como resolvê-los

• O ficheiro descarregado mostra marcas de tempo ou setas -->: confirma que a etiqueta de formato acima do conversor mostra VTT, e não Unknown; uma colagem mal truncada pode quebrar a deteção de legendas.
• As etiquetas <v Nome do Orador> continuam visíveis dentro dos parágrafos: ativa Remover etiquetas de formatação, só está desativado se o tiveres alterado.
• Nomes em texto simples como Jordan: continuam antepostos às linhas dentro do HTML: é um interruptor diferente, Remover etiquetas de orador, ativa-o também, já que deteta um padrão diferente do das etiquetas de voz acima.
• A transcrição inteira aparece como um único parágrafo: é esperado quando muitas legendas curtas e frequentes se juntam; desativa Unir em parágrafos para obter um <p> por cada legenda original.
• Letras acentuadas ou texto não inglês aparecem como caracteres estranhos tipo é: o .vtt de origem não foi guardado como UTF-8; volta a exportá-lo ou a guardá-lo como UTF-8 e carrega-o novamente.
• Queres que a transcrição corresponda ao aspeto do teu site: o conversor não adiciona CSS por design; adiciona um <link> para a tua própria folha de estilos no <head>, ou cola os parágrafos <p> numa página existente.

O que esta ferramenta intencionalmente não faz

Não vai adicionar estilos CSS, um modelo de layout, ou elementos de marca; o resultado é deliberadamente mínimo para que se integre de forma limpa no site ou na folha de estilos que já tenhas. Também não corrige erros de transcrição já presentes no ficheiro de legendas de origem; reformata e envolve o que já lá está, não o reescreve.