HTML5 とは

HTML5 (Hyper Text Markup Language)は Web ページやアプリケーションを構成するために使用される言語で、5 はバージョン 5 のことを指します。今まさに、あなたが目にしているこのウェブページもHTML5 でコーディングされていますが、表面上では分かりません。

以前の HTML ではできなかったこと、難しかったことなどが HTML5 によって解消または簡便化されました。動画配信分野に関しても活用できる機能が追加され、動画配信サイトの HTML5 化が進んでいます。

DPSJ では HTML5 と動画配信を焦点にした無料セミナー(2018 / 02 / 16)を開催いたします。ご興味のある方はぜひお申込みください。

HTML5 化の波

YouTube が創立された 2005 年頃から動画配信サービスが増え始め、当時の多くは Adobe Flash または Microsoft Silverlight (Windows Media)が使用されていました。現在はほとんどの Web ブラウザ(Chrome や FireFox など)が Flash / Silverlight への非対応を発表し、動画コンテンツ配信産業は一気に HTML5 化を進めることになりました。なぜでしょうか?

[ 理由 1 ] HTTP 通信

HTTP を使う以前、Flash / Silverlight は動画の読込を行うために専用ポート(例: RTMP ポート 1935)を使用するため、セキュリティの厳しい環境下では視聴することができませんでした。広く視聴者を獲得する障壁と考えられていました。また、2012 年頃から動画配信サービスに、HTTP 通信を使う ABR (アダプティブ・ビットレート: Adobe (HTTP) Dynamic Streaming、Microsoft Smooth Streaming、Apple HTTP Live Streaming  - 現 HLS)が利用されるようになりました。ABR の普及と共に HTTP を使う動画配信が浸透していき、現在はセキュリティポリシーを崩さずに動画をデリバリーできる HTTP の使用が一般化しました

[ 理由 2 ] プラグイン

Flash / Silverlight は、動画を視聴するプレイヤーのために、ブラウザごとにプラグインをインストールする必要がありました。HTML5 に対応した動画サービスでは、HTML5 対応のブラウザを使うだけで視聴でき、プラグインソフトの脆弱性に対する不安やメンテナンスといった視聴者のストレスが解消されます。

[ 理由 3 ] プレイヤーとレスポンシブ

Flash / Silverlight は、視聴に使用するプレイヤーアプリケーションを開発するか、汎用のフレームワークキット・プレイヤーを使用する必要がありました。開発したプレイヤーも汎用のプレイヤーも、メンテナンスに負担がかかり柔軟性も欠きました。また、現在ウェブサイトで標準的にみられるレスポンシブデザイン(大画面やスマホに対して、1 つのコードで柔軟に表示させる)にも向きませんでした。

[ 理由 4 ] サーバーコスト

Flash / Silverlight には専用の配信サーバーを構築する必要があり、大規模配信となれば冗長化とサーバーライセンス等で高コストになりがちでした。HTML5 + HTTP 通信においては、設備やコストを抑えるノウハウ等を一般的な Web サーバー知識から流用できます。

HTML5 動画プレイヤー

あれ?と思う人もいるかもしれません。HTML5 は標準で Video タグが使えて動画に対応できるのでは…。確かに仕様の違いこそありますが、HTML5 対応のブラウザであれば動画の”再生”は可能です。そうです、再生と停止など基本的な操作しかできません。サービスとして動画を提供するのであれば、やはりプレイヤーの開発をするか、別途 HTML5 対応のプレイヤーを導入する必要があります。

Flash / Silverlight と違う点は、HTML5 という一般的な言語をベースとしており、カスタマイズや各種制御を一般的なウェブ技術(Javascript や CSS など)で扱えるところです。これは大きなアドバンテージです。Flash / Silverlight のコーディングが得意な人より、一般的なウェブコーディングが得意な人のほうが遥かに多いはずです。

HTML5 対応プレイヤーを提供するサービスを紹介します。

THEOplayer

theoplayer.dpsj.co.jp

THEOplayer (ジオ・プレイヤー)はベルギーを拠点にしている Opentelly 社が開発した HTML5 プレイヤーです。特長は動画配信サービスに付加価値をつける豊富な機能を、簡単な HTML コードや Japascript API、SDK 等で柔軟に調整できることです。

使用には若干 HTML や Javascript の知識が必要になりますが、Web サイトのデザインをしている方にとっては難しいものではないでしょう。Web デザイナーにとっては自由度が高く、寧ろ扱いやすいかもしれません。PRO と ENTERPRISE の 2 モデルあり、どちらも業務用に使うために必要な機能を備えています。

JW Player

www.jwplayer.com

JW Player は、HTML5 対応プレイヤーで最も知名度のある製品です。特長はプレイヤー機能を低価格で手に入れられることです。専用の管理ページでビデオコンテンツや広告、視聴分析等の管理を行うことができ、Web 動画やブログの投稿といった基本的な知識があれば使うことはできるのではないでしょうか。

3 種類のモデル STARTER、BUSINESS、ENTERPRISE があり、業務用での使用には BUSINESS または ENTERPRISE がお奨めです。ENTERPRISE はカスタムで機能構成するモデルのため、英語でのやり取りが必要になります。また、基本的にクレジットカード決済のため注意が必要です。

Wowza Player

www.wowza.com/products/player

こちらは補足的な情報です。Wowza Player (ワウザ・プレイヤー)はストリーミングサーバーである Wowza Streaming Engine ユーザーを対象に無償で使用できるプレイヤーアプリケーションです。

主にストリーミング配信環境を構築する際に、配信された動画を確認する目的で提供されています。ですが、簡単かつ基本的な機能は備えてますので、プレイヤーに多くの機能を求めないのであれば十分に HTML5 プレイヤーとして利用可能です。

JW Player THEOplayer
BUSINESS ENTERPRISE PRO ENTERPRISE
価格 低~高
(カスタム)
再生制限 1500 ビデオ カスタム 100,000 再生 / 月 1,000,000 再生 / 月
HLS
MPEG-DASH
ABR
コンテンツ保護: 暗号化 HLS
コンテンツ保護: DRM MPEG-DASH
広告: VAST / VPAID / Google IMA 等

動画配信だけではない ?!

以上のように、動画配信環境がプラグインベースから、オープンな HTML5 へと移行が進んでいます。動画配信だけではなく、 iOS や Android デバイス向けのアプリも HTML ベースに遷移するともいわれています。HTML5 が高度な機能に対応することによって、アプリ開発によってのみ実現されていたことが、HTML5 と CSS の基本的な組み合わせで実現できることが認識されつつあります。

これからは Web ブラウザで開いたページだけでなく、様々なアプリケーションが HTML5 化されていくと考えられます。パソコンやスマーフォンといった情報家電だけでなく、普通の家電で目に触れるインターフェースも HTML 化されていくのかもしれません。