5廣告似乎是自UI風靡之后，又一個熱度極高的詞兒。他是什么？一個字母加一個數字是個什么意思？ 為什么如此受歡迎？

金色號角會議室，創作事業部趙陽同學就HTML5廣告做了詳盡生動的分享，帶大家一起用手機感受了HTML5廣告的互動體驗和新穎的表現形式。下面小編也邀請您一同來聊聊我們眼中的HTML5廣告。

什么是H5？

它是一種基于互聯網的網頁編程語言，而手機端廣告只不過是其中的一個點。2007年W3C（萬維網聯盟）立項HTML5，直至2014年10月底，在經歷了各種被實驗，被拋棄，被甩，被各家大佬當皮球踢來踢去之后，html5的規范終于正式定稿了！

也許，它最親的那個后爸爸就是喬布斯，因為html5之所以今日如此受歡迎，不單單是因為它讓網頁擺脫了像是Flash類似組建的依賴，其中一個原因就在于HTML5是唯一一個通吃PC、Mac、iPhone、iPad、Android、Windows Phone等主流平臺的跨平臺語言。Java和Flash都曾夢想這個位置，但夢斷于ios。

移動互聯網，讓谷歌和蘋果得以聯手改寫了原先IE+FLASH所樹立的霸主地位，從而也成就了html5的未來地位。

什么是H5推送廣告？

顧名思義，H5廣告，就是利用html5的編碼技術來實現的一種數字廣告，目前來說，主要傳播途徑為手機和平板，而理論上，到處都會是它的入口，你的電腦，數字電視，所有移動平臺都將支持！

2014年春季，H5廣告開始在公眾平臺除露頭腳，這一時期，以《特斯拉》為首的一批H5廣告開始上線，雖然，輻射用戶有限，但是在業界算是砸出了動靜，興起了風浪！

于是，《神經貓》上線，于是，《尋找房祖名》上線，似乎奇跡開始發生了，在短短的幾個月，H5的互動游戲引爆了全民的狂歡！而當w上海掌舵的大眾點評推出《聚》之后，所有的人也瞬間意識到，一個品牌傳播的全新時代就要來了。

HTML 5廣告賞析

《發現平行宇宙之美》 游戲推送廣告

《危險處處存在 你所不知道的電力常識》

更多信息請登陸：www.goldav.com，或掃描下方的二維碼添加微信關注；

聯系：13520676905

本文為作者分享，影視工業網鼓勵從業者分享原創內容，影視工業網不會對原創文章作任何編輯！如作者有特別標注，請按作者說明轉載，如無說明，則轉載此文章須經得作者同意，并請附上出處(影視工業網)及本頁鏈接。原文鏈接 http://107cine.com/stream/68132/

告該用哪種文件格式？

當我們選擇應該應用哪種文件格式到我們的多媒體廣告上，我們通常會有以下的疑問：

1. Google Display廣告可以接納什么文件格式？

2.JPEG、GIF和HTML5有什么區別？

3.各種格式的優點和缺點分別是什么？

4.如何創建不同格式的多媒體廣告？

看每種格式之前，讓我們先了解哪些廣告尺寸公認較受Google歡迎！

制作Display Ads的兩個基本要點

01

多媒體廣告（橫幅廣告）文件大小

無論使用哪種格式，都需要確保不超過150kb。

如果你使用線上轉換器來改變文件的大小，很多時侯該廣告將會變得模糊不清。

因此，必須記住，應該在一開始設計時就要考慮這點，令廣告在原始格式中有更小的像素。

02

行動呼吁（Call-to- Action）按鈕

互聯網上有很多GDN多媒體廣告，然而要成功吸引客人的方法之一就是增設行動呼吁（ Call-to- Action）按鈕例如立刻登記、立刻購買等等。

但是，我建議你避免使用某些行動呼吁按鈕的用字，例如"點擊此處"，因為 Google會較容易視之為點擊誘餌Click Baits）

多媒體廣告格式：最常用

PNG

JPEG

HTML5

GIF

HTML5

AMP

PNG和JPEG是靜態格式，而GIF、 HTML AMP和HTML5是動畫格式。

靜態格式被大眾認為是老土，靜態廣告一般資訊及內容會較貧乏，如果嘗試在靜態格式上添加大量信息，它會看起來非常不美觀。

因此，使用動畫格式一般來說是比較好的選擇。

那么，接下來就為大家詳細分析下以上的幾種格式的優缺點。

JPEG

最常用

