１．複数のファイル形式を用意

ブラウザごとに読める動画のファイル形式が違うため、webm形式、mp4形式の動画の2形式のファイルを用意し、下記のソースコードを埋めこむ。

<video poster=”サムネイル画像名” width=”320″ controls> <source type=”video/webm” src=”動画.webm”> <source type=”video/mp4″ src=”動画.mp4″> </video>

２．旧ブラウザへの対応

IE8など、html5非対応のブラウザへの対策として、下記ページで紹介されてたJSをheadタグ内で読み込む http://d.hatena.ne.jp/susan-style/20111205/1323056844 ※自動でFLV形式として再生するスクリプトです。

３．サーバー設定の変更

サーバーの.htaccessに下記1行を追記する。 AddType video/webm .webm ※一部の形式の動画は、サーバのデフォルト設定では再生できないことがあるためです。