2013 . 09 . 05

YouTubeの埋め込み動画をHTML5を優先するモードに切り替える方法

現在のYouTubeの埋め込みプレーヤーは<iframe>タグを使ってユーザーの視聴環境に適したプレーヤーが自動的に選択されるようになっていますが、ユーザーがFlashに対応している環境であればFlashプレーヤーが優先する仕様になっています。


YouTubeでは現状すべてではありませんがHTML5版の動画も多く流通しており、これらは今のところFlashに対応していない環境ではデフォルトで再生することができますが、一方でFlashに対応している環境ではFlash版が優先されるため通常ではHTML5版で再生はされず、デフォルトでHTML5版が選択されるようにするためには視聴する側の各自でこちらのページよりHTML5試用版を有効にする必要があります。


しかし、以下のように「html5」パラメーターを追加することでユーザーの環境や設定に関わらずHTML5版優先の埋め込みにすることが可能です。


<iframe width="560" height="315" src="//www.youtube.com/embed/uBZpy7EyQwE" frameborder="0" allowfullscreen></iframe>
          ↓
          ↓
<iframe width="560" height="315" src="//www.youtube.com/embed/uBZpy7EyQwE?html5=1" frameborder="0" allowfullscreen></iframe>

値には「1」をセットし、上の例では先頭のパラメーターになるので手前のURLに「?」で繋いでやって「?html5=1」が付け足されるかたちとなります。


埋め込み結果 ↓

なお、HTML5版の動画が存在しない動画の場合にはパラメーターを追加したとしてもFlash版の動画が再生されることになります。

また、HTML5版優先の動画ページへのリンクは同様に「html5」パラメーターを使って以下のようにしてやります。


http://www.youtube.com/watch?v=uBZpy7EyQwE
          ↓
          ↓
http://www.youtube.com/watch?v=uBZpy7EyQwE&html5=1

この場合には先頭のパラメーターではないので「&」を使って「&html5=1」となります。

また、この場合も同様にHTML5版の動画が存在しない動画の場合にはFlash版の動画が再生されることになります。

ちなみに随分前に書いた記事では「&html5=True」と紹介しましたが、こちらも値としてはまだ使えるようです。


さて、現在ではほとんどのブラウザでHTML5の動画に対応しており大抵のユーザーはHTML5版の動画が視聴可能な中、某かの理由でできればHTML5版の動画で再生させたいという場合の手段として使える方法です。