HTML5 简介

随着Web技术的发展,HTML5越来越被人们所关注,HTML5究竟是什么?有什么优势?只是一种可能会代替flash的语言吗? 本文将简单介绍HTML5, 给出答案。

  一、背景信息

  HTML 超文本标记语言的开发到1999年推出HTML4就停止了。万维网联盟(W3C)把重点转向将 HTML 的底层语法从标准通用标记语言(SGML)改为可扩展标记语言(XML),以及可缩放向量图型(SVG)、XForms 和 MathML 这些全新的标记语言。而浏览器厂商则把精力放到选项卡和丰富站点摘要(RSS)阅读器这类浏览器特性上。Web设计人员开始学习使用异步 JavaScript + XML(Ajax),在现有的框架下通过层叠样式表(CSS)和 JavaScript™ 语言建立自己的应用程序。但是在接下来的数年时间中,HTML本身没有任何变化。

  人们从1999 年起就一直期待 HTML的新版本,而为了推动Web标准化运动的发展,一些公司联合起来(主要是 Apple、Opera 和 Mozilla Foundation),他们成立了一个叫做 Web Hypertext Application Technology Working Group (Web 超文本应用技术工作组 -WHATWG) 的组织。WHATWG 致力于 Web 表单和应用程序,而 W3C(World Wide Web Consortium,万维网联盟)专注于 XHTML 2.0。在 2006 年,双方决定进行合作,来创建一个新版本的 HTML。HTML5草案的前身名为 Web Applications 1.0,于2004年提出,于2007年被 W3C 接纳,并成立了新的 HTML工作团队。HTML5的第一份正式草案已于2008年1月22日公布。HTML5 仍处于完善之中。但大部分现代浏览器已经具备了某些 HTML5 支持。

  W3C已经提出新计划,将HTML5定位为“推荐标准”。按照W3C的话来说,这意味着到2014年底,HTML5将成为一种完整的成品标准。W3C还计划到2016年底发布后续版本HTML 5.1。根据新计划,HTML工作团队将在2012年底发布一个HTML 5.0候选推荐标准,这个候选推荐标准将是5.0标准的基础。之后,HTML 5.1的草案也会被制定,其中将包括HTML 5.0的候选推荐标准,再加上任何被排除在外的不稳定功能。到2014年,HTML 5.1规范的出炉将经历类似步骤。任何不稳定功能将被剔除,产生HTML 5.1候选推荐标准,此后会制定HTML 5.2的草案,加入不稳定功能。之后HTML 5.3、5.4……标准会一直升级下去。此前, HTML 5标准计划将在2022年完成。

HTML5 简介

  二、HTML5的主要新功能

HTML5 简介

  1、音频视频播放

  视频已经在 Web 上广泛流行了,但是其格式几乎都是专有的。YouTube 使用 Flash,Microsoft 使用 Windows Media®,Apple 使用 QuickTime。在一种浏览器中用来嵌入这些内容的标记在另一种浏览器中是无效的。

  HTML5新增<audio>和<video>标签使得浏览器不需要插件即可播放视频和音频。例如,可以用以下代码嵌入一部电影:<video src="http://www.cafeaulait.org/birds/test.mov" />。

HTML5 简介

  对于以哪种格式和解码器作为首选,仍然有争议。可能会强力推荐或要求使用 Ogg Theora。还可以可选地支持 QuickTime 等专有格式和 MPEG-4 等受专利限制的格式。实际使用的格式很可能由市场决定,就像是 GIF、JPEG 和 PNG 格式那样(这些格式通过市场竞争压倒了 BMP、X-Bitmap 和 JPEG 2000 等竞争者,成为 img 元素的首选格式)。

  通过audio元素可以使用以下代码给 Web 页面加上背景音乐:<audio src="spacemusic.mp3"autoplay="autoplay" loop="20000" />。

  2、动画 Canvas

  HTML 5 引进了很多新特性,其中最令人期待的之一就是 canvas 元素。HTML 5 canvas 提供了通过 JavaScript 绘制图形的方法,此方法使用简单但功能强大。每一个 canvas 元素都有一个"上下文( context )" (想象成绘图板上的一页),在其中可以绘制任意图形。浏览器支持多个 canvas 上下文,并通过不同的 API 提供图形绘制功能。下图为基于 HTML5 Canvas 对象的 Invaders 经典游戏。

