HTML5&Flash之粗知浅见

比较头大的是Flash又插入不进来了，无奈请您移步 点击这里 先去看一段动画展示：

什么是HTML

HTML（Hyper Text Mark-up Language）即超文本标记语言。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。
什么是HTML5：

我们所谓的HTML5所能达到的效果，并不是孤立的HTML升级版，而是HTML+CSS3+JS综合起来的表现。HTML也只是一个标记语言，只是他进行了更加语义化的优化，增加了一些被认为更加科学的标签，也去掉了一些标签，但标记是标记，行为是行为，没有CSS3、没有JS，HTML也永远只是个HTML而已。

HTML5目前任然是个草案，仍处于完善之中。然而，大部分现代浏览器已经具备了某些 HTML5 支持。现在支持HTML5的浏览器有：Firefox 3.5、Chrome 3.0、Safari 3.0、Opera 10.5、IE9

HTML5与之前HTML对比：

简单的说，HTML5比之前的HTML版本的标签更加语义化，更加标准化，并且增加了一些新的标签。

请看下图：

这是以前网页的HTML形式。而新的的HTML是这样的：

很显然，HTML5已经不再像以前那样一个DIV打天下了，新加了语义化的新标签。可能会让前段工程师们在团队协作上更加容易，因为有了统一的新标准。

形象一点来说吧，一个百货仓库，管理员老王来收拾仓库，把各种衣帽鞋子和百货分类放入不同的盒子中，在盒子上贴上标签并写上自认为合适的名字。那些盒子我们可以理解为DIV，标签上的起的名字class货id。

那好了，问题来了。老王下班了回家了，老李来接班，老李看了老王收拾的情况就开始骂街了，因为他看不懂老王在盒子上写的标签，害的他要挨个盒子打开看看究竟里面放着什么，这大大的降低了工作效率。

现在的HTML5就是直接把标记好了的盒子交给了老王，他可以根据不同的盒子来装不同的衣帽鞋子，这样等到老张来接班的时候就方便多了。并且不止这样，HTML5提供了更多的标签来让老张和老王们不用在麻烦其他同事而能独立完成一些以前来讲比较复杂的工作。

什么是CSS：

CSS（Cascading Style Sheet，可译为“层叠样式表”或“级联样式表”）是一组格式设置规则，用于控制Web页面的外观。通过使用CSS样式设置页面的格式，可将页面的内容与表现形式分离。页面内容存放在HTML文档中，而用于定义表现形式的CSS规则则存放在另一个文件中或HTML文档的某一部分，通常为文件头部分。将内容与表现形式分离，不仅可使维护站点的外观更加容易，而且还可以使HTML文档代码更加简练，缩短浏览器的加载时间。

什么是CSS3：

CSS3是CSS技术的升级版本，CSS3语言开发是朝着模块化发展的。以前的规范作为一个模块实在是太庞大而且比较复杂，所以，把它分解为一些小的模块，更多新的模块也被加入进来。CSS3提供了非常多新途径去改善你的设计工作，且做了不少重要的变化。

CSS3与之前CSS版本对比：

目前所知CSS3与之前版本相比，圆角、多背景、@font-face-用户自定义字体、渐变色、盒阴影、RGBa – 加入透明色、文字阴影等等，让代码更简洁、页面结构更合理，性能和效果得到兼顾。

形象一点来说, 前面所说的HTML，既老李和老王们只是库管工，而这里所说的CSS，让老张来做。他的任务就是将货物在商场上架，按照一定的顺序，将货物工整的排列到商场中。否则您看到的页面就想仓库一样，一大堆货物一字长蛇阵的堆砌在那里。而CSS3让老张不但是一个商场上架工，还能设计装修店面，老板，您有这样的员工您真是赚到了。

什么是javaScript：

JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。同时也是一种广泛用于客户端Web开发的脚本语言，常用来给HTML网页添加动态功能，比如响应用户的各种操作。它最初由网景公司的Brendan Eich设计，是一种动态、弱类型、基于原型的语言，内置支持类。JavaScript也可以用于其他场合，如服务器端编程。完整的JavaScript实现包含三个部分：ECMA，DOM ，BOM。HTML 5引入了大量的新的Javascript API。可以利用这些内容与对应的HTML元素相关联。

什么是API？

API(Application Programming Interface,应用程序编程接口)是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件的以访问一组历程的能力，而又无需访问源码，或理解内部工作机制的细节。

再形象一点理解，Javascript可以理解成一个能请神上身的神棍，咱们就叫他老刘。那API呢？就是js能请到各种大神儿。请牛大神儿上身，那就变刘老牛，请虎大神儿，刘老虎，请猪大神儿，刘老猪，请猴大神儿，刘老猴等以此类推。

