为什么网站建设需要采用HTML5技术？

HTML5是用于取代1999年所制定的HTML4.01和XHTML1.0标准的HTML标准版本，与HTML4.01和XHTML1.0相比，HTML5可以实现更强的页面表现性能，同时充分调用本地资源，实现不输于App的功能效果，且其本身十分轻量化。

随着HTML5技术的发展，浏览器可以摆脱对操作系统的依赖，实现跨平台、跨终端体验。

HTML5技术而今已不再陌生，不管是趋之若鹜，热情拥抱，还是远远张望，保持距离，HTML5都是技术论坛热门的话题，给人的感觉就是酷、新、看上去很美。

HTML5开辟了无需下载的移动应用时代，有望成为下一代移动互联网的杀手锏，用HTML5开发的互联网产品，最能迎合用户的体验感受，省去了下载、安装、更新的烦恼，让用户可以随时享受最新版本的产品体验。

HTML5提高了可用性，改进了用户体验，给网站带来了视频、音频等更多的多媒体元素，它很好地替代了Flash和Silverlight，并将被大量应用于移动应用程序和游戏。

一、HTML5是什么?

HTML5本身是由W3C推荐出来的，它的开发是通过谷歌、苹果，诺基亚、中国移动等几百家公司一起酝酿的技术，这个技术最大的好处在于它是一个公开的技术。

换句话说，每一个公开的标准都可以根据W3C的资料库找寻根源。另一方面，W3C通过的HTML5标准也就意味着每一个浏览器或每一个平台都会去实现。

1、狭义的HTML5

HTML5草案的前身名为Web Applications 1.0，于2004年被WHATWG提出，于2007年被W3C接纳，并成立了新的HTML工作团队。2013年5月6日，HTML 5.1正式草案公布。

我们为什么要选择使用HTML5技术?-马海祥博客

该规范定义了第五次重大版本，第一次要修订万维网的核心语言：超文本标记语言(HTML)。在这个版本中，新功能不断推出，以帮助Web应用程序的作者，努力提高新元素互操作性。

2、广义的HTML5

广义的HTML5包括HTML, CSS和JavaScript在内的一套技术组合，其目标是减少浏览器对于插件的依赖，提供丰富的RIA(富客户端)应用。

我们为什么要选择使用HTML5技术?-马海祥博客

所以，CSS3，SVG，WebGL，Touch事件，动画支持等都属于HTML5技术范围(具体可查看马海祥博客《HTML5的主要技术组成部分及功能介绍》的相关介绍)。

二、HTML5适用范围

HTML5的应用仍存在巨大的上升空间，近期内很可能从广告行业逐渐往游戏行业、广播电视行业和媒体行业转型，不远的未来还能把触角伸得更远。

1、酷的应用

曾经有人这样形容HTML5，doing anything cool (on the web)，HTML5可以做很酷的应用，无需安装插件，就可以在网页中全屏观看高清视频，玩儿轻巧的在线游戏，体验流畅的动画效果，浏览精美的网络图，收听网络电台的音乐……一些小而美的应用非常适合HTML5，企业应用中的某些模块也可以选择HTML5。

2、非得跨平台吗?

每种编程语言和技术都有特定的适用范围，如果你的目标客户是iPhone，你只需要考虑Safari for Mobile就可以了，如果还要考虑Android平台，选择支持Webkit内核，如果目标人群是高端用户，用些新技术也是可行的，如果非得所有平台都支持，在基本功能之外，使用HTML5技术增加一些亮点，也会很有吸引力。

三、HTML5的缺点

HTML5虽然有很多的优势，但是HTML5也有他的适用范围，HTML5技术是一种被夸大了的万金油，在目前浏览器支持不一，开发工具，第三方类库缺乏的情况下，HTML5无法解决一切问题，但如果限定它的使用范围，HTML5确实可以优雅的解决很多问题。

目前来说，HTML5最大的缺点是：功能简单且分散、浏览器支持不一。

1、功能简单且分散

HTML5是一种技术集合，包括各种标签及其相关API，HTML，CSS，SVG，JavaScript等，没有统一的开发工具，一个完整的HTML5应用涉及到多种技术，导致开发难度大，对于企业应用，HTML5的功能有限，需要借助第三方类库。

2、浏览器支持不一

一直以来HTML5都以跨平台著称，但实际上要实现这一目标工作量巨大，HTML5缺少一个浏览器的标杆(Webkit有希望成为)，尤其目前在IE6/7/8占有率居高不下的情况下，希望用HTML5跨全平台基本是不可能的(具体可查看马海祥博客《如何解决IE6/IE7/IE8浏览器不兼容HTML5新标签的问题》的相关介绍)。

四、HTML5应用现状

从硬件角度来看，国内手机和平板两种移动设备应用最广，PC端次之，紧接着是电视和游戏设备。

从软件角度来看，桌面浏览器对HTML5的支持高于移动浏览器，最高可达95%;而从整体上而言，移动浏览器对HTML5的支持却优于桌面浏览器。

HTML5具有较好的浏览器向后兼容性，开发者能对浏览器不支持的情形设计各种各样的回退方案。因此，HTML5页面的实际显示性能与开发者、制作平台密切相关。

2015年，越来越多公司在HTML5品牌推广上进行布局。6至7月份起，鸡汤、自媒体等个人作品呈下降趋势，商企用户作品则保持高速增长。在商业需求的驱动下，HTML5页面设计的目的性更强，获得最好传播效果的基本是经过一定时间策划，在团队操作下有针对性地进行投放的企业案例。

相对应地，原有HTML5平台也进行了大面积升级，从平台性质而言，HTML5平台可分为轻营销模板类、功能引擎类和基础工具类三种，分别以易企秀、白鹭引擎和iH5为代表。

