HTML5对战Flash:一场恩怨缠绵的拉锯战

HTML5优势何在?

　　2010年4月30日，乔布斯宣布iOS弃Flash，采用HTML5的消息传出后，微软也力挺乔布斯，称Flash落后。乔布斯封杀Flash的理由是：Flash不适合触摸设备，技术封闭。而HTML5可以通过代码实现Flash视频播放技术，且支持Canvas画布功能。

　　消息一出，不止震惊了业界人士，同样还波及到普通用户。2010年Flash Player的市场份额将近98%，普及率高，受众广。苹果公司在2010年相继推出iPhone 4与iPad，因外观时尚、灵动、便携而广受欢迎，而iOS封杀Flash的举动，也让用户与开发者重新对HTML5有了初步了解。在iTunes商店中的应用不见Flash，让那些基于Flash技术的游戏编写者不得不更换为HTML5。事实证明,HTML5在iOS平台深受好评，但有些用户还是希望能出现一款具备Flash特色的iOS游戏。

iOS已封禁Flash

　　有了苹果、谷歌的支持，HTML5可谓众星捧月，愈发受到业内巨头与开发者的青睐。谷歌、苹果都赞其为网络标准新生力军；连一向不服从标准的微软，也悄然在Internet Explorer 9 中加入对HTML5的大量支持（IE10的HTML5得分更高于IE9），今年微软的开发者大会上不仅推出了Windows 8，同时还宣布将取消Metro界面下Flash支持。那么Flash是否会被HTML5搞死？或是与HTML5并存而生？处于尴尬位置的Adobe，将采用什么手段与HTML5抗衡？

简单了解一下HTML5：

　　根据维基百科上的解释，HTML5的前身是Web Applications1.0，由WHATWG于2004年提出。2007年，它被互联网联盟W3C接纳。

HTML 5与HTML 4的不同之处

　　增加新的元素：section, video, progress, nav, meter, time, aside, canvas

　　input元素的新属性：日期和时间，email, url

　　新的通用属性：ping, charset, async

　　全域属性：id, tabindex, repeat

　　移除元素：center, font, u, strike, s, frameset, frame, applet

HTML 5技术优势

　　据一位开发者表示，“HTML5与Flash在功能上并不完全重叠的，比如对于摄像头等计算机硬件的调用，仍然只能使用Flash或其他方法实现”。但HTML5引入了一些足以让Flash致命的元素，最致命的两个标签：canvas与video。

　　一旦新网络标准只采纳HTML5的Video，那么我们所登录的视频网站将统一放弃Flash Video(FLV)，此举将深刻影响到整个互联网，而Canvas也将网络动画与图片载入速度大大提升。

HTML5绝杀Flash的两大元素

HTML 5绝杀Flash的两大元素

canvas画布

　　在Flash大行其道之前，曾经出现过很多种在网页中实现绘图功能的方法，并无统一的标准。当Macromedia公司（后被Adobe收购）推出Flash后，被广泛接受并成为网络绘图标准。基于Flash的动画、游戏等应用如雨后春笋般蔓延到互联网的每个角落。

　　而现在，Flash新的挑战者出现了：HTML5的新标签canvas。

canvas示例

　　canvas相比Flash，具备不依赖于外部插件、与浏览器渲染引擎紧密结合、节约资源的优势，最重要的是极大的简化了图形和网页中其他元素的交互过程。

　　对于Flash来说，使Flash中的元素与网页中其他元素进行交互是要消耗大量时间和资源的，另外在编程上也相当不方便。

　　而canvas本身就是HTML5的一个元素，可以像操作普通HTML元素一样操作它。开发人员可以将所有的代码整齐的写在一个文件里，降低了维护与更新的难度；而用户打开具备canvas元素页面也快过加载Flash的网页。

　　canvas也有缺点:

　　1.增加描绘复杂图形的难度：开发者不得不编程描绘每一个点和矢量曲线，在旋转缩放时更需要和矩阵变换打交道。

　　2.动画的实现存在缺憾：canvas实现动画的非常繁琐。开发者必须在每一桢动画显示时清空画布，然后重画所有元素，这必然导致包含大量元素的场景动画缓慢，只移动少量元素就要重画整个画布会浪费大量资源。而且创建动画也是一件十分繁琐的事情。

