Quantcast
Viewing all articles
Browse latest Browse all 219

YouTube動画をHTML5で再生する方法(スロー・倍速が可能)

Image may be NSFW.
Clik here to view.

Image may be NSFW.
Clik here to view.

すでにご存知の方も多いと思いますが、YouTube動画をHTML5で再生する方法を紹介します。HTML5版はFlashと同等の再生が行えるだけでなく、スロー・倍速再生ができるようになります。

1.HTML5で再生できるようにする

細かい説明は後回しにして、HTML5で再生するための設定は「YouTube HTML5 動画プレーヤー」のページにアクセスします。アカウントを持っていなくても問題ありません。

YouTube HTML5 動画プレーヤー
Image may be NSFW.
Clik here to view.
YouTube HTML5 動画プレーヤー

ページ下にある「HTML5 試用版を有効にする」をクリックします。

Image may be NSFW.
Clik here to view.
YouTube HTML5 動画プレーヤー

「HTML5 試用版が有効になっています。」になれば設定完了です。これでYouTubeの動画がHTML5で再生されます。リンクをもう一度クリックすれば無効にできるので気軽に試せます。

Image may be NSFW.
Clik here to view.
設定完了

以下、Flash版とHTML5版の違いおよびブラウザ対応状況等を示します。自分のWindowsマシンで確認した内容なので、違っていたらすいません。

2.スロー再生・倍速再生

冒頭に書いたとおり、HTML5版は再生速度を変更でき、2倍速~1/4倍速の5段階の切り替えが可能です。ただしブラウザによって対応状況が異なり、再生速度の変更はChrome/IE9/Safariでのみ動作します。

Image may be NSFW.
Clik here to view.
再生速度

3.マウスカーソル

細かいところでは、Flash版では動画部分にカーソルをポイントしてもカーソルの形状は変わりませんが、HTML5版では形状が変わるので、「動画上でクリックできることが分かる」という点でFlash版よりユーザビリティに優れています。

Flash版のカーソル
Image may be NSFW.
Clik here to view.
Flash版のカーソル

HTML5版のカーソル
Image may be NSFW.
Clik here to view.
HTML5版のカーソル

動画上でクリックすれば再生/一時停止の切り替えが行えます(Flash版からの機能ですが)。

4.フルスクリーン

Flash版でお馴染みのフルスクリーン機能は、HTML5版ではブラウザがフルスクリーンオプションに対応していれば、画面全体に表示されます。全画面表示可能なのはChromeだけのようです。F11で元のサイズに戻ります。

フルスクリーン機能対応していない他のブラウザでフルスクリーンにした場合、ブラウザの幅いっぱいに表示されます。この場合はEscキーで元のサイズに戻ります。

5.右クリックメニュー

動画上を右クリックしたときの、それぞれのメニューを掲載しておきます。HTML5版には「新しいウィンドウで開く」がないようです。

Flash版
Image may be NSFW.
Clik here to view.
Flash版

HTML5版
Image may be NSFW.
Clik here to view.
HTML5版

6.ブラウザ別対応状況

YouTube HTML5 動画プレーヤー」の説明では「HTML5の動画タグと、h.264動画コーデックまたはWebM形式(とVP8コーデック)をサポートしているブラウザで使用できます」ということらしいですが、試したところ、主要ブラウザであれば一部の機能を除いてHTML5での再生が可能のようです。

ページ下に対応状況が一発で分かるアイコンが表示されるようになっており、以下はWindowsで各ブラウザの表示を確認したものです。Google Chromeであればすべての機能が動作します。

Firefox8/Opera11
Image may be NSFW.
Clik here to view.
詳細検索オプション

Safari5/IE9
Image may be NSFW.
Clik here to view.
詳細検索オプション

Google Chrome
Image may be NSFW.
Clik here to view.
詳細検索オプション

また、IE6/IE7/IE8についてはGoogle Chrome Frameをインストールすれば対応するようです(動作未確認)。

Windowsで確認した、各ブラウザのHTML5の対応機能は表のとおりです。

ブラウザHTML5再生スロー・倍速フルスクリーン
Google Chrome15
Firefox8××
IE9×
Opera11××
Safari5×

7.その他

YouTube HTML5動画プレーヤー」のページに「WebM形式対応の動画を見つけるには、詳細検索オプションを使用するか、検索URLに&webm=1を追加します」とあります。

すべてWebM形式対応になっていたら記載情報が古いのかもしれませんが、参考までに「詳細検索オプションを使用」は、YouTubeの検索ボックスで検索したあとに表示される「フィルタ」→「WebM」をクリックすることを指していると思われます。

Image may be NSFW.
Clik here to view.
詳細検索オプション

Image may be NSFW.
Clik here to view.

Viewing all articles
Browse latest Browse all 219

Trending Articles