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」，或用手机扫描左方二维码，即可获得互联网分析沙龙每日精华内容推送和最优搜索体验，并参与编辑活动。