ネット広告 HTML5広告でクリック率が3.1倍にUP！

浜松本社ディレクター深谷
2018.05.30

HTML5広告

こんにちは。クリエイティブプランナーの深谷です。

第2回目の記事「AMPでモバイル表示速度が驚異の3倍に！」はご覧頂けたでしょうか。

第3回は、営業部の平野と一緒に子会社「株式会社正明堂」にて、
冬のみかんシーズンに配信した「HTML5広告」についてご紹介したいと思います。

HTML5広告とは？

HTML5広告とは、HTML5＋CSS3＋JavaScriptなど最新技術を組み合わせた、次世代のテクノロジー系WEB広告のことです。

2017年1月にGoogle AdWordsがFlash広告を完全に廃止したため、近年、HTML5広告で作成されたアニメーションやカルーセルバナーが目立つようになってきました。

HTML5広告のメリット

PC、タブレット、スマートフォンあらゆるデバイスでインタラクティブな広告を配信できます。
また静止画に比べ、クリエイティブの表現方法が広がるため、アイデアや技術次第でパフォーマンスの向上が期待できます。

・リッチアニメーション
・スライド
・3カラムマルチリンク
・カウントダウン
・360度　など

HTML5広告の実装

HTML5広告を実装する場合、大きく分けて2通りの方法があります。

1つは、Googleが提供している「Google Web Designer」というウェブアプリケーションを利用する方法です。

Google Web Designerhttps://www.google.co.jp/webdesigner/

Google Web Designer は、視覚的なコーディングインターフェースを使用して HTML5 広告をはじめとするさまざまなウェブコンテンツをデザイン、作成できる、高度なウェブアプリケーションです。デザインビューで描画ツール、テキスト、3D オブジェクトを使ってコンテンツを作成し、タイムラインでオブジェクトやイベントをアニメーション化できます。コンテンツの作成が完了したら、人間が解読可能な HTML5、CSS3、JavaScript を出力できます。（引用元：Google Web Designer とは）

2つ目は「スタンダードHTML5」と呼び、HTML5＋CSS3＋JavaScriptなど高度なプログラミング知識で、コーディングしていく方法があります。

今回は、自由度が高い「スタンダードHTML5」を採用しました。

※バナーをクリックすると外部リンクで動作を確認できます。

HTML5広告の入稿規定

配信媒体	GDN
ファイル形式	.zip ZIP ファイルには、次のファイル形式を含めることができます。 .CSS .JS .HTML .GIF .PNG .JPG .JPEG
ファイルサイズ	150KB以下
広告サイズ	320×50: モバイルビッグバナー 480×32: モバイルバナー（横） 320×100: モバイルバナー（大） 468×60: バナー 728×90: ビッグバナー 300×250: インラインレクタングル 320×480: スマートフォン向けインタースティシャル（縦） 480×320: スマートフォン向けインタースティシャル（横） 768×1024: タブレット向けインタースティシャル（縦） 1024×768: タブレット向けインタースティシャル（横）