Html5发展与移动Web

 

Html5发展与移动Web

 

1. 历史背景

HTML 5 的讨论开始于2003年，当时W3C 对由 Web Hypertext zssApplication Technology Working Group (WHATWG) 开发的 HTML 5 草案表示出兴趣，WHATWG 创始于2004年，由苹果，Mozilla 基金会，以及 Opera 公司的 代表组成。此后，W3C HTML Working Group 于2007年成立并着手开发 HTML 5。W3C 于 2008 年 1 月 推出 HTML5 的第一份草案目前，开发工作仍在进行中，并将于2012年向 W3C 提交初步意见，不过现在已经有不少浏览器部分支持 HTML 5。

2. Html 5定义

HTML5 是继 HTML4.01, XHTML 1.0 和 DOM 2 HTML 后的又一个重要版本，旨在消除富 Internet 程序（RIA）对 Flash， Silverlight， JavaFX 一类浏览器插件的依赖

3. Html 5变革

1. 全新的，更合理的 Tag，多媒体对象将不再全部绑定在 object 或 embed Tag 中，而是视频有视频的 Tag，音频有音频的 Tag。

2. 本地数据库。这个功能将内嵌一个本地的 SQL 数据库，以加速交互式搜索，缓存以及索引功能。同时，那些离线 Web 程序也将因此获益匪浅。

3. 不需要插件的富动画。Canvas 对象将给浏览器带来直接在上面绘制矢量图的能力，这意味着我们可以脱离 Flash 和 Silverlight，直接在浏览器中显示图形或动画。一些最新的浏览器，除了 IE，已经开始支持 Canvas。

4. 浏览器中的真正程序。将提供 API 实现浏览器内的编辑，拖放，以及各种图形用户界面的能力。

5. 内容修饰 Tag 将被剔除，而使用 CSS。

3.1 标签语义化

3.2 Web表单UI更好用

3.3 直接支持音视频

HTML 5将提供多个API，如音频和 视频标签可以让开发者不借助第三方工具直接播放Web视频和音频

3.4 矢量绘图 -- 标签

报表需求越来越大，HTML5可以直接搞定（GOOGLE API上有一套蛮不错的图表脚本）：

相比静态图片，使用标签，可以直接针对它编程，比如，根据用户的投票，实时生成圆饼图。

3.5 用户可以编辑网页的内容

HTML 5支持contenteditable属性，允许你设定网页的哪一部分可以编辑

3.6 异步通信

WebSocket提供了一个受欢迎的技术，以替代我们过去几年一直在用的Ajax技术。这个新的API提供了一个方法，从客户端使用简单的语法有效地推动消息到服务器。让我们看一看HTML5的WebSocket API：它可用于客户端、服务器端。而且有一个优秀的第三方API，名为Socket.IO。

WebSocket API是下一代客户端-服务器的异步通信方法。该通信取代了单个的TCP套接字，使用ws或wss协议，可用于任意的客户端和服务器程序。WebSocket目前由W3C进行标准化。WebSocket已经受到Firefox 4、Chrome 4、Opera 10.70以及Safari 5等浏览器的支持。

WebSocket API最伟大之处在于服务器和客户端可以在给定的时间范围内的任意时刻，相互推送信息。WebSocket并不限于以Ajax(或XHR)方式通信，因为Ajax技术需要客户端发起请求，而WebSocket服务器和客户端可以彼此相互推送信息；XHR受到域的限制，而WebSocket允许跨域通信。

4. Html 5与移动Web

4.1 移动Web开发语言

 

这张图形象的展示了标记语言的发展历程，包括移动Web标记语言

 

XHTML basic支持了大部分在XHTML中定义的基础特性，所以对于大部分前端开发人员来说，开发一个基于XHTML Basic 1.1或XHTML MP的网站并不困难。但是由于移动设备厂商和设备都非常的多，所以各个设备在对某个细节上可能会有差异。