　　3.没有提供一套方便的事件体系：开发者也许需要通过捕获鼠标在 canvas 中点击的坐标，判断用户到底点击了什么图形元素。在这个过程中可能要遍历所有的显示元素并判定点是否在图形内，实现起来比较繁琐。

　　由此可见，HTML5在不能实现上述步骤时，依然需要Flash的支持。

　　目前已经出现了基于canvas的游戏引擎，但是从效果上看未能与Flash相比。

　　WebGL让我们看到了硬件加速的希望，这将极大的改进图形显示的速度，而IE9、Chrome、Opera等开始支持该技术。

　　关于编辑器，Adobe Flash CS5不得不做出妥协，增加了Flash转换为canvas的功能。

　　倘若canvas标签无法简化开发步骤，将很难得以良好发展，本领域将由Flash继续统治。

video视频元素

　　video标签是对Adobe威胁最大，同时也是最致命的，因为一旦广泛采用video标签，将打破Flash在线视频领域的垄断地位。

HTML5 Video标签在iPad上应用广泛

　　但目前实现video的情况仍需时日，作为 video 内容的视频存在编码问题，苹果和微软所支持的H.264不是开放标准，浏览器厂商必须为其付费。因此，作为三大浏览器之一的火狐浏览器拒绝支持此编码格式，而Google早前曾收购一套视频标准，2010年I/O开发者大会时正式宣布推出WebM,并于今年1月时宣布取消对H.264的支持。

　　根据最近的统计，虽然Google Chrome浏览器和Apple Safari浏览器增长很快，但浏览器市场还是主要被IE与火狐占据。不过火狐在今年4月时已加入到谷歌的WebM联盟，video标签的推广相对容易了。

　　但谷歌WebM被MPEG-LA联盟质疑侵犯H.264专利，为避免纠纷，微软与苹果一直未加入到谷歌的WeM联盟，而Mozilla火狐与Opera因不主张H.264的网络许可付费行径，选择加入WebM。由此可见，HTML5需要一个既开放又优质的视频编码标准。

HTML5的认知度

　　要让微软、谷歌、苹果这三个在很多方面存在竞争关系的业界巨头团结一心的支持同一套标准是很困难的。

　　苹果方面对 Flash 痛下杀手，微软方面则极少参与这场论战，因为有自家的Silverlight。至于谷歌则在支持HTML5的同时在 Android 中加入了 Flash 支持，甚至存在将Flash纳入Chorme安全沙箱的计划。今年，谷歌还在Google Labs推出一个将Flash转换为HTML5的工具。

　　三大科技巨头虽然目的一致却不齐心，未免对HTML5的开发方向也有所分歧。在这样的大环境下，HTML5的前景不容乐观，至少不能被广泛推广。

　　Adobe在今年9月发布Flash Media Server 4.5，软件引入苹果iOS系统支持，出版商制作Flash视频内容，通过HTTP直播生成为苹果支持的格式。但Adobe表示，Flash Media Server 4.5的问世，只能保证Flash视频能在iPhone和iPad上欣赏，那些基于Flash开发的游戏，动画和广告仍然不被iOS设备支持。

　　Adobe在发布Flash Player 11时表示，尽快推出兼容iOS的flash游戏编辑器，让iOS用户体验到基于Flash创建、却又不同于Flash的新技术。

HTML5认知度

　　不管你推不推广HTML5，要看用户对HTML5的体验度如何。虽然目前HTML5已渐渐被广泛应用到了网页中(WebQQ就是个HTML5范例)，但用户所关心的是页面加载速度，网页体验与视觉影响。

　　canvas若要达到与Flash无异，需要程序员做出巨大努力；无形中增加了人力成本，降低使用canvas的积极性。如果canvas制作的效果不能被用户接受，造成投入太多而收效甚微，也从侧面显示出Flash的市场渴求。而video标签的编码问题仍需进一步协调。若canvas与video两个问题不能很好地解决，HTML5与Flash竞争将处于劣势。

　　目前来看，Adobe对于HTML5的态度持观望：2011年5月，Adobe CS5.5套件发布，新版本特别增强了HTML5、Flash视频、移动和数字出版工具。今年Adobe的产品开始双向支持，Flash编辑器也加入HTML5元素，与Flash并行。或许Adobe看到了HTML5的开发难题，在Flash产品中加入HTML5，是为了让开发者体验到Flash的简易性。想弃用Flash？还需要多修炼内功。

HTML5与Flash未来走向

预测未来走向

