移动Web应用程序开发 HTML5篇 (一) HTML5简介

开篇介绍

本系列博客将主要介绍如今大红大紫的移动Web应用程序开发最重要的三个工具:HTML5,JavaScript, CSS3。博文也分为三个大部分:

1. 众望所归的HTML5将主要介绍HTML5的前世今生,主要功能和API以及相关Demo,Demo的代码都可以在文章附件中下载到;

2. 高性能JavaScript将主要介绍如何让JavaScript更流畅,JavaScript debug和分析工具,可以说,没有JavaScript就不可能有互联网的今天,更不可能有移动互联网的明天,编写高性能的JavaScript至关重要;

3. 变化万千的CSS3将主要介绍如今异常强大的CSS3,结合HTML5编写动态的Web应用。熟练使用异常Fashion & Cool & 炫的CSS3将使Web应用增色不少

•1. Web的历史

Web的历史可以写成长长的几篇文章,我们这里只通过下面一张图做一个简单的概述。



从图中可以看出,1991年,互联网之父伯纳斯非官方的写了一个HTML的文档,进而成为了HTML的奠基之作。

1996年CSS & JavaScript出现用来弥补HTML动态性的不足,进而在1997年出现DHTML,即Dynamic HTML。

1999年HTML发布4.01版本,这个版本一用就是10余年。当然期间W3C发布了XHTML(XML+HTML)的相关规范,但是由于其过于苛刻和教条,很快被广大的Web开发者所抛弃,反而由Opera,Mozilla, Apple等几家公司组成叫做WHATWG的"民间机构"所遵循的HTML标准受到很大的欢迎。

进而在2007-09年,W3C见XHTML难以为继的情况下,顺水推舟,将WHATWG的标准扶上正位,添加了很多非常有用的Tag和相应的API,发布了HTML5的标准。

•2. HTML5是什么?

那么什么是HTML5呢,Google一下可能会得到各种各样异常丰富的答案,基于上面的历史,个人认为HTML5主要可以描述为以下几个部分的内容:

1. HTML5是一个新的标准,基于HTML4,XHTML,HTML DOM之上的。

2. HTML5包含了新的非常有用的Tag,这些Tag更加语义化,便于网页内容的搜索和获取,这些Tag包括Video, Form, Input, data list, article, aside, nav, detail 等等,这些会在接下来的博文中一一介绍。一个优秀的HTML5应用,我们可以根据它的tag得知其主要内容。

3. 新的HTML5 APIs,这些API都使得开发Web应用变得更加方便。如:Canvas API(游戏),Audio & Video(多媒体),Geolocation API(LBS),Communication APIs(IPC),Web Sockets API(IMC),Web Storage API(本地存储),Offline Web Applications等等。

4. HTML5需要和JavaScript,CSS一起才能打造非常优秀的Web应用。

•3. HTML5和其他工具的关系

1. HTML5 VS Flash

相信大家都还记得一年前教主Jobs的那篇广为流传也成为Apple与Adobe反目导火索的文章,Thoughts on Flash, 当年Jobs认为Flash是没有前景的最大理由就是将来HTML5将取代Flash。那么这两者是什么关系?

Flash可以说是Adobe公司的当家产品之一,它很好地填补了传统HTML网页动态性交互性不足的情况,所以其在过去的十年中获得了异常的成功,这十年也正式HTML标准停滞的十年。当HTML5标准提出,各大浏览器厂商原生支持之后,所有Flash能够完成的工作HTML5+JavaScript+CSS3都可以完成,而且最重要的一点是不增加额外开销。运行Flash,需要在浏览器中安装Flash Player的插件,这会导致额外的性能开销,进而影响异常宝贵的电池使用寿命。相信说道这里大家应该都明白了,这也是为什么最近Adobe对HTML5也异常热心的原因,没有一家公司愿意成为时代的Loser。

2. HTML5 VS AJAX

其实二者没有太大的关系,都是作为Web开发的工具,与Flash不同,HTML5和AJAX可以完全共存,而且优秀的HTML5应用更需要AJAX的帮忙。因为HTML5代码负责一个前端的内容显示工作,而AJAX可以从后端异步地获取数据给前端显示。

 

•4. HTML5开发工具

目前可供使用的HTML5开发工具有:



上图是相应的Logo, 个人推荐使用前三者,不仅是因为比较流行和方便,而且和各自的平台能够无缝对接。Chrome开发工具可以更好的对接Chrome OS以及Android,Firefox在Web开发中的实力向来是领先的,Microsoft VS可以和将来的Win8 SDK 无缝对接用来基于Web开发Metro Style Apps.

本篇完,下篇中将主要介绍HTML5新的Tags,以及其用法。

Per informazioni complete sulle ottimizzazioni del compilatore, consultare l'Avviso sull'ottimizzazione