JPG或JPEG被認為是世界各地最常使用的圖像文件格式。這格式常應用于社交媒體的廣告、網站甚至傳統打印。

JPEG格式是以'' Joint Photographic Experts Group"（聯合圖像專家組）的創建者命名。

優點

1. 大量的顏色可供選用
2. JPG文件有低，中，高質量可供選擇

缺點

此文件類型被視為容易受損，簡單而言， Lossy File Format往往意味著當你嘗試減小文件大小時，質量將會逐漸降低。

創建所需的工具

有很多軟件可以創建JPEG，較常用的是 Adobe illustrator or Adobe PhotoShop......

PNG

廣泛

此文件格式是另—種重要的圖像文件格式。它被認為是一種“較不松散（較不有損）”的格式。這意味著你可以輕松編輯圖像，同時不影響質量。

PNG是 Portable Network Graphics的縮寫。這種格式廣泛用于網頁設計，它與Print并不兼容

優點

1. 能夠使用透明度和/或不透明度，而不像是JPG，只能保留白色背景
2. 因為其仔細度，所以更適用小圖像例如徽標、圖形元素等

缺點

文件大小相對比JPEG大

創建所需的工具

有很多軟件可以創建JPEG，較常用的是 Adobe illustrator or Adobe PhotoShop......

GIF

更喜歡

GIF可用于動畫和靜態格式，但人們通常更喜歡使用動畫格式。世界各地的廣告商都廣泛使用GIF，因為它很容易創建，并且可以使用任何代碼語言完成。你可以在網絡上的任何位置找到GIF的存在。而暫時為止，因其制作容易及簡單，很多人都是以GIF格式Google投放橫幅廣告。

建議在每個GIF使用三張圖片就好（總共不超過150KB）。如果使用超過3張圖片，每張分到的KB就很少，那就會影響質量（看起來很丑陋、模糊和松散）。

優點

比普通廣告快6倍

缺點

由于播放動畫的方式其實是逐格播放圖片，使GIF看起來很平庸

最大的缺點是GIF只能使用256種顏色。這意味著GIF動畫將無法獲得最佳圖像質量

Google對GIF動畫的要求

長度：30秒或更短

循環：可循環播放，但必須在30秒后停止

速度：低于5FPS

創建所需的工具

有很多軟件可以創建，較常用的是 Adobe illustrator或 Adobe PhotoShop

HTML5

最著名

Flash已經壽終正寢了一段時間。在近2年的時間， Google多媒體廣告聯播網也公布不再接受Flash的廣告，并且由HTML動畫廣告取而代之。2019年，最著名的廣告格式是HTML5。它使用 Javascript和CSS，并允許用戶創建精彩的過場和動畫效果。

如果你使用 Google網頁設計師進行創建HTML5，則必須將輸出文件放在.zip文件夾中。大多數人認為.zip文件夾需要解壓縮，但你不需要。你可以在創建 Google展示型廣告時將.zip文件上傳到 Google廣告平臺

優點

1. 這是—個開放的網絡標準格式文件，這意味著所有瀏覽器和操作系統都支持這種格式
2. HTML5尺寸大小小于動畫GIF文件
3. 它允許嵌入音頻、視頻和媒體內容

缺點

1. HTML5開發工具需考慮對 Android、ios或 Windows系統和代碼進行必要的更改
2. 掌握代碼語言需要多年的實踐和學習，但你可以使用 Google Web Designer甚至Bannersnack等工具簡單地開發動態HTML5廣告，無需非常熟悉代碼也可使用此工具

Google對HTML5廣告的要求

如果你計劃使用HTM5廣告來運行PPC廣告系列，那你必須先了解要求。

你只能在以下情況下在 Google投放HTML5廣告：

1. 了解政策合規性的所有內容
2. 良好的付款歷史紀錄
3. 已投放1000美元

創建所需的工具

Google Web Designer, Onlymega, Onlymega和 Onlymega

AMP HTML5

最常用

AMP是 Accelerated Mobiles Page項目的縮寫。這是一項旨在改善網絡的開源計劃。項目的愿景是使網站和廣告在所有設備上更加美觀、快速和高效。

AMP廣告更輕、更快，而且更安全。眾所周知，它們可以提供更好的用戶體驗并提高參與率。可以在 AMP HTML的幫助下構建 AMP HTML廣告。除此之外，還可以使用各種智能組件。

優點