　　在HTML5与Flash拉锯战中，谷歌、微软、苹果、Adobe渐成4角之势；苹果、微软都很想用HTML5这张王牌完全撤消Flash的影响力，但是双方并无结盟之意，轮流出拳抗击；而微软自家的Silverlight并未销声匿迹，仍在等待时机再战（可能会出现在Win8 Metro应用程序中）。谷歌看似中立，也支持Adobe的Flash，但谷歌仍提出自己的视频标准WebM,以支持HTML5。

　　1年前，如果说HTML5会取代Flash看似毫无可能，原因在于Flash已经占领了绝大部分传统桌面终端的份额，虽然被苹果移动系统封杀，但其传统桌面的地位几乎无法被超越。但随着苹果iOS的封杀、微软Win8 Metro的弃用，越来越多浏览器弃Flash投奔HTML5视频标准，以及谷歌的双向选择，Flash面临三面夹击，Adobe被逼到一个尴尬的位置。

　　Flash Player并不能给Adobe带来直接的利润，用于制作Flash的编辑器才是Adobe真正的利润来源。HTML5时代将至，开发者仍然不得不选择Adobe旗下的“网页三剑客”来制作基于canvas的交互页面，那么Flash Player是否有存在的意义？Adobe更可省下维护一个复杂系统的费用。

　　至于微软，不仅在IE9和IE10预览版中都加入了HTML5的支持，也需要对SliverLight进一步推广，微软Silverlight与HTML5既有爱，又有竞争意味。大力支持HTML5，会降低Silverlight的市场份额；所以微软必然不会全力支持HTML5，未来或许会在Win8 Metro界面引入HTML5与Silverlight，将HTML5做为Silverlight的补充功能。

　　苹果先从移动领域进军，慢慢渗透到桌面领域。iPhone的存在，已初步证明：智能手机并不需要Flash。但是最关键的是iPad，平板电脑领域不需要Flash，那么Mac OS X支持Flash的日子还有几天？如果大量平板用户习惯了没有Flash的网络体验，那么Flash临终结的日子已经不远了。

　　谷歌方面，这场战争的胜负对谷歌的影响都不大，只要能把用户留在页面上，它并不在意到底使用的是HTML5还是Flash。除旗下YouTube之外，Google很少在自己的产品中使用 Flash。今年的两个令人叫绝的涂鸦均采用HTML5与JS制作（第一个：舞者；第二个：谷歌电吉他有声涂鸦），也许此举已证明谷歌对HTML5的发展甚是看好。但是谷歌不会完全抛弃Flash。

网友用gif制作的谷歌涂鸦

Google用HTML5编写的动态涂鸦

　　Google用sprite图按位置截取出来形成网页动画。如同2D游戏中常见的行走图（5月11日google涂鸦，纪念美国现代舞大师玛莎葛兰姆（Martha Graham）的117岁诞辰）。

　　Google电吉他，你在这一天有没有亲自弹首歌曲给自己听？

　　Flash还为Android的市场份额增长做出了一定贡献，这也是谷歌没有完全放弃Flash的主要原因。2010年12月，谷歌将Flash纳入Chrome OS安全沙箱，为Flash饱受诟病的耗电问题、安全问题提供了良好的解决方案。

　　因此，未来的Flash的市场份额会有所下滑，若苹果产品市场份额取得新高，那么Flash的份额将急速下降。但根据目前的手机市场份额来看，Android暂时领先于iOS，所以Flash在移动领域还要存在一阵。而传统桌面方面，在微软强势推出Win8之后，根据目前的反响来看,Win8很符合操作系统的发展潮流。当微软宣布Win8 Metro界面取消Flash后，Adobe方面表示微软对Flash认识存在误区，不管Adobe怎么想，微软是决定以HTML5为主发展方向，辅以Silverlight应用来填补Flash。若Win8 Metro界面反响良好，Windows 9或将全面封禁Flash。所以，Flash在PC端的市场份额会在未来几年逐步削减。

　　至于HTML5，预计在2年内达到相对普及。随着科技的发展，取代Flash需要开发者与程序员一同创建出更新的标准。业内巨头之间矛盾重重，对HTML5的发展非常不利。现有标准能够被各大浏览器无差别支持就已经相当困难了，想要加入任何新功能都要很久才会被广泛支持。 这样缓慢的发展速度如何能够体现强大的竞争力，我们拭目以待。