この記事では、セールスプレゼン動画(動画セールスレター)用のランディングページを作成する方法をお伝えします。動画の埋め込み。動画のコントローラーやキャプションなどのカスタマイズ。ウェブページ上の決済ボタンの表示方法などをお伝えします。
動画を YouTube に公開する方法
ウェブ上で動画を再生できるように、サーバーなどに動画をアップロードします。サーバーにアップロードした場合は動画プレーヤーなどを設置する必要があり手間なので、今回は YouTube を使いたいと思います。
YouTube へのアップロードは簡単です。
1.右上の【アップロード】をクリックします
現在(2014.9)の YouTube は、右上のメニューバーに【アップロード】というボタンがあるのでクリックします。
2.動画をドロップするか、ファイルを選択してアップロードします
アップロード画面に切り替わります。動画ファイルをドラッグ&ドロップでこの位置に持ってくるとアップロードできます。上矢印のアイコンをクリックするとローカル上のファイルを選択することができます。アップロードには数分かかります。
3.設定画面に移行するので、設定を行う
アップロード中も設定を変更することができます。YouTube 上での動画の加工などもできますが、とりあえず【情報と設定】の部分のみ設定を行います。セールス用の動画なので、それを踏まえて以下のように設定することをオススメします。
基本情報の設定
(1) タイトル
検索結果を意識してタイトルを付けましょう。検索キーワードを盛り込むようにしてください。
(2) 公開設定
全ての設定が終わるまでは「非公開」にしておくといいと思います。完成したら限定公開か公開を選びます。広告出稿する場合は「公開」で。自社のウェブサイト上のみで公開する場合は「限定公開」でも OK です。
詳細設定の設定
(3) コメント
コメントの許可のチェックを外します。コメントは受け付けない方がいいでしょう。【この動画の評価をユーザーに表示する】のチェックも外しましょう。
(4) 配信オプション
【埋め込みを許可】【チャンネル登録者に通知】いずれのチェックも外してください。
(5) カテゴリ
動画の内容に合うカテゴリを選択してください。
(6) 動画の統計情報
※【収益の受け取り】と【Call-to-Action オーバーレイ 】の設定は必要ありません。
セールスプレゼン動画を埋め込むランディングページの制作
セールスプレゼン動画(動画セールスレター)用のランディングページは、少し独特な作りをします。まずランディングページのようにワンカラムが基本です。そして、レイアウトとしては、ヘッダー部分にヘッドライン。ボディー部分に動画を埋め込み。そして動画の下に購入用の決済ボタンを設置します。
この購入ボタンは動画の再生時間に合わせて最初は非常時にし、価格のプレゼン辺りまで進んだ段階で始めて表示されるようにします。
以下サンプルを元に解説していきます。
> サンプルサイト
ヘッドラインで見込み客をその場に滞在させる
ヘッダー部分にはヘッドラインが必要です。このヘッドラインは、ランディングページにアクセスした人をそこに留めさせることが目的です。動画は基本、自動的に再生されるように設定するので、それまでの間が勝負です。「これは自分のためのページだ」と思わせることができるようなヘッドラインをつくりましょう。
ヘッドラインの作り方に関するこちらの記事も参考にしてみてください。
ボディー部分にセールス動画を埋め込み、自動再生させる
セールスプレゼン動画の埋め込みにも一工夫必要です。まず動画はページを開いたら自動的に再生されるようにしましょう。見込み客に判断を委ねてしまったらそれだけで再生されない可能性が高まります。動画の冒頭部分に強力なフックを用意して、そのページから離れようとは思えないようにしましょう。
また、再生ボタン・停止ボタン・再生時間のコントロールバーなどは全て非表示にしましょう。セールスプレゼンテーションを、順番通りに見てもらうことが重要です。セールスの成否を決めるのは、順番なのです。ですので、相手に主導権を握らせるようなことはしないでください。
YouTube の隠しパラメータ
YouTube には、再生方法やコントロールの表示・非表示などをカスタマイズできる隠しパラメータが存在します。これを埋め込みタグに付け加えれば簡単にセールスに最適化された動画をつくることができます。
隠しパラメータの使い方
まず、YouTube の埋め込みタグを取得します。これは YouTube の動画ページの【共有】から【埋め込みコード】をクリックすると表示されます。コピペする前に「動画が終わったら関連動画を表示する」のチェックを外しておきましょう。
埋め込みタグはこのような構造になっています。
<iframe width="560" height="315" src="動画のURL" frameborder="0" allowfullscreen></iframe>
隠しパラメータは、以下のようなつくりになっています。
動画の URL の後に【 ? 】を追記し、その後に追加していきます。複数のパラメータを追加する場合は【 & 】を使ってつなげていきます。
セールス動画制作に必要なYouTube隠しパラメータ5選
(1) 動画を自動再生させる【 autoplay=x 】
- 0:手動再生(デフォルト)
- 1:自動再生
(2) コントロールを非表示にする【 controls=x 】
動画の下部にあるコントロールを非表示にするには、【 controls=0 】と指定します。x に以下の値を入れることで、コントロールの表示/非表示を切り替えることができます。デフォルトは表示になっています。
- 0:コントロールの非表示
- 1:コントロールの表示(デフォルト)
(3) フルスクリーンボタンを非表示にする【 fs=x 】
セールスプレゼン動画のランディングページには、後述の自動出現ボタンを設置します。この自動出現ボタンは購入ボタンです。動画を見続けた人が購入できるようにするボタンを、適切なタイミングで表示させます。
ですが、フルスクリーンにされてしまうと、この自動出現ボタンが隠されてしまい、購入のボタンに気づいてもらえなくなります。それによって離脱してしまうことを避けるために、フルスクリーンにできないようにします。
フルスクリーンボタンを非表示にするには【 fs=0 】と指定します。x に以下の値を入れることで、フルスクリーンボタンの表示/非表示を切り替えることができます。デフォルトは表示になっているので、何も指定しなければ表示された状態となります。
- 0:フルスクリーンボタンを非表示
- 1:フルスクリーンボタンを表示(デフォルト)
(4) ビデオタイトルを非表示にする【 showinfo=x 】
YouTube 動画では通常、動画の上部にタイトルやアップローダーなどの情報が表示されています。これもセールスプレゼンを集中してみてもらうのに不要な情報なので、非表示にします。【 showinfo=0 】と指定すればビデオタイトルなどが非表示になります。x に以下の値を入れることで表示/非表示を指定できます。デフォルトは表示です。
- 0:ビデオタイトルを非表示
- 1:ビデオタイトルを表示(デフォルト)
(5) 動画の再生終了後の関連動画表示を非表示にする【 rel=x 】
YouTube では、動画の再生が終了すると関連動画が表示される機能があります。しかしセールスにおいて、購入ボタン以外の他の動画やページへリンクさせるのは絶対避けなければいけません。なので、この関連動画は非表示にします。
【 rel=0 】と指定すれば関連動画は表示されなくなります。x に以下の値を指定することで、関連動画の表示/非表示を切り替えることができます。デフォルトは表示設定になっています。
またこの設定は埋め込みコードを取得する際に、チェックを外すことで簡単に設定できます。
- 0:関連動画の非表示
- 1:関連動画の表示(デフォルト)
セールスプレゼン動画 YouTube 版に必須の隠しパラメータ設定
以上、5 つの隠しパラメータを紹介しました。これを YouTube の埋め込みコード内で指定することで、セールスプレゼンテーションに適した動画の表示・再生方法にすることができます。このパラメータの設定をまとめると、以下のようになります。
<iframe width="560" height="315" src="動画のURL?rel=0&autoplay=1&controls=0&fs=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
自動出現ボタンの設置
セールスプレゼン動画の大きな特徴の 1 つが、この自動出現ボタンです。ここでは「」と呼びたいと思います。これはページへアクセスしてから指定した時間が経過すると、自動的に表示されるボタンのことです。
なぜこのボタンが必要なのかというと、しっかりセールスプレゼンテーションを見てから購入ボタンを押してもらうためです。ほとんどの人はセールスだと分かった瞬間、真っ先に価格のことを気にします。そして、購入ボタンを押して価格を確認したくなります。
しかし、売り手側としては、しっかり商品の価値をプレゼンした上で価格を伝えたいわけです。そこで、購入ボタンの出現を調整することで売り手側のセールスプレゼンテーションの進捗に合わせて購入の行動を促すことができます。
ボタン設置の手順
ページアクセス後、指定した時間が経過すると自動で出現するボタンを設置する方法です。ボタンを出現させるためには、以下のコードを使います。
(1) タグの前に以下のスクリプトを埋め込みます。
<script type="text/javascript"> function display_buy_button() { document.getElementById("hidden_contents").style.visibility = "visible"; } setTimeout("display_buy_button()", 【時間指定】); </script>
【時間指定】の部分に購入ボタンを表示させたい時間を指定します。指定方法は以下を参考にしてください。
1 秒 = 1000
1 分 = 60000
5 分 = 300000
10 分 = 600000
15 分 = 900000
例えば、動画開始後(正確にはページアクセス後なので動画の読み込み時間も含まれます)24 分 32 秒後に表示させたい場合は、以下のように指定します。
<script type="text/javascript"> function display_buy_button() { document.getElementById("hidden_contents").style.visibility = "visible"; } setTimeout("display_buy_button()", 1232000); </script>
(2) 購入ボタンを表示させたい位置に、以下のタグを埋め込みます。
<div id="hidden_contents" style="visibility: hidden"> <a href=""><img src="購入ボタンの画像など"></a> </div>
ボタンは画像でなくても構いません。テキストリンクで、デザインは CSS で整えることもできます。
コメントを残す