构建移动网站与APP:HTML 5移动开发入门与实战(跨平台移动开发丛书)
上QQ阅读APP看书,第一时间看更新

1.2 认识HTML 5

本节我们开始介绍HTML 5技术的内容,看一看HTML 5的发展历史及其与XHTML技术的比较。

1.2.1 HTML 5的发展与理念

W3C是一个纯粹为了标准化而存在的非营利性组织,可是它也太过于纯粹而忽略了各大浏览器厂商的利益。在两年多交涉未果的情况下,来自苹果、Mozilla基金会以及Opera软件等的浏览器厂商于2004年成立了WHATWG(Web Hypertext Application Technology Working Group,网页超文本技术工作小组)。不难理解,他们意图回到超文本标记语言HTML上来。此时的苹果刚刚成立Safari浏览器团队不久,可见老乔当年的战略眼光。

WHATWG动作很快,因为他们都是战斗在第一线的浏览器厂商,成立后不久就提出了作为HTML 5草案前身的Web Applications 1.0,那时HTML 5还没有被正式提出。

WHATWG致力于Web表单和应用程序,而W3C专注于XHTML 2.0。看着自己被冷落的W3C在2006年10月决定停止XHTML的工作并与WHATWG合作,双方决定共同创建一个新版本的HTML,并为其建立一些规则:

● 新特性应该基于HTML、CSS、DOM以及JavaScript。

● 减少对外部插件的需求(比如Flash)。

● 更优秀的错误处理。

● 更多取代脚本的标记。

● HTML应该独立于设备。

● 开发进程应对公众透明。

2007年,苹果、Mozilla基金会以及Opera软件建议W3C接受WHATWG的HTML 5,正式提出将新版HTML标准定义为HTML 5。于是HTML 5就正式和大家见面了。

随着浏览器JavaScript引擎大幅提速,人们对HTML 5的预期逐步提高,但那时的HTML 5并没有真正给人们更多的惊喜。随着Flashplayer被曝出漏洞、安全、性能之类的负面新闻,人们对HTML 5的关注度又大幅升高。

2007年到2010年,众人在对HTML 5失落和期待反复交替的日子中度过。

2010年1月,YouTube开始提供HTML 5视频播放器。

2010年8月,Google联合Arcade Fire推出了一个HTML 5互动电影:The Wilderness Downtown,此项目由著名作家兼导演Chris Milk创作。之所以叫作互动电影,是因为在开始时电影会问你小时候家住在哪里,而随后的电影剧情将在这里展开。电影使用Arcade Fire专辑《The Suburbs》中的We Used to Wait作为主题音乐。发布一年后,该电影在戛纳广告大奖赛中获得了网络组别的奖项。

2010年4月,乔帮主发表公开信“Flash之我见”。引发Flash和HTML 5阵营之间的空前口水仗,也刺激了浏览器厂商。

2012年1月10日在拉斯维加斯正在举行的CES大会上,微软CEO鲍尔默宣布了基于IE 9和HTML 5版的割绳子游戏,这是由微软及游戏开发商ZeptoLab共同推出的,用于促进IE 9的使用以及网页的美化。

虽然HTML 5也在卖力地表现,但是面对Flash的诸多漏洞、HTML 5的迟迟难产,急性的WHATWG和W3C最终还是割席分家了。

2012年7月,WHATWG工作人员在公告中写道:“近来,WHATWG和W3C在HTML 5标准上的分歧越来越大。WHATWG专注于发展标准的HTML 5格式及相关技术,并不断地修正标准中的错误;而W3C则想根据自己的开发进程制作出“标准版”HTML 5标准,颁布之后不容许更改,错误也无法修正,所以我们决定各自研发。”

这样的巨变就像王老吉和加多宝一样,不解释,只是从此意味着将会有两个版本的HTML 5——“标准版”和“living版(见图1.2)”。

图1.2 WHATWG维护的living版HTML 5

接着W3C提出的规划是:到2014年底,HTML 5将成为一种完整的成品标准。W3C还计划到2016年底发布后续版本HTML 5.1。

任何设计都有设计理念,HTML 5也有一些:

● 兼容性。

● 实用性。

● 互通性。

● 访问性。

存在即合理,历史上还有相当多的老版HTML文档,而且不能抛弃。化繁为简是HTML 5最实用的改良,无插件设计让互通性大为增强,支持所有语种让地球村访问变得如串门一般简单。

1.2.2 HTML 5和XHTML的对比

(1)文档声明简化。

        <! --XHTML中这样写:-->
        <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <! --HTML 5中这样写:-->
        <! DOCTYPE html>

(2)html标签上不需要声明命名空间。

        <! --XHTML中这样写:-->
        <html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
        <! --HTML 5中这样写:-->
        <html  lang="zh-CN">

(3)字符集编码声明简化。

        <! --XHTML中这样写:-->
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <! --HTML 5中这样写:-->
        <meta charset="UTF-8" />

(4)style和script标签type属性简化。

        <! --XHTML中这样写:-->
        <script type="text/javascript"></script>
        <style type="text/css"></style>
        <! --HTML 5中这样写:-->
        <script></script>
        <style></style>

(5)link标签连接ICON图片时可指定尺寸。

        <! --XHTML中这样写:-->
        <link rel="shortcut icon" href="http://z3f.me/favicon.ico" type="image/x-icon"
    />
        <! --HTML 5中这样写:-->
        <link rel="icon" href="http://z3f.me/favicon.gif" type="image/gif"
    sizes="16x16" />

除此以外,HTML 5没有XHTML那样严格要求标签闭合问题。对XHTML不建议使用的b和i等标签进行重定义,使其拥有语义特征。

● b元素现在描述为在普通文章中仅从文体上突出不包含任何额外信息的一段主要性文本。

● i元素现在描述为在普通文章中突出不同意见、语气或其他的一段文本。

● u元素现在描述为在普通文章中仅从文体上突出有语法问题或是中文专用名称的一段文本。