SRTをVTTに変換
ブラウザが<track>要素で表示できる字幕はWebVTTだけです。そのため、VLCでは表示されるSRTファイルでも、Webページでは何も表示されません。ここでVTTに変換すれば、同じ字幕をどのHTML5プレーヤーでも表示できます。
字幕変換
またはSRT, VTT, ASS … ファイルをここにドロップ ·
1ファイルあたり最大95 MB· 最大20ファイルまで· 30分後に削除
ファイルは当社のサーバーで処理され、30分後に削除されます。
すべての字幕をこの秒数だけずらします。字幕が早すぎる場合は正の数、遅すぎる場合は負の数(例: -1.5)を指定します。
字幕が映画の進行とともに少しずつずれていく場合は、これと変換後のフレームレートを設定してください。別のビデオリリース向けにタイミングが作られていることを示しています。
字幕を表示する動画のフレームレートです。23.976 → 25の変換で、PAL/NTSCのずれのほとんどが解消します。
時刻情報のないプレーンTXTを入力する場合のみ使用します。各行がこの長さずつ順番に表示されます。必要に応じて、後から字幕エディターで時刻を調整してください。
自動検出でほとんどのファイルに対応できます。アクセント付き文字、キリル文字、アラビア文字が「?」になる場合は、文字コードを手動で選んでください。出力は常にUTF-8です。
デフォルトのASSスタイルで使うフォントです。表示する側のコンピューターにインストールされている必要があります。Arialが最も確実です。
高さ1080ピクセルの動画を基準にしたサイズです。映画では48が一般的です。
このツールの使い方
- 1
.srtファイルをドロップ
字幕ファイルを1つ、または言語ごとに追加します。最大20ファイル、1ファイルあたり95 MBまで対応しています。古い文字コードは自動で検出され、WebVTTで必須のUTF-8に書き換えられます。
- 2
必要ならタイミングを調整
そのまま変換するだけなら設定は変更不要です。動画に対して字幕が早すぎる、または遅すぎる場合は、詳細設定のタイミングをずらすに秒数を入力してください。
- 3
WebVTTに変換
WebVTT (VTT)に変換を押して、.vttファイルをダウンロードします。動画と同じ場所にアップロードしてください。当サイトのコピーは30分後に削除されます。
SRTをアップロードしてWebVTT (VTT)に変換を押します。必須のWEBVTTヘッダー、ピリオド区切りのミリ秒、UTF-8のテキストを備えたファイルが得られ、<track>要素、Video.js、Plyr、学習プラットフォームですぐに使えます。
WebプレーヤーでSRTではなくVTTが必要な理由
SRTは2000年ごろのDVDリッピングの世界から生まれ、デスクトッププレーヤーや編集ソフト、配布用字幕の標準になりました。WebVTTは2010年にWeb向けに設計され、SRTの構文を土台にしています。HTMLの標準で<track>要素の形式になりました。Chrome、Firefox、Safari、EdgeはいずれもWebVTTをネイティブで読み込めますが、trackを通してSRTを読めるブラウザーはありません。
テキストエディターで見るとほとんど同じなので、違いに気づかず戸惑う人が少なくありません。VTTファイルはWEBVTTで始まり、UTF-8でなければならず、SRTの00:01:05,300は00:01:05.300と書きます。さらにVTTには、SRTにない位置指定、スタイル、コメントを持たせられます。そのためSRTからVTTへの変換で失われるものはありませんが、VTTをSRTに変換で戻すとそれらは削除されます。
.vttができたら、下の例のようにページからリンクします。iPhoneの.movのように、ブラウザーで再生できない形式の動画については、MOVをMP4に変換する方法のガイドで解説しています。
<video controls src="lecture.mp4">
<track kind="subtitles" src="lecture.ja.vtt"
srclang="ja" label="日本語" default>
</video>SRTとVTTの違いを徹底比較
| 項目 | SRT | WebVTT |
|---|---|---|
| ファイルの1行目 | キュー番号`1` | `WEBVTT` |
| タイムスタンプ | `00:01:05,300` | `00:01:05.300`（時は省略可） |
| キュー番号 | 必須 | 任意の識別子 |
| 文字コード | 自由（古いコードページが多い） | UTF-8のみ |
| 位置と配置 | 標準化されていない | `line`や`align`などのキュー設定 |
| スタイル | `<i>`、`<b>`、`<u>`、`<font>` | `<i>`、`<b>`、`<u>`、CSSで装飾するクラス |
| サーバー上のMIMEタイプ | `application/x-subrip` | `text/vtt` |
SRT
SubRip字幕
SRTは、2000年ごろに動画から字幕を抽出していた Windows 用の無料プログラム SubRip の字幕形式です。各項目は、番号、開始時刻と終了時刻、字幕テキストからなるプレーンテキストのブロックです。VLC、YouTube、Facebook、動画編集ソフト、スマートテレビなどが対応しており、最も広くサポートされている字幕形式です。書式は基本的なものだけで、位置指定やスタイルの標準はありません。
- 圧縮方式
- –
- 透過
- –
- アニメーション
- –
- 登場時期
- SubRip
VTT
WebVTT字幕
VTTは Web Video Text Tracks 形式で、2010年ごろに WHATWG と W3C が HTML5 動画向けに開発しました。SRTに似ていますが、WEBVTT ヘッダーが加わり、位置指定、スタイル、話者ラベル、メタデータに対応します。ブラウザーは <track> 要素による字幕に使い、配信プラットフォームや YouTube も受け付けます。一部のデスクトッププレーヤーやエディタはSRTを前提としています。
- 圧縮方式
- –
- 透過
- –
- アニメーション
- –
- 登場時期
- 2010 · W3C / WHATWG
HTML5動画はtrack要素を通してWebVTTしか読み込めないため、デスクトッププレーヤー向けのSRT字幕は、Webページに表示する前にVTTへ変換する必要があります。
ブラウザでVTT字幕が表示されない場合
オンラインでは字幕が出るのに、ディスク上のHTMLファイルを開くと出ない
ブラウザーは
file://のページから読み込むトラックをブロックします。ローカルのWebサーバー経由、または実際のサイトで確認してください。別ドメインからトラックを読み込むと、中身が空のままになる
<video>要素にcrossoriginを追加し、.vttを置いているサーバーのCORSヘッダーで自分のサイトを許可してください。サーバーがファイルをtext/plainとして送信している
.vttを
text/vttとして配信するよう設定してください。ほかのタイプを受け付けないプレーヤーもあります。すべての字幕が1秒早く表示される
タイミングをずらすに1などの正の値を入力して再度変換し、ファイルを差し替えてください。
SRTからVTTへの変換に関するよくある質問
字幕変換でファイルのどこが変わりますか？
先頭にWEBVTTの行を追加し、ミリ秒の前のカンマをピリオドに置き換えて、UTF-8で保存します。WebVTTではキュー番号を任意の識別子として残せます。字幕の文章自体は変更されません。
.srtを.vttにリネームするだけで使えますか？
使えません。WEBVTTヘッダーがなく、タイムスタンプがカンマ区切りのままだと、ブラウザーはトラックを拒否するか、すべてのキューを読み飛ばします。ファイルの書き換えが必要ですが、ここなら数秒で終わります。
斜体や太字はそのまま残りますか？
はい、<i>、<b>、<u>は両方の形式で使えます。SRTの<font color>タグにはWebVTTに直接対応するものがありません。WebVTTではCSSのクラスでキューに色を付けるためです。多用している場合は書式タグを削除をオンにしてください。
オンライン講座の配信サービスではどちらの字幕ファイルが必要ですか？
多くの学習プラットフォームやWebプレーヤーはWebVTTに対応しており、SRTも受け付けるところが多くあります。アップロード画面に.vttしか書かれていなければここで変換してください。.srtしか受け付けない場合は、逆変換のVTTをSRTに変換をご利用ください。
字幕を画面の上部に表示できますか？
WebVTTではline:0などのキュー設定で指定できます。変換後にテキストエディターで追記してください。SRTには位置を保存する標準的な方法がないため、変換後のキューは下部の既定位置から始まります。
1本の動画に複数言語の字幕を追加するには？
言語ごとのSRTをそれぞれ変換し、ファイルごとにsrclangとlabelを指定した<track>を1つずつ追加します。視聴者はプレーヤーの字幕メニューから言語を選べます。