1. 比普通廣告快6倍
2. 其較輕巧的屬性可帶來更好的體驗
3. 你必須在投放 AMP HTML廣告前對其進行驗證，從而消除惡意軟件的風險并贏得客戶的信任
4. 根據 Google說明，“ AMPHTML廣告可以在兩個AMP頁面上（通過廣告管理系統 AMPHTML廣告代碼）和非AMP頁面（通過 Google發布商代碼）投放。這包括桌面和移動網絡環境。

缺點

無法使用模糊效果、循環、操作URL和嵌入項等設置

Google對 AMP HTML5廣告的要求

與HTML5廣告不同，你無需擁有投放Google廣告的長期歷史記錄或良好的付款記錄。

創建所需的工具

Google Web Designer, Onlymega，Bannersnack和Bannerflow。

HTM5具有更好的性能，但 AMP HTML5并不像 Google聲稱的那樣好，它的點擊率甚至低于GIF格式。

如果真的想投放 Display Ads（ GDN Banner），建議先考慮HLML5。如果帳戶不符合運行HTML5的條件，可選擇GIF或 AMP HTML5。

因此，只需選擇任意一個熟悉的格式來創建廣告。如果你熟悉 AMP HTML5，那就使用AMP HTML5。如果你熟悉GIF，那就使用GIF。

總結

當你知道什么能提高點擊率、轉換率和投資回報率？那就是選擇最適合你的 Display廣告的文件格式。

在大多數的情況下動畫格式是優于靜態格式。上訴中優先排名第一的是HTML5，其后是 AMP HTML5。排名第三的是GIF，然后是JPG和PNG文件格式。

你get到了嗎？

還想學習更多詳細知識干貨？可以報名參與我們每個月開設【谷歌實戰訓練營】，我們已經開過很多期谷歌營銷人才培訓了，如果你覺得迷茫或者您的企業需要專業的營銷人才，您都可以聯系我進行免費咨詢!

段時間小編發現，HTML5似乎滿足了廣告主對移動營銷的大部分需求，從形式到功用、到傳播，有人觀望，更有人已搶了鮮，在2014年HTML5營銷案例也層出不窮。大到可口可樂、維多利亞的秘密這種敢于嘗鮮的大牌，小到知乎推出的一本新書，各種品牌和產品都在嘗試利用HTML5進行營銷。那么H5到底可以怎么玩?讓我們一起來看看吧。

主題派

主題傳播永遠是品牌的重要傳播訴求，但無論是新聞稿還是軟文拿到社交媒體上來，與其他形式紛繁的訊息進行PK，總是感覺弱弱的，這個時候HTML5就可以華麗麗出場了。在原有專題的基礎上，加之互動以及其他適配小屏幕的素材，一個聲情并茂的HTML5主題就可以制作完成。可以預期的是，將有越來越多的媒體和企業會采用此種形式推介某個主題或是亮點。可口可樂已先行使用HTML5形式傳播品牌主題：如用一條紅線重現一個品牌經歷的歲月，在簡潔的線條世界里，可口可樂描繪了一段歷史，整個時間軸隨著用戶向上滑動頁面“繪制”而成。“我們在乎”——可口可樂中國可持續發展報告，一份枯燥的報告也可以變身輕盈，適應移動端觀看及分享的需求，以更活潑的形式在朋友圈被熱轉。

案例鏈接：騰訊大會邀請函

2014年11月8日，騰訊就在世人面前高調地玩了一把科技感。在WE大會現場中，不但有唯美的星空畫風和首頁由遠及近的宇宙效果，還增加了指紋識別的科技互動元素。最重要的是游戲規則：將應用邀請發給好友，300秒之內，雙方在各自手機上同時按下指紋，驗明正身后獲得邀請碼。這種手機端接連現場的技術十分搶眼，可以讓與會者享受到被重視的禮遇，還有瞬間通電的感覺。這款邀請函不只是實現了人機互動，更是實現了雙屏互動，運用了一次社群思維。

游戲派

愛玩是人類的天性，好游戲吸引用戶參與沒有問題，但當游戲遇上營銷，就難免生死未卜了，弄不好就破壞了游戲體驗，引火上身。像《圍住神經貓》只是因為接入了廣告文字鏈，就結束了一款游戲絢爛而又短暫的生命，于朋友圈銷聲匿跡。

所以想要利用游戲進行營銷一定要做到謹慎、巧妙。目前HTML5游戲營銷主要是兩種形式，一種是品牌推出游戲，游戲依附于品牌，一般為知名品牌;另一種為游戲先行，產品藏匿于游戲之中，這種則是一些新產品或是新品牌。像杜蕾斯、維多利亞的秘密就屬于前者，推出符合品牌特點的一些小游戲，將品牌與游戲進行深度融合，如將經典游戲中的元素換為品牌標識或是產品，使用戶在玩游戲的過程中加深對品牌的認知。而《財務包子鋪》則是后者的典型代表，成為HTML5小游戲中的一匹黑馬。

