自社HP上でMacでもWindowsでも動画を見せたい時

自社ホームページで、動画を載せたい!

そんなニーズが近頃増えてきています。

確かに、文字だけ、画像だけよりも動画でみせたほうが伝わることはあります。

一番手っ取り早い方法はなんといってもYouTube

これに叶うものはありません。

アップも楽々!管理も楽々!変換形式なんて気にしなくてOK!

動画掲載の相談がある場合は、まずYouTubeをオススメしています。

ただ、YouTubeでの掲載が嫌!という会社もあります。

理由は様々ですが、とにかく嫌なのだそうです。

そんな場合、以前はFlashPlayerに変換して掲載していました。

iPhoneが普及するまでは、それで十分だったのです・・・iOSが普及するまでは・・・

現在、iPhone、iPadなどのiOSでも見れるようにするための方法ということで、いくつか検討しており、WindowsでもMacでも見れるフォーマットを探して見ました。

その結果が以下です。

  • MPEG1
    最も古い動画圧縮形式です。圧縮率も悪く、画質も悪いです。
  • avi
    比較的古い形式です。
    ストリーミングには不向きなのと、コーディックを間違うと、見れなくなるので、変換には細心の注意と、テストが必要です。
  • QuickTime
    Appleの動画再生に利用されているが、Windows版も提供されているため、プレーヤーをインストールすれば、MacでもWindowsでも閲覧可能。
    ※プレーヤーがインストールされていないと閲覧が出来ない
  • RealPlayer
    Mac版、Windows版両方のプレーヤーが用意されているが、プレーヤーのインストールが必須。
    ※プレーヤーがインストールされていないと閲覧が出来ない。

これは、あくまでもWindows & Macで見れるというフォーマットなので、スマホとかタブレットまでは見据えてありません。そこまで見据えるとなると、上記のフォーマットでは不十分です。
最終的な結論としては、HTML5の<video>タグです。

ちなみに、HTML5の<video>タグは下記のブラウザバージョン以降でないと利用できません。

  • Internet Explorer 9
  • Firefox 9.0
  • Opera 11.6
  • Chrome 16.0
  • Safari 5.1

IE9以降というのネックだったのですが、なんと来月からもう気にしなくてもいいじゃないですか!

そうです。2014年4月9日にWindowsXPのサポートが切れるのです!

WindowsXPはIE8までしか対応していませんでした。なので、HTMLやCSSもIE8を視野に入れて作成しなければならなかったのです。今日までHTML5の<video>タグを推奨しませんでしたが、今日からは違います!

IE8なんて、もう怖くありません!

IE8以下のエラーなんてもう怖くありません!

だって、WindowsXPを使っている人のほうが悪いんですから!

これからは、ガシガシJSもCSS5もHTML5も使っていけます!

そこで、今後オススメな動画掲載サービスは、コレだ!

html5video.pnghttp://www.videojs.com/

video.jsは、HTML5で組まれたvideoのためのJavascript & CSSライブラリです。

メニューバーの色が変えられたり、大きさが変えられたりコントロールが一式ついてます。

今後、コレ使おう!