インターネットブラウザ毎に異なるプレイヤー
いろいろな場面で動画を扱う機会が増えたような気がします。
インターネット回線も光回線が主流になり、以前のISDNはもちろん、ADSLと比べても回線速度は段違いですね。ダイヤルアップ回線と比べてしまうと夢のような快適さになりました。
データ転送の回線が太くなったので、より大容量のデータのやりとりがしやすくなりました。
弊害として大きな容量のファイルをメール添付してしまって、うまく受信できなかったり、何度トライしても送信できなかったりすることもありますが・・・
インターネット回線の速度の他にもスマートフォンを使って、手軽に動画再生をすることができるようになったことも要因かもしれません。
またスマートフォンやタブレットで映像を撮影して、そのままアップロードできることも要因でしょう。
こういった動画をアップ・閲覧する環境が整ってきたという事もあり、以前よりも活発になっていますね。
そこで動画をホームページへアップしたい！という要望もよく耳にする機会が多くなりました。
youtubeにアップすれば、そのユーザーの動画をチャンネルとして公開する事ができるので、非常にオススメしたい方法です。
アップや削除も簡単にできますし、SNSの共有ボタンも付いているので、プロモーションしやすいと思います。
ですがHTMLタグにもある動画を埋め込む「videoタグ」なんだか気になりませんか？
youtubeのプレイヤーが気に入らない。自分のWEBサーバーで管理したい。そんな方ならvideoタグを使って動画を設置することと思います。
最近の案件で、レスポンシブWEBデザインにして作り直すという案件がありました。
そのWebサイトには動画が掲載されており、その形式はFLV・・・そうFlash動画です・・・
せっかくマルチデバイス対応を施し、スマートフォンやタブレットでも最適化されたレイアウト配置で表示できるのに、動画が再生されないなんて意味がありません。
そこでFLVをmp4に変換し、videoタグを使って掲載することにしました。
設置は簡単で、ファイルをWEBサーバーにアップして、HTMLを書くだけ。
<video controls=”” preload=”” poster=”サムネイル画像”>
<source src=”動画ファイル” type=”video/mp4″>
<img src=”サムネイル画像” alt=””>
</video>
・・・こんな感じですね。
Webページに設置して、ブラウザで確認・・・再生できたので完成！！と思ったところでおかしなボタンを見つけました。
・・・どう見てもダウンロードボタンです・・・
試しにクリックすると、自分のパソコンへ動画ファイルがダウンロードされます。
再生している時点でパソコンの一時ファイルにダウンロードされているわけですが、このボタンを押すと個人のパソコンでいつでも見れるようになってしまいます。
パソコンへダウンロードするという根本は変わりませんが、限定公開したい動画だったり、一時公開したい動画だった場合には致命的なボタンですね。
実際はどれだけ手を尽くしても動画を再生する段階でダウンロードされているので、ファイルを保存する方法はいくつもあるのですが・・・このボタンだとそれほど知識がなくても簡単に元ファイルがダウンロードできるので、意図しない経路で拡散してしまうかもしれません・・・
消す方法はなにかないかと色々と調べていくうちに、どうやらGoogleChromeのみ表示されるらしい記述を見つけたので、他のブラウザで確認してみたところ
ブラウザ毎に若干デザインが異なります。
IEとEdgeは同じMicrosoft製品なので同じ表示になると思っていましたが、微妙に異なります。細かいですね。
やっぱりChrome以外にはダウンロードボタンがありませんね。
部分的に消そうと思ってみても、実用的な方法が見つかりませんでした・・・
コントローラー全体を非表示にする方法はあるのですが、それでは見た人が困惑するはずなので、どうしても避けたいですね。
この「ダウンロード」だけを消す方法は今のところ難しそうです。
ブラウザのアップデート次第で今後の状況は変わると思うので、それまで使用を控える・・・なんてネガティブな方法もありますが、現実的なラインとしてはjQueryなどを使って独自のコントローラーを設置する方法が一番近いのかもしれません。
まとめ
・videoタグを使った動画埋め込みは、インターネットブラウザ毎にプレイヤーが異なる
・GoogleChromeのみ、動画ダウンロードボタンが付いている
・動画ダウンロードボタンのみを非表示にする方法は現実的な方法が見当たらない
・コントローラー全体を非表示にし、jQueryなどを使って独自のコントローラーを作ろう