HTML5 简介

  3、地理信息

HTML5 简介

  点击地图中,黄色小人上方的圆圈,可以告诉 Google 地图你的地理位置。

  HTML5 的另一个功能是地理信息定位功能,一些浏览器提供了 geolocation API ,这个 API 也由 W3C 管理,可以结合 HTML5 实现你当前地理位置定位。Google Maps 在使用该功能,在 Google 地图上,有一个小圆圈,点击一下,就能告诉 Google 地图你现在的地理位置。目前,Geolocation API 并没有被众多桌面浏览器广泛采用(只有 Chrome 和 Firefox 3.6+ 采用了),但 Google Gears 插件可以帮助那些旧浏览器实现该功能。

  Twitter 借此实现地理信息感知的 tweets 消息,当浏览器支持geolocation API 的时候,会自动使用该 API,否则,则使用 Google Gears。

  4、硬件加速、WEB SOCKET

  5、本地离线应用程序(即使在 Internet 连接中断之后)

  6、本地存储

  相对于HTML4只能使用cookie在客户端存储数据,大小受限制,占用带宽,操作复杂的情况,HTML5支持使用Web Storage在客户端进行存储数据,容量更大,减轻带宽压力,操作简便。

  7、语义化标记

  HTML5的最大的意义在于改变了 Web 文档的结构方式,借助 header, footer, section, article 这些标签,我们可以实现更具结构化,语义化的 Web 文档。这样,搜索引擎可以更容易索引 Web 站点,我们也可以搜索到更快,更准确的信息。

HTML5 简介

  另外,借助 Microdata, HTML5 还可以实现更强大的语义结构,这个标准化的数据格式(类似 microformats),可以让你的站点不仅能够提供数据,还能提供数据定义。Microdata 对浏览器和搜索引擎都意义深远,搜索引擎可以借助 Microdata 发现你网络中的好友,而浏览器则可以藉此连接到你的社会网络好友站点。

  三、HTML5与FlASH

HTML5 简介

  Flash拥有很多资源和众多的开发者,虽然HTML5在很多方面很有前景,但目前HTML5取代FLASH还为时尚早。

  四、HTML5的优势

  1、提高可用性和改进用户的友好体验;

  2、新标签这将有助于开发人员定义重要的内容;

  3、可以给站点带来更多的多媒体元素(视频和音频);

  4、可以很好的替代FLASH和Silverlight;

  5、当涉及到网站的抓取和索引的时候,对于SEO很友好;

  6、大量应用于移动应用程序和游戏。

  五、HTML5的不足

  1、HTML5 本身还在发展中,它不是用户应用的最迫切需求,更多是厂商试图改变软件生态格局的战略需求。

  2、HTML5的兼容性受限于各大浏览器表现,例如微软的IE和fireforx之间存在很多差别。

  3、HTML5需要一个成熟完整的开发环境,目前还缺少。

  4、HTML5功能的暴增,浏览器必须有一个高效的图形引擎和脚本引擎。

  5、HTML5需要杀手级应用来吸引和引导用户升级浏览器,最终完成HTML5终端的部署。

  六、未来前景

  从2012年1月的数据来看,全球已有超过34%的网站使用了HTML5技术。除去IE6-8浏览器外,其他主流浏览器都支持HTML5,其中仅有iPhone/iPad不支持Flash。

  据IDC调查研究显示,2013年全球各地将有10亿人使用HTML5浏览器,将有200万开发人员为HTML5浏览器开发应用。HTML5在未来的5-10年中,将成为移动发展的一个重要因素。

posted @ 2017-02-12 21:16  About.Me(Name=jack)  阅读(120)  评论(0编辑  收藏  举报