MB-Support

パソコン初心者のサポートページ

15.YouTube の埋め込みプレイヤーで HD 画質


YouTube に縦幅 720 を超える解像度のムービーをアップロードすると、通常画質、高解像度画質の他に、HD 表示で再生可能になります。 解像度 1280 × 720 のムービーをフル HD 液晶で最大表示しても、ぎりぎり満足できると言いましょうか、HD 表示が登場した事で、それまでの高解像度表示が視聴に堪えられないと感じるのかは不明なところ。 すでにノーマルの 19 インチ液層を使っている場合、十分の環境とも思えますが、時代はフル HD へと向かいます。

YouTubeがHD画質に対応

さて、多くの動画共有サイトは、アップロードしたユーザーの許可があれば、自分のサイトにその動画を埋め込む事が許されています。 そのコードは公開されており、わざわざ動画がアップロードされたサイトに別ウインドウで誘導しなくても、自分のサイトにプレイヤーが表示され、視聴してもらう事ができます。

埋め込みプレイヤーの進化は、動画共有サイトより遅れるのが一般的で、埋め込みプレイヤーの高解像度への対応は、すでに昨年の 3 月には可能であったと思われます。

YouTubeで動画の再生画質を指定可能に

それは、YouTube の公式ブログで埋め込まれたプレイヤーで確認できましたが、やり方が分かりませんでした。

YouTube 動画を高画質で – YouTube 日本公式ブログ

このブログに埋め込まれたプレイヤーは、最大表示ができませんが、一般的に埋め込み可能なプレイヤーは最大表示可能です(このページの下の方に、そのボタンの表示、非表示方法を説明します)。また、プレイヤーサイズもワイドが登場していなかった時なので、旧式のものであるにも関わらず、解像度が向上しています。



コードの取得方法は、その動画の単独ページにアクセスして、右の「埋込み」と表示されたURLを左クリックすれば、そのURLが選択された状態になります。ここで、右クリック→「コピー」か、キーボードの「Ctrl」+「C」キーを押してコピーして、自分のサイトに貼り付ければ完了。 URL の右にある「カスタマイズ」ボタンを左クリックすると、動画の視聴が完了した時に関連する動画を表示するか否か、境界線の表示、プレイヤーの色、プレイヤーのサイズを変更できます。



ノーマルの埋め込みコード

<object width="640" height="385">
<param name="movie" 
value="http://www.youtube.com/v/ビデオID&hl=ja&fs=1&rel=0"></param>
<param name="allowFullScreen" value="true">
</param><param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/ビデオID&hl=ja&fs=1"
 type="application/x-shockwave-flash" allowscriptaccess="always"
  allowfullscreen="true" width="640" height="385"></embed></object>

画質を指定するコード

&ap=%2526fmt%3D22

%3D に続く数字が画質、HD 画質の場合は「22」となります。

<object width="640" height="385">
<param name="movie" 
value="http://www.youtube.com/v/ビデオID&hl=ja&fs=1&rel=0"></param>
<param name="allowFullScreen" value="true">
</param><param name="allowscriptaccess" value="always"></param>
<embed src="
http://www.youtube.com/v/ビデオID&hl=ja&fs=1&ap=%2526fmt%3D22"
 type="application/x-shockwave-flash" allowscriptaccess="always"
  allowfullscreen="true" width="640" height="385"></embed></object>

YouTube プレイヤーの画質 サンプル



プレイヤーのサイズに依存せず、HD 表示で再生可能となり、フルHD対応液晶で全画面表示しても、現状では最も満足ができる画質となります。 ただし、HD 表示の条件に満たないムービーではファイルが存在していないので、無効なビデオと表示されます。 また、HD 表示で再生するためには、インターネットの通信速度と、それを再生可能なパソコンの性能が必要となります。 通信速度が遅い場合、再生が止まりますが、全てがバッファされるまで待てば、通常再生が可能となります。 パソコンの性能が満たない場合は、バッファを利用してもなめらかな再生は不可能となり、画質を下げるしかありません。