案例鏈接：《財務包子鋪》背后的那本書

測試一下自己的創業成功指數?在這個人人吵著要創業的年代，大多數人都會對這個測試躍躍欲試吧，心里想著：我的創業天賦可不能就此埋沒。于是由知乎制作的小游戲《財務包子鋪》在微信朋友圈里迅速流傳，玩家以創業老板的身份，對自己的包子鋪的日常經營做出決策。聽上去沒什么特別，但游戲中專門設置了機制，比如用戶如果決策失誤，就會收到破產警告，需要選擇一本救命書——就是知乎要借此推廣的《金錢有術》。續命之后可以繼續游戲，讓玩家對新書留下初步印象，又不會中斷游戲。游戲上線三天后，《金錢有術》這本書成為亞馬遜圖書銷售總榜冠軍，同時還是預售冠軍、新書冠軍、經濟類冠軍，僅在游戲里點擊“購買秘籍”這一選項的獨立用戶數就有55萬。怎么樣，設計得如此天衣無縫，就算有人知道是“軟游戲”了，但還是愿意為這本書買單。

活動派

有粉絲的地方就有活動，社交媒體風行后，品牌活動大規模轉移到微博、微信上來，真實的社交關系鏈，對于有獎活動來說是最好的人氣資源。相對于微博上的關注和轉發有禮，以及微信朋友圈轉發集贊等，使用HTML5開發出的有獎互動活動形式會更新穎和多變，同時也可以發揮HTML5的多項營銷優勢，如互動性強，在活動中開發出各種與用戶的互動形式;功用性好，獎品對于用戶來說就是最實際的刺激和誘惑;傳播性廣，獨樂樂不如眾樂樂，發現了既好玩又有獎品拿的好事，當然要好朋友一起分享。

案例鏈接：索尼七夕送“小青心”

在2014年七夕期間，索尼就用HTML5開發了活動頁面，強力推出一款新品——清新范兒十足的小青心索尼C3手機。在活動期間，只要關注索尼Xperia官方微信進入游戲，將在頁面“邂逅”專屬幸運四葉草，分享活動到微信朋友圈，邀請4位好友幫助拆開禮盒，點亮小青心幸運四葉草，即可獲得抽獎資格，索尼為此一共準備了77臺小青心索尼C3智能手機。七夕是年輕人的節日，整個活動將小青心標簽與七夕相結合，踩準節日營銷的時間點，同時環節中設置需要4位好友幫助，也使社交傳播鏈得到了幾何式鋪開。

功能派

在前文中已經提到，想用戶之所想才能夠有效“黏住”用戶，使得HTML5營銷得到轉化，不論什么時候，只要實用，總會有人點擊、有人轉發，這也是HTML5營銷最需要的推動力。在功能性HTML5開發方面，百度可謂屢試不爽，如先后推出iBreath智呼吸、手機告全體主人書、北京地鐵計算器等產品，這幾款產品無一不是戳中了用戶的“痛點”：健康、手機使用、地鐵漲價，這都是實實在在的需求點。以手機告全體主人書為例，你是否已經看夠了那些枯燥的文字敘述，也厭煩了毫無新意的小互動，這組頁面幾乎每頁都根據要表現的內容增加了趣味十足的動畫效果，將說明書變成了“動畫片”。

案例鏈接：百度iBreath智呼吸

這款HTML5的slogan為：人呼出的氣體和指紋一樣獨一無二。此語一出，就讓人對自己的呼吸充滿了好奇，具體操作也很簡單：手機水平放好，然后深呼吸，對著手機下方吹氣。幾秒鐘之后，通過大數據分析，你的健康值就會被測算出來，會列出用戶的呼吸氣體成分詳細數據，還會分析出用戶的健康情況，如肺部感染癥狀以及相應的健康改善建議等等。

更多精彩內容，請關注互聯網分析沙龍微信：techxue 每天為您推送最新、最熱干貨！

互聯網分析沙龍——互聯網人的實戰分享平臺，一個為您提供專業的商業模式、產品、數據、用戶、電子商務、社會化媒體、移動互聯網等深度分析的信息網站！請在微信公眾賬號中搜索「techxue」，或用手機掃描左方二維碼，即可獲得互聯網分析沙龍每日精華內容推送和最優搜索體驗，并參與編輯活動。