HTML5与FLASH：

很多人认为HTML5出现会秒杀Flash，以至于在各大web前端开发论坛吵得不可开交。我不是HTML5的忠实信徒，也犯不着做Adobe的卫道士，让咱们心平气和的坐下来谈谈，他们两个之间的那点事。

HTML5的优点：

1、  无需插件

2、  开放、免费

3、  对搜索引擎友好

HTML5的缺点：

1、  由于其目前仍处于草案阶段，浏览器兼容性差

2、  开发模式单一，目前基本只靠记事本开发

FLASH的优点：

1、  普及率高，基本上每台PC机上都会装有FlashPlayer

2、  多年的积累，众多设计人员和开发者集中在Flash平台

3、  不存在浏览器兼容性问题

4、  Adobe提供的Flash和Flex提供有效的开发方案。

FLASH的缺点：

1、  耗电、性能不佳。

2、  封闭，收费

要说HTML5取代FLASH，那首先咱们要来讨论一下功能方面的问题，即HTML5能否达到FlashPlayer10.1般绚丽的页面效果。个人认为这应该不是问题，HTML5目前只是个草案，他在正式发布前我们都可以有无限畅想，只要有足够的动力需求，我相信这一点应该不会成为他发展道路上的大问题。

其次就是两方面争议都比较大的性能问题。也就是人们常说的，FlashPlayer太耗费系统资源，在移动设备上也太耗电。HTML5的性能一定比FLASH的性能高?我看倒也不见得。

如果用JS引擎写一个Ajax版的XX农场，如果所有页面广告动画都用JS来写，我想那才叫性能低下。为什么那么多网页游戏不是是Ajax做的呢？为什么很多优化的很好的Flash3D游戏场景都很流畅，而一个 2D的XX农场就能拖慢你的酷睿2呢？目前Flash之所性能低下，最深的根源应该源于他的普及率广，上手率高，进入门槛低，导致了Flash被一大部分水平参差不齐的Flash开发的人员的滥用。所以也就产生了一大批性能低下的Flash产品面世。所以未来HTML5要取代Flash 必须有一个高效的2D/3D图形文字渲染引擎，和一个高效的JavaScript引擎。这样才能带来更好的用户体验。

此外还有一个比较挠头的问题，HTML5来了，他带着他全新的标准雄赳赳、气昂昂的来了。但Adobe会一直停留在FlashPlayer10.1么？他会永远不升级么？答案肯定是否定的。但FlashPlayer是一个轻量级的插件，HTML5是一个重量级得标准，难道Flash每更新一次插件HTML5要跟着更新一次浏览器么？这貌似不太现实吧，即便的浏览器厂商办得到，用户们也会紧跟着浏览器厂商的脚步吗？这可就不太好说了，看看我们顽固的IE6老大爷，我对此持保留态度。

最后说点题外话，谁对HTML5的需求最迫切？

用户想要HTML5吗？用户才懒得管你什么HTML和Flash呢，用户关心的是应用，是体验。如果您能拿Ajax实现一个XX农场，我想没有哪个用户会引文这不是Flash做的而拒绝接受。
开发者想要HTML5吗？那需要一个成熟的HTML5+CSS3+JS的开发环境，需要各个浏览器提供统一的用户体验，即标准的完全兼容。还需要增加新的学习成本。

那这轰轰烈烈的前端革命究竟谁是最大的受益者呢？我想答案就是……Google和Apple！

我们可以意淫一下，如果HTML5真的得到了普及，那么获利最大的无疑是Google！原因很简单，当您面对一个功能和MicroSoft Word一摸一样的Google Doc时，您会再去花钱买Word吗？在您的面前电脑上，所有的办公应用和娱乐都只需要打开浏览器窗口，就全部能够满足时，您还会去花钱买操作系统吗？答案当然是：“NO！”。

再说Apple，Jobs想让浏览器原生支持视频音频，这样iPhone、iPad就不用嵌入Flash，Jobs当然不能让Flash进iPhone OS，要不然App Store里的游戏谁去买？同时，如果大量的应用都能基于浏览器实现时，用户就不会被 Windows的桌面应用套牢了。漂亮时尚的Mac会比现在更畅销。

综上所述，Flash是一个不断在发展的技术，有很强的灵活性，HTML5不可能完全取代Flash，众多的开发人员也不会果断抛弃Flash。

原因就是HTML5是浏览器厂商试图改变软件生态格局的战略需要，并非人民群众的迫切需求。鉴于各大浏览器老大们以往的表现来看，兼容性上还有待观察。此外HTML5还需要一个成熟的开发环境，光一个记事本应该是搞不定。在推广方面最好实时的推出一些切实有力的应用来吸引用户积极的更新浏览器，才能有效的完成HTML5的布局。