ついでに、プレイヤーの説明です

プレイヤーサイズ width=height=

プレイヤーサイズは、ムービー単独表示の右で、「カスタマイズ」ボタンをクリックすると、選択可能になります。 このサイズは、アップロードされた動画の解像度により異なるみたいです。

YouTube プレイヤーのノーマルサイズ サンプル

YouTube プレイヤーのHD表示サイズ サンプル



最大表示のボタンの表示 fs=

&fs=0 非表示 &fs=1 表示

例えば、ページデザインの都合でプレイヤーサイズを大きくできなくても、HD 画質を発揮する事ができます。 HD 画質で埋め込まれているのであれば、そのプレイヤーサイズで視聴してもらうだけではなく、クライアントが利用している画面で最大表示が可能となります。 気軽に見てもらうには、視聴しやすいプレイヤーサイズがスマートですが、情報を提示する意味ではプレイヤーサイズはさして重要ではなく、最大表示が可能なボタンと埋め込まれたムービーの画質かと思われます。



関連するムービーを表示する rel=

&rel=0 非表示 &rel=1 表示

&rel=0 の場合、関連するムービーの表示を拒否できます。このムービーサムネイルが表示される場所は、他のコードと関連しますが、一般的はムービーの再生が終了した時、ムービーにポインターを移動した時、コントロールバーで情報を表示した時になります(右下の三角ボタン)。



カーソルがプレイヤーに重なった時の動作 egm=

&egm=0 非表示 &egm=1 表示

Rel で 1 を指定した場合、Egn で 1 を指定すると、カーソルがプレイヤーに重なった時に、ムービーを再生した状態を維持しながら、下部に関連ムービーのサムネイル、上部に検索フォーム( showsearch=1 を指定したのみ )が表示されます。



プレイヤーの枠 border=

&border=0 非表示 &border=1 表示

プレイヤーの枠を表示させた場合、color1で色を選択できます。



プレイヤーの枠の色 color1=

&color1=色 

color1 カラー #800000 の場合、color1=800000 と指定します。枠の色は下の Color2 で指定された色も組み合わされて表示されます。 右のサンプルは、次に説明するコントロールバーの色がデフォルトの灰色で、枠の色に 800000 を指定しました。 枠にも、灰色の部分があり、ここがコントロールバーの色を指定する color2 で指定した色が表示されます。



コントロールバーの色 color2=

&color2=色 

Color2 カラー #800000 の場合、color2=800000 と指定します。右のサンプルでは枠の色をデフォルトの灰色にしています。



検索フォーム showsearch=

&showsearch=0 非表示 &showsearch=1 表示 

動作は変更される可能性がありますが、現時点では Egm=1 の状態でムービー再生後と、プレイヤーにカーソルが重なった時に上部に検索フォームが表示されます。



オートプレイ autoplay=

&autoplay=0 実行しない &autoplay=1 実行 

プレイヤーが表示された時に、自動的にムービーを再生させる場合は「1」を指定します。ページの下部にプレイヤーを表示する場合、クライアントが視聴しているとは限りません。 何も指定しない場合は、クライアントが自ら再生ボタンを押す事で、ムービーを視聴する仕様となります。



以上の設定を挿入する場所は、HD 画質を指定する「&ap=%2526fmt%3D22」を埋め込んだ場所と同じです。 例えば、枠の色とコントロールバーの色を指定する場合

&color1=000000&color2=800000&ap=%2526fmt%3D22

となり、&でつなぐ事ができます。各「=」に続く値が無い場合。

&color1=&color2=800000&ap=%2526fmt%3D22

color1 はデフォルトになります。もしくは、挿入しなくても同じです。

&color2=800000&ap=%2526fmt%3D22



戻る 一覧表示 次へ


BTOパソコン・ゲームPC・自作パソコンなら【TSUKUMO】 - 自作PCに必要なパーツ、豊富な品揃え

Copyright © 2013 MB-Support パソコン初心者のサポートページ All Rights Reserved.

管理人サイト閲覧方法プライバシーポリシー著作権/免責事項