W3C存在的最大价值，是为我们提 供成熟而统一的解决方案，虽然XHTML MP成了事实上的Mobile 标准，但是显然XHTML Basic功不可没，如果说两者并存尚容易让我们混淆的话，希望在不久的将来，HTML 5能够成为移动互联网中事实上的标准， 这无疑将大大减少我们的开发需求。

但是由于现实中很难将所有的设备统一，这就造成实现方式的必然存在差异。可以预见，XHTML Basic /MP和HTML 5将成为两种并行的规范存在，我们不得不用XHTML Basic/MP为低端设备开发基础页面，同时使用HTML 5为iPhone和Android等系统实现富界面

4.2 Web应用程序

随着iPhone和Android等智能手机的日渐流行和iPad等平板电脑的出现，移动互联网的潜力和趋势也愈发显现，移动互联网正式走进了我们的视线。而针对移动互联网原动力——移动设备的Web开发越来越受到关注，国内外很多公司也开始重视面向所有移动设备的Web开发。

所有主流的移动平台，包括苹果的iOS，Google的Android和Palm的WebOS，都使用基于WebKit渲染引擎，所以像HTML 5和CSS 3这样的技术将可以继续得到改进和支持。甚至，微软在MSIE 9中也会对HTML 5提供支持。虽然它在10年内也许还不会成为正式的标准，但是它已经逐渐地被主流的浏览器提供商支持了，并且越来越多的站点和服务——例如YouTube Mobile，Google Gmail，Scribd，和苹果的iPhone，iPad都用HTML 5来代替像Adobe的Flash那样的插件

4.2.1 Html5构建Web应用程序

HTML5可以让你摆脱对平台的依赖，用户打开浏览器，直接就可以访问你的应用，而不需要经过各种Store的审核，在将来，一个Web应用程序应该可以运行在大多数的移动平台上，如果不是所有的话，它应该可以运行在任何一个HTML 5兼容的Web浏览器上，这个Web应用程序可以调用智能手机的核心功能——包括地理定位，加速器，联系人，声音和振动。

Html 5可以提供大多数现有需要插件和扩展来完成的功能，而且具备了图像增强、 Web数据存储和离线数据存储等新功能，这使完整支持HTML5的浏览器具有了更强的本地数据处理能力，用户可以 不受各种系统平台和软件插件的限制，只需通过浏览器就可以运行这些应用。

4.2.2 跨平台开发

使用跨平台技术来进行软件开发的探索令开发者们兴奋不已，PhoneGap是一个开源的开发框架，用来构建跨平台的使用HTML，CSS和JavaScript的移动应用程序。它使开发者能够利用iPhone，Android，Palm，Symbian和Blackberry智能手机的核心功能——包括地理定位，加速器，联系人，声音和振动。PhoneGap是免费的，但是它需要特定平台提供的附加软件，例如iPhone的iPhone SDK，Android的Android SDK等。使用PhoneGap只比为每个平台分别建立应用程序好一点点，因为虽然基本代码是一样的，但是你仍然需要为每个平台分别编译应用程序，

Sencha Touch是HTML 5移动应用程序框架。Sencha Touch也是使用HTML5，CSS3和JavaScript来实现的，它可以在Android，iPhone和iPad平台上使用，也可以在其他带有HTML5兼容的Web浏览器的平台上使用。它支持像pinching和stretching那样的触摸事件，为了在移动应用程序商店上分发，也可以是基于Web的或使用Objective-C层来包装。Sencha Touch是开源软件，所以如果你正在开发一个和GNU GPL v3协议兼容的开源应用程序，那可以免费使用它

5. Html 5漫漫长征路

酝酿已久的HTML5正致力于成为Ajax、Flash和Silverlight的替代者。它承诺将带给互联网浏览器更丰富的交互性。在重量级的苹果电脑公司和Adobe下一代移动设备的接口格式之争中，HTML5正是争论的焦点。但是，HTML5可能还会继续落后于富互联网应用程序平台，Forrester研究公司分析师Jeffrey Hammond表示。他指出，HTML5正在经历痛苦的诞生，而其替代者比如Flash和Silverlight正大行其道