1、HTML5平台的特点

一般来说，三类HTML5平台的特点如下：

(1)、轻营销模板类：提供类似PPT页面切换的HTML5制作工具，通常面向C端(个人)用户，部分为B端(企业)用户。该类平台的数量较大，只适用于轻度营销，所能提供的页面动态效果局限于翻页。

(2)、功能引擎类：提供HTML5网页的开发引擎，通常面向B端用户。该类平台主要提供基于Canvas(画布)的游戏引擎，适用于轻游戏的开发，依赖于开发者。

(3)、基础工具类：提供用于页面交互的HTML5可视化编辑工具，主要面向B端用户，部分为C端用户。该类平台只有iH5，采用自主研发的闭源引擎，应用领域广泛，涵盖轻度营销、重度营销、媒体电商内容应用、视频、动画、游戏等方面。

与浏览器多采用谷歌开源引擎的状况相近，国内HTML5平台基本使用国内外开源框架或引擎。但和浏览器面向网页内容显示，只需提供高性能的技术支持不同，HTML5平台面向的是HTML5制作或开发，需要对网页质量负责。

因此，使用开源框架或引擎意味着这些HTML5平台进一步拓展业务会比较被动，容易面临同质化的困境。

2、HTML5平台的对比

因为整体上移动端浏览器对HTML5的支持优于PC端，2015年HTML5平台主要面向移动端网页的制作和开发。

我们为什么要选择使用HTML5技术?-马海祥博客

如上表，三种HTML5平台以PC网站、APP和软件三种形式提供制作或开发工具，成品为网页或HTML5源码。由表可见：

(1)、轻营销模板类HTML5平台只能做轻度营销，能实现翻页等简单动效，分为场景展示、电子出版和动画制作三种。如下图为易企秀桌面编辑界面，该类平台最大的共同点在于工具结构以页面为基础，与软件PowerPoint架构相近，能通过增减页面、使用功能组件和点击快捷菜单来调整内容。

我们为什么要选择使用HTML5技术?-马海祥博客

(2)、功能引擎类HTML5平台的用户专指性很强，主要是有开发经验的技术人员。下图为Egret Wing软件设计师视图下的基本架构，使用HTML5引擎把基础代码流程化，再借助第三方集成开发环境Adobe Air构建可视化工具，就能通过让用户使用软件组件来简化开发过程。

我们为什么要选择使用HTML5技术?-马海祥博客

(3)、基础工具类HTML5平台提供底层交互型产品，开发目的、设计原理和实现思路都以交互为基础，国内只有iH5。iH5于2015年9月上线，提供HTML5制作工具、工具培训和作品交易等服务。它本质上封装了DOM(文档对象模型)引擎的一个集成开发环境，使用者以设计师为主，适合广告公司、大型媒体公司和公司市场部等使用。

我们为什么要选择使用HTML5技术?-马海祥博客

如上图，iH5提供的是舞台、屏幕、页面、多媒体素材、事件、数据库等对象组件，而不是构建好的模块组件，在提供可视化编辑的前提上，它最大程度还原了HTML5页面的开发过程，具有较高的拓展性。由于提供底层交互功能，它的应用领域较广泛，能用于微信推广、网站建设、轻游戏设计、轻APP开发和视频交互等多个方面。

同样是HTML5规范，对HTML5技术与性能的取舍成为国内HTML5平台工具定位和提供服务的差别所在(具体可查看马海祥博客《深入解析HTML5的8大性能》的相关介绍)。

五、为什么选择HTML5技术?

2014年下半年，微信帮助捧火了HTML5小游戏，自此国内各行各业开始对HTML5保持持续高涨的关注。接着的2015年是国内HTML5行业迅速发展的一年，在媒体大肆渲染“互联网寒冬”之际，HTML5作品的生产数量和传播广度却居高不下，为寒冬增添一把柴火。

1、Web应用开发新标准

HTML5，第五版超文本标记语言，于2014年10月由万维网联盟(W3C)发布为正式推荐标准。它是HTML自1991年问世以来，最具变革价值的技术规范，历经多年修订与完善才制定完成。

过去，Web开发面临两种困境：

(1)不少人质疑Flash的安全性等问题，却找不到替代它的合适插件;

(2)工程师们抱怨PC端和移动端应用的多次开发，仍旧得为微软、苹果、安卓等系统设计不同方案。

而HTML5提供了良好的解决方案。与JavaScript、CSS等紧密结合后，HTML5能使浏览器不需要类似Flash的插件也能实现桌面应用的交互效果，它的跨平台可用性更令应用的一次开发成为可能。

如上图，Youtube使用HTML5的video元素进行标记后，网页不需要第三方插件就能播放音视频等。因此，HTML5的兴起具有非常深远的意义，它已经从简单的标记语言化身为Web应用开发的先驱。

2、HTML5 Vs Flash

我们为什么要选择使用HTML5技术?-马海祥博客

以前富客户端应用主要通过插件技术实现，比如Adobe Flash, Microsoft Silverlight, Java Applet，存在一些问题：需要安装插件，不支持移动设备，私有技术，没有国际标准等等，当然插件技术也有优势的地方，有特定的用途，上面就Flash技术和HTML5进行比较。

3、互联网发展的趋势

随着网络架构的完善，宽带提升，网速满足实时交互需求时，计算机结构也将发生变化，光驱消失，硬盘消失，内存增大，GPU愈加重要，现在B/S结构的应用越来越多，而HTML5旨在富互联网应用，能够改善B/S结构应用的用户体验是互联网应用的趋势之一。

目前HTML5已经可以解决很多问题，多少可以用到一部分，而面向未来互联网，基于“云+终端”的构架，终端的HTML5的兼容解决方案必然会出现，那时候你就可以全面拥抱HTML5了。