video・audio要素を使って気がついたこと

はじめてvideo・audio要素を使うことがあったので、その時に気がついたことをまとめます。

なぜaudio要素を使ったか?

披露宴のお手伝いでBGMのお手伝いをすることになりました。
その時に打ち合わせの時間がほとんどなっかたため、各プログラムに対応する曲や動画を間違えないような方法を考えていました。
はじめはパワーポイントを使う予定でしたが、予備用のパソコンで使うときにパワーポイントのバージョンの違いやファイルの位置等が気になったので、htmlで管理してみることにしました。
なお、onepage-scroll.jsを使用して全体で1ページの構成にしました。

ブラウザについて

今回はローカルで動作させます。chrome系のブラウザはローカルのファイルを読んでくれないため、その他のブラウザを使います。
ちなみにIEfirefoxではプレーヤーのデザインに若干の差があります。

気づいたこと

特に動画の形式はブラウザごとに注意が必要。
h264/aacのmp4が良さそうな感じ。ogg形式を使おうと思ったらIEでは再生できませんでした。

音声はビットレートの方式に注意。可変ビットレート(vbr)では再生時間が正しく表示されないので、固定ビットレート(cbr)にしておきましょう。形式はmp3でOK。